Node.js 422错误缺少访问控制允许原点响应标头_Node.js_Nginx_Amazon S3_Cors_Amazon Cloudfront

Node.js 422错误缺少访问控制允许原点响应标头

node.js nginx amazon-s3 cors

Node.js 422错误缺少访问控制允许原点响应标头,node.js,nginx,amazon-s3,cors,amazon-cloudfront,Node.js,Nginx,Amazon S3,Cors,Amazon Cloudfront,1）我已经让我的react应用程序托管在一个S3存储桶中，由Cloudfront提供，并带有一个自定义域 2）然后我让我的Express API服务器使用Nginx/PM2在Lightsail实例上运行现在，当从我的React调用端点时，我遇到了422CORS问题。我尝试了以下方法： 1）将以下CORS规则添加到包含my React应用程序资产的S3 bucket中： <CORSConfiguration xmlns="http://s3.amazonaws.com/doc/200

1）我已经让我的react应用程序托管在一个S3存储桶中，由Cloudfront提供，并带有一个自定义域

2）然后我让我的Express API服务器使用Nginx/PM2在Lightsail实例上运行

现在，当从我的React调用端点时，我遇到了

CORS问题。我尝试了以下方法：

1）将以下CORS规则添加到包含my React应用程序资产的S3 bucket中：

<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>HEAD</AllowedMethod>
    <AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>

3）在我的React应用程序的cloudfront发行版的“行为”页面中：

“基于所选请求头缓存”->将

源文件头列为白名单


允许所有http方法
转发所有cookies
也转发所有“查询字符串转发和缓存”


但还是没有运气
我可以通过运行以下命令得到一些响应：
curl-s-D--H“原点：https://app.react.app" https://api.react.app/isOnline

curl-i-X选项https://api.react.app/isOnline
让我HTTP/1.1 204没有内容
成功
我还能试什么。。。？欣赏任何指针。
如果要确保访问控制允许原点
头包含在422
错误响应或其他4xx
响应中，则需要将始终
参数附加到添加头
指令中，如下所示：
add_header 'Access-Control-Allow-Origin' '*' always;

否则，如果您不包括始终
参数，nginx将只向2xx
成功响应和3xx
重定向添加Access Control Allow Origin
标题，而不向4xx错误添加。
如果要确保422
错误响应或其他4xx
响应中包含Access Control Allow Origin
标题，则需要将always
参数附加到add_header
指令中，如下所示：
add_header 'Access-Control-Allow-Origin' '*' always;

否则，如果您不包括始终
参数，nginx将只向2xx
成功响应和3xx
重定向添加Access Control Allow Origin
标题，而不向4xx错误添加。
查看位于的文档。
您可以尝试始终执行add_header“Access Control Allow Origin”*-也就是说，将始终
关键字附加到添加头
指令中。否则，如果您不这样做，nginx将只将Access Control Allow Origin头添加到2xx成功响应和3xx重定向中，而不会添加到4xx错误中。这将解决CORS问题-但问题仍然是服务器的响应为422错误，而不是200 OK成功响应。您可以尝试使用curl发出选项请求，如下所示：curl-X OPTIONS[other args][Express API端点的URL]
。如果https://app.react.app
是运行您发出请求的前端代码的React应用程序的URL，当您使用curl进行测试时，您不想向https://app.react.app
-相反，您希望向Express API端点发出请求。谢谢@sideshowbarker。执行curl-i-X[expressapi端点的URL]
会给我HTTP/1.1204没有预期的内容！但为什么浏览器中的422和CORS仍然无法读取myhttps://api.react.app/some_endpoint
：（似乎您需要检查Express API endpoint server服务器端的服务器日志，并查看它在那里记录的哪些消息导致它最终返回422响应。您无法访问这些日志是因为什么原因吗？或者您是否已经检查了这些日志，但没有发现任何内容？@sideshowbarker它正在工作ode>总是
是一张罚单。422
与这里的CORS问题无关（这是我明确设置的错误代码，对不起！）。如果你要编辑问题并为此创建答案，我将完全接受！（编辑：我将尝试还原项目1和3，看看它是否仍然有效。）您可以尝试执行add_header'Access Control Allow Origin'*'always；
-也就是说，将always
关键字附加到add_header
指令中。否则，如果您不这样做，nginx将只将Access Control Allow Origin header添加到2xx成功响应和3xx重定向，而不会添加到4xx错误t将修复CORS问题-但问题仍然是服务器的响应为422错误，而不是200 OK成功响应。您可以尝试使用curl发出选项请求，如下所示：curl-X OPTIONS[other args][Express API端点的URL]
。如果https://app.react.app
是运行您发出请求的前端代码的React应用程序的URL，当您使用curl进行测试时，您不想向https://app.react.app
-相反，您希望向您的Express API端点发出请求。谢谢@sideshowbarker.Doingcurl-i-X[Express API端点的URL]
给我HTTP/1.1 204没有预期的内容
！但为什么浏览器中的422
和CORS仍然无法读取我https://api.react.app/some_endpoint
：（似乎您需要检查Express API endpoint server服务器端的服务器日志，并查看它在那里记录的哪些消息导致它最终返回422响应。您无法访问这些日志是因为什么原因吗？或者您是否已经检查了这些日志，但没有发现任何内容？@sideshowbarker它正在工作ode>总是
是一张罚单。422
与这里的CORS问题无关（这是我明确设置的错误代码，对不起！）。如果你要编辑问题并为此创建一个答案，我将完全接受！（编辑：我将尝试还原项目1和3，看看是否正确！）