openpixel icon indicating copy to clipboard operation
openpixel copied to clipboard

CORB problem in Chrome and in near time in Firefox too

Open lleiton opened this issue 3 years ago • 6 comments

I add a project in a website, but have a problem with CORB actually only in Chrome but in near time Firefox show information adding this control to.

https://www.chromestatus.com/feature/5629709824032768

You know how can i fix this in an openpixel code ?

Thanks in advance !

Luis

lleiton avatar Oct 14 '20 02:10 lleiton

Would you mind sharing a screenshot of the errors you are seeing in the Chrome console or more providing some more information about what is happening?

stuyam avatar Oct 16 '20 21:10 stuyam

Screen Shot 2020-11-11 at 11 30 46 AM Everything works fine if i add header('Access-Control-Allow-Origin: DOMAIN_NAME_HERE'); in my .php file where i am inserting data in my db... if i dont put header() then i get CORS error as defined in image attached...

hashiranwaar avatar Nov 11 '20 07:11 hashiranwaar

I really don't know enough about this stuff but I wish I did. Is it because Chrome now gives the same CORS rules to sendBeacon? Should we just use the img tag insert strategy for all browsers regardless of it they support sendBeacon or not? Some more details from the codebase of how we send events: https://github.com/dockwa/openpixel/blob/master/src/pixel.js#L56

stuyam avatar Nov 12 '20 02:11 stuyam

As documented below CORB has no impact on beacon requests. I created a simple express server and sent a beacon request to it via ngrok (I made the endpoint be globally available) and seems it's working fine.

https://chromium.googlesource.com/chromium/src/+/master/services/network/cross_origin_read_blocking_explainer.md

The problem may be related to your backend and/or server configuration(s). It would be great to have a simple backend project with the same configuration to be able to do some tests and reproduce the case on our local machines.

hsynlms avatar Nov 12 '20 16:11 hsynlms

I think the issue here lays more in the HTTPS requests from a HTTP host. Make sure both hosts have the same protocol.

django23 avatar Jan 22 '21 13:01 django23

Hi django23! that's the problem We tried to change beacom () to fetch () and we managed to eliminate the CORB error, but we have problems with the close () event and this information is necessary. Function: fetch(this.getSourceUrl(), Headers: headers: { "Content-type": "application/x-www-form-urlencoded; charset=UTF-8", "Cross-Origin-Resource-Policy": "cross-origin" }

lleiton avatar Jan 22 '21 17:01 lleiton