CORB problem in Chrome and in near time in Firefox too

[lleiton]

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

[stuyam]

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?

[hashiranwaar]

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...

[stuyam]

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

[hsynlms]

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.

[django23]

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

[lleiton]

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"
}