我无法运行角度应用程序

如何解决我无法运行角度应用程序

错误：CORS策略已阻止从来源“ http：// localhost：4200”访问“ localhost：8080 / api / products”处的XMLHttpRequest：仅协议方案支持跨来源请求：http，数据， chrome，chrome-extension，https。 ：8080 / api / products：1无法加载资源：net :: ERR_FAILED

即使在server.js中添加了这些

app.use(function(req,res,next) {
  res.header("Access-Control-Allow-Origin","*");   
  res.header("Access-Control-Allow-Headers","Origin,X-Requested-With,Content-Type,Accept");
  res.header("Access-Control-Allow-Methods","GET,POST,PUT,DELETE");
  next();
}); 

解决方法

客户端上的问题可能是由于浏览器选择处理飞行前CORS的行为。使用OPTIONS方法而不是使用GET方法。建议添加用于处理OPTIONS的处理程序。这是代码：

app.use(function(req,res,next) {
     res.header('Access-Control-Allow-Origin','*');
     res.header('Access-Control-Allow-Methods','GET,POST,PUT,DELETE,OPTIONS');
     res.header('Access-Control-Allow-Headers','Access-Control-Allow-Origin,Content-Type,Accept,Accept-Language,Origin,User-Agent');
     if(req.method === 'OPTIONS') {
        res.sendStatus(204);
     } else {
       next();
     }
}); 

如果您使用的是Angular CLI，则可能需要通过使用以下配置在angular应用程序根文件夹中添加proxy.conf.json文件来启用代理：

{
  "/api": {
    "target": "http://localhost:8080","secure": false
  }
}

在运行Angular App时，如下所示--proxy-config，或更恰当地编辑pacakage.json启动脚本以包含配置：

ng serve --proxy-config proxy.conf.json

关于setting up proxy call

的好文章 ,

解决方案1：只需使用app.use（cors（））。

解决方案2：app.use（function（req，res，next）{ res.header（“ Access-Control-Allow-Origin”，“ *”）; //更新以匹配您要发出请求的域 res.header（“ Access-Control-Allow-Headers”，“来源，X-请求使用，内容类型，接受”）； res.header（“ Access-Control-Allow-Headers”，“ GET，POST，PUT，DELETE”）； 下一个（）; }）;