How to Resolve CORS Error: 'Redirect has been blocked' in Vue.js with Chrome Plugins?

CORS Error: 'Redirect has been blocked' Resolved with Chrome Plugins

While attempting to set a change to a URL variable in a Vue.js application, you may encounter the error message: "Redirect has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header." This error indicates that the request sent to another domain or server (in this case, '172.16.1.157:8002') is blocked by the browser's Cross-Origin Resource Sharing (CORS) policy.

To resolve this error, there are several options:

1. Modify the Server Configuration:
   Request the person responsible for the server to configure the '172.16.1.157:8002' domain to include the 'Access-Control-Allow-Origin' header with the value 'http://localhost:8080' (or the appropriate origin).

2. Use a CORS-modifying Chrome Plugin:
   Install a Chrome plugin that allows you to modify the origin of your request. Several such plugins are available:

   • Allow CORS: Access-Control-Allow-Origin (recommended)
   • Moesif Origin & CORS Changer (note: now requires a work email address)

   These plugins will enable your local development server (e.g., 'localhost:8080') to appear to be coming from the '172.16.1.157:8002' domain.

The above is the detailed content of How to Resolve CORS Error: 'Redirect has been blocked' in Vue.js with Chrome Plugins?. For more information, please follow other related articles on the PHP Chinese website!