Javascript CORS 请求,没有 'Access-Control-Allow-Origin' header 存在 200 状态码
Javascript CORS request, No 'Access-Control-Allow-Origin' header is present with 200 status code
我遇到了与 类似的问题。不幸的是,我不明白答案,想了解根本原因。
高级数据流:
Javascript/HTML(Deployed in S3) -> AWS API Gateway. Gateway will
return the data back.
这是我的理解和事实:
Since my javascript code is in S3, I have to make CORS request to API
Gateway to fetch the data. From the code perspective, there is nothing
special between CORS request and Same-Origin Request.
Also my code will actually make the request the api gateway and get 200 status code(found it in Network tab - Chrome).
However, from the console tab - Chrome I am getting No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin '<placeholder>' is therefore not allowed access.
JavaScript代码:
var xhr = new XMLHttpRequest();
xhr.open('GET', URL);
xhr.send();
我的问题:
- First, From the code perspection, there is nothing special between CORS request and Same-Origin request. Is this correct?
- From my understanding, When making CORS request, we actually make 2 requests. the first one is to make a request to OPTIONS method to make sure we are able to make the actual request. If the server side returns 'Access-Control-Allow-Origin': '*'. then the second request can be sent. Is this correct?
- If the above 1,2 are correct, Do I miss anywhere? I have already configured the API gateway to allow CORS and tested it. Its returning the response header
{"Access-Control-Allow-Origin":"*","Access-Control-Allow-Methods":"GET,OPTIONS","Access-Control-Allow-Headers":"Content-Type,X-Amz-Date,Authorization,X-Api-Key,X-Amz-Security-Token","Content-Type":"application/json"}
总算搞清楚了!
首先,根据我的理解,CORS 请求的技术知识是正确的。基本上,当我们需要一个 CORS 时,服务器端的响应头应该有
{"Access-Control-Allow-Origin":"*","Access-Control-Allow-Methods":"GET,OPTIONS","Access-Control-Allow-Headers":"Content-Type,X-Amz-Date,Authorization,X-Api-Key,X-Amz-Security-Token","Content-Type":"application/json"} .
但是我的案子怎么了?
I am using api gateway as server and enable CORS but I am not aware of the issue that I am integrating my api gateway with lambda func. In this case, Our lambda func must return the response with correct header.
解决方案?
Adding the header mentioned above as the part of the return of lambda func.
我遇到了与
高级数据流:
Javascript/HTML(Deployed in S3) -> AWS API Gateway. Gateway will return the data back.
这是我的理解和事实:
Since my javascript code is in S3, I have to make CORS request to API Gateway to fetch the data. From the code perspective, there is nothing special between CORS request and Same-Origin Request.
Also my code will actually make the request the api gateway and get 200 status code(found it in Network tab - Chrome). However, from the console tab - Chrome I am getting
No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin '<placeholder>' is therefore not allowed access.
JavaScript代码:
var xhr = new XMLHttpRequest();
xhr.open('GET', URL);
xhr.send();
我的问题:
- First, From the code perspection, there is nothing special between CORS request and Same-Origin request. Is this correct?
- From my understanding, When making CORS request, we actually make 2 requests. the first one is to make a request to OPTIONS method to make sure we are able to make the actual request. If the server side returns 'Access-Control-Allow-Origin': '*'. then the second request can be sent. Is this correct?
- If the above 1,2 are correct, Do I miss anywhere? I have already configured the API gateway to allow CORS and tested it. Its returning the response header
{"Access-Control-Allow-Origin":"*","Access-Control-Allow-Methods":"GET,OPTIONS","Access-Control-Allow-Headers":"Content-Type,X-Amz-Date,Authorization,X-Api-Key,X-Amz-Security-Token","Content-Type":"application/json"}
总算搞清楚了!
首先,根据我的理解,CORS 请求的技术知识是正确的。基本上,当我们需要一个 CORS 时,服务器端的响应头应该有
{"Access-Control-Allow-Origin":"*","Access-Control-Allow-Methods":"GET,OPTIONS","Access-Control-Allow-Headers":"Content-Type,X-Amz-Date,Authorization,X-Api-Key,X-Amz-Security-Token","Content-Type":"application/json"} .
但是我的案子怎么了?
I am using api gateway as server and enable CORS but I am not aware of the issue that I am integrating my api gateway with lambda func. In this case, Our lambda func must return the response with correct header.
解决方案?
Adding the header mentioned above as the part of the return of lambda func.