Debug profile CORS issue with Chrome 76

I've just run into an issue this morning, which I think is due to Chrome updating itself

I'm debugging a VueJS application, which was working fine last night.

When I run the application, and open localhost from a standard browser window the application works absolutely as expected.

However, when I try and run a JavaScript debugger from WebStorm I get a slew of CORS errors.

10 comments
Comment actions Permalink

the same to me

0
Comment actions Permalink

Debugging Vue.js in Chrome 76.0.3809.100 works fine for me, no CORS issues. What server is your app hosted on, what errors can you see namely?

0
Comment actions Permalink

See also https://support.google.com/chrome/thread/11089651?hl=en:

Cross-Origin Resource Sharing (CORS) is subject of change in Chrome version 76. New headers are introduced as part of security and those must handled in the code. Later the CORS requests of extensions must be handled in background pages rather then content scripts.
Read all about the recommended actions (for developers) and further restrictions on this page of Google:
 
For updates you can follow this bug report:
For information about Cordova specifically, follow the updates here:
1
Comment actions Permalink

Thanks for the updates.

Both are localhost.

I am testing VueJS against out current backend and have an unlocked version which allows CORS. The backend server is NodeJS/Hapi.

The front-end application is VueJS running the standard VueJS `npm serve` script.

As I said above I can access the front-end through a "normal" Chrome window. It's getting Webstorm to hook into the debugger through a standard Webstorm JavaScript Debug Configuration.

Is there anything on there that we can do? Or do we wait for a Webstorm update?

0
Comment actions Permalink

>Is there anything on there that we can do? Or do we wait for a Webstorm update?

Updating WebStorm will unlikely help, as I'm not aware of any issues in it that might cause the problem.

So, once more: what errors can you see namely? Does enabling Allow unsigned requests option in Settings | Build, Execution, Deployment | Debugger make any difference?

4
Comment actions Permalink

Thank you.

Error is 

"Access to XMLHttpRequest at 'https://<machinename>api/v2/jobs' from origin 'http://localhost:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource."

So I may be able to change the Vue server to post on "<machinename>"

Unsigned requests does fix the problem

0
Comment actions Permalink

Unsigned requests fixes it for me as well

0
Comment actions Permalink

Unsigned requests fixed it here too.

Browsing to localhost when not in Debug works fine on its own. I don't like the idea of having to check that box. It's actually causing things to work differently to a normal browsing experience. Things might end up getting allowed, that we really don't want to be, but might not be aware of it until later testing outside of the development environment.

0
Comment actions Permalink

When debugging, the x-ijt header is sent for request signing to prevent requests from outside from being rejected; header is not sent if "Allow unsigned connections" is enabled, so, if you are facing issues because of this header, you have to turn this option on.

 

2
Comment actions Permalink

Allow unsigned requerst(webstorm settings > Build, Execution, Deployment > Debugger > Build-in server > option) does fix it.

But I think it's not good way to solve the problem like Nick Taylor.

And following errors still have occured!

 

GET https://localhost:8080/sockjs-node/info?t=1566019099198 net::ERR_CERT_AUTHORITY_INVALID

GET https://localhost:8080/sockjs-node/info?t=1566019099198 net::ERR_CERT_AUTHORITY_INVALID

GET https://localhost:8080/sockjs-node/info?t=1566019099198 net::ERR_CERT_AUTHORITY_INVALID

GET https://localhost:8080/sockjs-node/info?t=1566019099198 net::ERR_CERT_AUTHORITY_INVALID

...

0

Please sign in to leave a comment.