在Angular2开发模式下设置Access-Control-Allow-Origin头 [英] Setting Access-Control-Allow-Origin header in Angular2 development mode

问题描述

在生产环境中，我将设置访问控制允许原点头在nginx。
有没有办法在内置Angular的开发服务器中设置标题，这样我不需要在笔记本电脑上运行任何代理？

解决方案

我认为你需要提供一个自定义配置来注册 cors 模块作为中间件：

 'use strict'; 
 var fallback = require（'connect-history-api-fallback'）; 
 var log = require（'connect-logger'）; 
 var cors = require（'cors'）; 
 
 module.exports = {
 injectChanges：false，// Angular 2 styleUrls的解决方法load 
 files：['./**/*.{html,htm,css ，js}']，
 watchOptions：{
 ignored：'node_modules'
}，
 server：{
 baseDir：'./'，
中间件：[
 log（{format：'％date％status％method％url'}），
 cors（），
 fallback（{
 index：'/ index。 html'，
 htmlAcceptHeaders：['text / html'，'application / xhtml + xml'] 
}）
] 
} 
} 
  

要使用自定义配置文件，请使用c或config参数：

 lite：lite-server -c custom-config.js，
  

这里是cors模块：

• https://www.npmjs.com/package/cors

I am making HTTP requests to an external server which of CORS don't make it through.

In production I will set the Access-Control-Allow-Origin header in nginx. Is there a way to also set the header in the "built-in" Angular's development server so that I don't need to run any proxy on my laptop?

解决方案

I think that you need to provide a custom configuration to register the cors module as middleware:

'use strict';
var fallback = require('connect-history-api-fallback');
var log = require('connect-logger');
var cors = require('cors');

module.exports = {
  injectChanges: false, // workaround for Angular 2 styleUrls loading
  files: ['./**/*.{html,htm,css,js}'],
  watchOptions: {
    ignored: 'node_modules'
  },
  server: {
    baseDir: './',
    middleware: [
      log({format: '%date %status %method %url'}),
      cors(),
      fallback({
        index: '/index.html',
        htmlAcceptHeaders: ['text/html', 'application/xhtml+xml']
      })
    ]
  }
};

To use the custom configuration file use the c or config parameter:

"lite": "lite-server -c custom-config.js",

Here is the cors module:

• https://www.npmjs.com/package/cors

这篇关于在Angular2开发模式下设置Access-Control-Allow-Origin头的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！