Javascript Web包devserver代理无法解决CORS问题
我有一个React应用程序,它在端口3000上运行webpackdevserver 我有一个AWS.NetCore Lambda服务器,在端口5050上运行localhost 当我尝试提出请求时,我收到了cors错误: 在'http://localhost:5050/"从源头上说, 'http://localhost:3000'已被CORS策略阻止:响应 飞行前请求未通过访问控制检查:否 “Access Control Allow Origin”标头出现在请求的服务器上 资源。如果不透明的响应满足您的需要,请设置请求的 模式设置为“无cors”,以获取禁用cors的资源 我希望使用一个代理,根据这里的文档,以便转发我的请求,使用相同的域来绕过这个问题 但是它不起作用,我看不出应用的设置有任何区别,有人能帮忙吗Javascript Web包devserver代理无法解决CORS问题,javascript,c#,webpack,cors,webpack-dev-server,Javascript,C#,Webpack,Cors,Webpack Dev Server,我有一个React应用程序,它在端口3000上运行webpackdevserver 我有一个AWS.NetCore Lambda服务器,在端口5050上运行localhost 当我尝试提出请求时,我收到了cors错误: 在'http://localhost:5050/"从源头上说, 'http://localhost:3000'已被CORS策略阻止:响应 飞行前请求未通过访问控制检查:否 “Access Control Allow Origin”标头出现在请求的服务器上 资源。如果不透明的响应满
devServer: {
port: 3000,
disableHostCheck: true,
compress: true,
host: 'localhost',
proxy: {
'/': {
target: 'http://localhost:5050',
secure: false,
},
},
},
我调用服务器的JavaScript如下所示。。。我也尝试过urlhttp://localhost:3000
但这只是返回一个错误的请求错误
const result = await fetch('http://localhost:5050', {
method: 'POST',
headers: new Headers({ 'Access-Control-Allow-Origin': '*' }),
body: JSON.stringify({
method: 'upload',
test: 'test',
}),
});
我想问题在于设置
/
,它可以只获取当前服务器,因此您可能需要区分web应用程序和服务器(最有可能通过特定路径,例如/api
,但您可以选择是否将此路径传递给代理服务器)
因此,您将更改如下:
- 您的代理配置首先采用
通过代理:api
代理:{
“/api”:{
目标:'http://localhost:5050',
pathRewrite:{'^/api':''},//在本例中,我们不传递'api'路径
}
}
- 下一件事是将代码更改为正常调用相同的域+端口
(代理将通过使用您配置的端口3000
传递到服务器来为您完成其余操作):5050
const result=wait fetch('http://localhost:3000/api', {
// ...
});
非常感谢您的回复。我想我的问题是我使用的是AWS lambda,所以我真的不知道是否可以为它创建一个不同的端点,它们似乎都在根上,我在另一个主体中传递。api
路径就是要知道应该将哪个端点传递给代理,这样它就不会影响到你的服务器,因为它会发送到你的根服务器urlah好的,对不起,我明白你的意思了。我已经试过了,但是现在我得到了以下错误POSThttp://localhost:3000/api net::ERR_中止400(错误请求)
有什么想法吗?您可以检查终端中的日志并调试本地服务器以了解有关错误的更多信息。还要检查代理是否也相应地将请求传递给服务器我想我已经意识到了问题所在,似乎我无法使用正常的restAPI连接到端点,它使用的是“AWS.NETCore3.1MockLambda测试工具”,我想它必须使用WebSocket或其他东西来连接,就像我在《邮递员》中尝试的那样,我也无法发布任何东西。我接受了这个答案,因为我认为我正在打一场失败的战斗。