2

I have written a Chrome extension which modifies the appearance of an external website (not accessible to me on the server side). The content.js file is written in jQuery and it works fine as long as I keep a copy of the jQuery API in the root of the extension's folder, and declare the file's name under "content_scripts": "matches": in the extension's manifest.json file. But it shouldn't be necessary to use a local file, should it? Can't I link to https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js instead? In this post, it is suggested to add the link under "content_scripts": "matches": but that will not work.

I thought this would be a really basic problem and that the answer would be something obvious and heavily upvoted, but I can't find anything like that here. Sorry If it's because I'm thick.

6
  • 1
    No. It's a bad idea. Extensions run in privileged context so you need to include the library in the package where it can be verified by Chrome unlike the remote URL that can be hacked remotely or redirected to a malicious server. If you're concerned with the size, consider not using jQuery unless it's more than a few calls. Commented Sep 19, 2019 at 12:05
  • OK I see. My options.js file also uses jQuery, but here linking to the remote URL is used via modification of the manifest's content_security_policy to "script-src 'self' https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js; object-src 'self'". Is that relaxation of the CSP also a bad idea? Commented Sep 19, 2019 at 14:29
  • Yes, loading of any external code via relaxed CSP in the privileged context of extensions is a bad idea and Chrome won't allow it in ManifestV3 extensions. Commented Sep 19, 2019 at 14:31
  • OK – then the obvious way out is to use the local copy of jquery in that case as well. However, I can't find out how to tell options.js to use the jquery file. I guess it's something in the manifest, or do I have to change something else? I would rather not paste the entire jquery file into options.js. Commented Sep 19, 2019 at 15:13
  • 1
    The options page is a normal html page so just use a <script> tag to load jquery.js Commented Sep 19, 2019 at 15:28

1 Answer 1

2

TL;DR: Download the library, distribute it within your extension, and use it just like any other script in your extension.

Reasons:

Loading an external script is a bad idea generally even if it's a well-known library like jQuery.

  1. Extensions run in privileged context. The content scripts are severely limited, of course, but still they have messaging access to their background scripts and there could be quite a lot of damage if the remote code was hacked or redirected to a malicious server or proxy.

  2. Remote code will be forbidden soon in Manifest V3 extensions, probably in a year or so, and eventually it's likely to be enforced for Manifest V2 extensions as well.

  3. Remote code can't be verified by Chrome when it periodically checks the locally installed extensions to ensure their files weren't modified by some malware in the OS or just due to a disk malfunction that resulted in the loss of data/files.

  4. Won't work offline if the loaded code was evicted from the browser cache.

Notes:

  • If you're concerned with the extension size and there's just a few (dozens of) calls to jQuery, consider not using jQuery at all.
  • If you're concerned with automatic updates/fixes applied to jQuery then adopt the more responsible approach: only include an updated library after testing it and ensuring everything works as expected.
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.