webpack-dev-server并在同一端口上表示吗？

Question

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

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

这些问题是可以解决的，但是我想知道为什么不麻烦它们不在生产中发生（客户端和后端都将使用相同的端口）

可以解决此问题（例如，通过运行dev服务器并在同一端口上或以其他方式表示吗？）

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
     }
}