Enable cross origin requests blocked by CORS or CSP. Disable CORS and CSP in selected hostnames, preserve security of other websites
The extension enables cross origin requests with fetch() or XMLHttpRequest (XHR) objects that are blocked by CORS policy or violate the document’s Content Security Policy. It is an easiest way to solve CORS errors during development.
Internally the extension bypasses Cross-Origin Resource Sharing (CORS) and Content Security Policy (CSP) by setting permissive Access-Control-Allow-Origin, Access-Control-Allow-Methods, Access-Control-Allow-Headers, Access-Control-Allow-Credentials and Content-Security-Policy response headers.
User guide:
Click the extension icon in the tab with the URL on which you want to enable cross-origin requests. CORS policy gets disabled in all the tabs with the same hostname. The tabs with web pages from other hosts are not affected. Any fetch() or XHR requests will succeed unless they are blocked by CSP. To disable CSP the pages have to be reloaded.
Typical use case:
You develop an enterprise web application whose functionality depends on already existing web services. The production environment has the same hostname as the web services, but the development environment is set up in your office and has a different hostname. The web services do not support the cross-origin requests. Thus, in the development environment HTTP requests to the essential web services are prevented by the CORS mechanism in the browser. You can imagine a solution based on a reverse proxy and the environment-dependent URLs for the REST services, or you can opt for the effortless solution not to do anything more than installing a browser extension.
Not only CORS, but also CSP prevents cross-origin requests. A strict CSP is an increasingly common security requirement. As with CORS, you could set up different policies for the development and production environment, but it is easier to use an extension instead of configuring environment-specific application settings.
How this extension is better than other extensions:
- The extension is domain-specific. Cross-origin requests gets enabled, i.e. CORS and CSP get disabled, not globally in all browser tabs, but only in the tabs with the hostnames that you have selected by clicking on the extension icon. Thus, the extension does not compromise the security of all websites opened in your browser.
- The extensions is open source and, thus, is safe.
- The extension relaxes both CORS and CSP.
- Cross origin requests with cookies are supported. The extension sets not an asterisk but the exact origin in the Access-Control-Allow-Origin header.
- The extension does not disrupt function of any popular websites such as Youtube.com or Google Docs
- The extension does not have any settings and does not need to be configured.
- Besides the icon, the extension does not have any user interface.
How to test a CORS extension
There are two criteria:
- Cross origin requests become possible. You can test all possible requests, i.e. GET, POST, PUT, DELETE, PATCH with or without credentials, on https://crossoriginrequests.onrender.com
- Function of other websites, e.g. youtube.com or docs.google.com, should not be disrupted even when the extension is activated in their tabs.
The source code of the anti-CORS extension is explained in https://marian-caikovski.medium.com/how-to-bypass-cors-and-csp-policies-and-enable-cross-origin-requests-in-a-browser-47fe269500fb
The plain source code can be extracted from the extension or downloaded from https://github.com/marianc000/antiCors
