node.js - CORS: The 'Access-Control-Allow-Origin' header has a value 'http://localhost:3000' that is not equal to the supplied origin - TagMerge
4CORS: The 'Access-Control-Allow-Origin' header has a value 'http://localhost:3000' that is not equal to the supplied originCORS: The 'Access-Control-Allow-Origin' header has a value 'http://localhost:3000' that is not equal to the supplied origin

CORS: The 'Access-Control-Allow-Origin' header has a value 'http://localhost:3000' that is not equal to the supplied origin

Asked 1 years ago
4 answers

If this is only your local nginx, you can do this in your nginx config

add_header Access-Control-Allow-Origin *; - Remember not to promote this to higher environments

From the console, you can run a fetch or via postman to see if the server is honoring the directive and sending the access control in response headers - you could also open the host to see if the diretive is being passed - nginx may throw an error if a directive cannot be set in a particular situation

Source: link


var corsOptions = {
    origin: "",
    optionsSuccessStatus: 200, // For legacy browser support

try this middleware if this cors not works avoid cors implementing below custom middleware

app.use((req, res, next) => {
  res.setHeader("Access-Control-Allow-Origin", "*");
  res.setHeader("Access-Control-Allow-Headers", "Content-Type, Authorization");

Source: link


HTTP header
Access-Control-Allow-Origin: *
When performing certain types of cross-domain Ajax requests, modern browsers that support CORS will initiate an extra "preflight" request to determine whether they have permission to perform the action. Cross-origin requests are preflighted this way because they may have implications to user data.
Access-Control-Request-Method: PUT
If is willing to accept the action, it may respond with the following headers:
Access-Control-Allow-Methods: PUT, DELETE

Source: link


For example, suppose web content at https://foo.example wishes to invoke content on domain https://bar.other. Code of this sort might be used in JavaScript deployed on foo.example:
const xhr = new XMLHttpRequest();
const url = 'https://bar.other/resources/public-data/';'GET', url);
xhr.onreadystatechange = someHandler;
Let's look at what the browser will send to the server in this case, and let's see how the server responds:
GET /resources/public-data/ HTTP/1.1
Host: bar.other
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.14; rv:71.0) Gecko/20100101 Firefox/71.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip,deflate
Connection: keep-alive
Origin: https://foo.example
The request header of note is Origin, which shows that the invocation is coming from https://foo.example.
HTTP/1.1 200 OK
Date: Mon, 01 Dec 2008 00:23:53 GMT
Server: Apache/2
Access-Control-Allow-Origin: *
Keep-Alive: timeout=2, max=100
Connection: Keep-Alive
Transfer-Encoding: chunked
Content-Type: application/xml

[…XML Data…]
In response, the server returns a Access-Control-Allow-Origin header with Access-Control-Allow-Origin: *, which means that the resource can be accessed by any origin.
Access-Control-Allow-Origin: *
This pattern of the Origin and Access-Control-Allow-Origin headers is the simplest use of the access control protocol. If the resource owners at https://bar.other wished to restrict access to the resource to requests only from https://foo.example, (i.e no domain other than https://foo.example can access the resource in a cross-origin manner) they would send:
Access-Control-Allow-Origin: https://foo.example

Source: link

Recent Questions on node.js

    Programming Languages