xcv58 / Custom-JavaScript-for-Websites-2

Run custom JavaScript on any website
https://xcv58.xyz/inject-js
MIT License
180 stars 46 forks source link

External script stopped working since update to 3.4.1 #84

Closed begrs closed 4 years ago

begrs commented 4 years ago

The external script is no longer being loaded.

The website specific code:

requirejs.config({ baseUrl: 'http://someurltoouronpremiseserver/js/file.js }); requirejs(['UserConfigs/my_config'], function() { requirejs(['dist/plugins.dev']); });

External Scripts: //cdnjs.cloudflare.com/ajax/libs/require.js/2.3.6/require.min.js

The code is in version control and was not changed on my part. The only thing changed since it stopped working is the update to 3.4.1 The message in the browser console is: "ReferenceError: requirejs is not defined" originating from the website specific code pasted above.

Best Regards

Wiethoofd commented 4 years ago

Looks like some javascript snippets are simply not being loaded or executed anymore.

The default provided customjsReady (according to the readme.md) also throws the following error when used in any code you try to run: Uncaught ReferenceError: customjsReady is not defined

xcv58 commented 4 years ago

I believe it's caused by #79 I will try to fix this.

xcv58 commented 4 years ago

The customjsReady doesn't work for some webpages if their server returns specific content security policy. For example, the GitHub has below policy, so that the base.js injection would fail:

Content-Security-Policy: default-src 'none'; base-uri 'self'; block-all-mixed-content; connect-src 'self' uploads.github.com www.githubstatus.com collector.githubapp.com api.github.com www.google-analytics.com github-cloud.s3.amazonaws.com github-production-repository-file-5c1aeb.s3.amazonaws.com github-production-upload-manifest-file-7fdce7.s3.amazonaws.com github-production-user-asset-6210df.s3.amazonaws.com wss://live.github.com; font-src github.githubassets.com; form-action 'self' github.com gist.github.com; frame-ancestors 'none'; frame-src render.githubusercontent.com; img-src 'self' data: github.githubassets.com identicons.github.com collector.githubapp.com github-cloud.s3.amazonaws.com *.githubusercontent.com; manifest-src 'self'; media-src 'none'; script-src github.githubassets.com; style-src 'unsafe-inline' github.githubassets.com

However, I can't reproduce @begrs 's bug. Could you please tell me your Chrome, OS version, and the webpage you tried to use?

I'm on macOS 10.15.1, Chrome Version 77.0.3865.120 (Official Build) (64-bit). I tried on both github.com and google.com

begrs commented 4 years ago

System: Win10, Chrome Version 77.0.3865.120 (Offizieller Build) (64-Bit)

The url on which I use cjs is a http (not https) page that is hosted on a webserver in the local Intranet. That is why I can not send you the url. The webserver is only accessible from the same network my PC is connected to. The webserver does not run locally on my PC so the usual content policy restrictions that mess things up should not be responsible here (in my perception). The webserver and its config files are fully version controlled so I can say with confidence that nothing changed in the last few days where the bug first occured. (in fact the config and webserver files were not changed for over a year.)

However, the js file that is not loaded - requirejs - is the exact same one I posted above from the cdn.

Best Regards

xcv58 commented 4 years ago

Thanks @begrs

Is there any console log when you load the website? If yes, is it possible to share it so that I can find the root cause?

begrs commented 4 years ago

run.js:2 Custom JavaScript for websites enabled. Please visit https://xcv58.xyz/inject-js if you have any issue.

data:text/javascript;base64,cmVx...censored by me..Sk7:1 Uncaught ReferenceError: requirejs is not >defined at data:text/javascript;base64,cmVx...censored by me..Sk7:1 (anonymous) @ data:text/javascript;base64,cmVx...censored by me..Sk7:1

default.aspx:1 A cookie associated with a cross-site resource at http://cloudflare.com/ was set without the SameSite attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with SameSite=None and Secure. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.

Thats the log from the dev console for the website. The middle one is the error.

There is no background page to debug so here is the domain list from the sources tab in the chrome dev tools, used on the website that I try to use cjs with:

cjs_script_domains

xcv58 commented 4 years ago

Thanks, now I can reproduce the bug, will work on this in few hours.

xcv58 commented 4 years ago

I find a quick workaround. We can wrap the function with setTimeout to defer when it executes. Because it seems the injection succeeds. But since they are injected at the same time, when your script executes the library is ready.

The sample code:

const test = () => {
  console.log(typeof requirejs)
  console.log(typeof customjsReady)
}
setTimeout(test, 1000);
test()

console output:

Custom JavaScript for websites enabled.
Please visit https://xcv58.xyz/inject-js if you have any issue.
undefined
undefined
function
function

I'll try to find the root cause and try to fix it.

xcv58 commented 4 years ago

It should be fixed in v3.4.2

@begrs could you please confirm whether it works on your side?

soavarice commented 4 years ago

$.getScript('https://.../index.js'); returning in the console ->Uncaught ReferenceError: $ is not defined I think is this since 3.4 version

begrs commented 4 years ago

Sorry, I was out of the office until today.

Confirmed, the issue is resolved in 3.4.2 ! Thanks for the quick response :)

regarding @soavarice : The reason my snippet uses requirejs in the beginning, is that our scripts would sometimes be loaded out of order because the internal webserver hosting http://someurltoouronpremiseserver/js/file.js was sometimes slower than the cdn. This is therefore not an issue with cjs. Maybe using require js to ensure the order of dependent js files would help in your case too.

xcv58 commented 4 years ago

@soavarice could you please create another issue if the problem persists?