webpack-dev-server并在同一个端口上表达？

Question

我在开发环境中遇到跨域问题，其中webpack-dev-server在端口8080上运行，而后端在端口5000上运行。

1. 后端api方法通过AJAX调用引发CORS错误
2. 点击指向后端api的链接不会传递会话数据

这些问题是可以解决的，但我想知道为什么不打算在生产中发生这种情况（客户端和后端都会使用相同的端口）

是否可以解决此问题（例如，通过运行dev server并在同一端口或任何其他方式表达？）

Answer 1

这对我有用： https://medium.com/@spencerfeng/setup-a-proxy-for-api-calls-for-your-angular-cli-app-6566c02a8

我觉得大多数人都没有弹出他们的webpack配置...如果您不知道这意味着什么，那么您可能还没有弹出您的webpack配置，因此请在“未弹出”选项下查看

我会注意到，如果您使用的是ng serve而不是npm start，则需要切换到npm start或在其中键入完整的命令ng serve --proxy-config proxy.conf.json为了使它起作用。

另外在您的proxy.conf.json中：

• 样本仅显示'/ api'
• 但是，如果您有其他不以/ api开头的端点，则也需要添加它们。万一您没有意识到'/ api'是路径识别字符串，而不仅仅是“设置”。

proxy.conf.json示例：

{
     "/api": { 
       "target": "http://localhost:3001",
       "secure": false
     },
     "/oauth": {
       "target": "http://localhost:3001",
       "secure": false
     },
     "/foo": {
       "target": "http://localhost:3002",
       "secure": false
     }
}