angular5 nginx跨域问题

angular5的跨域问题比较烦,折腾了半天,终于搞定了。现写出解决办法。

测试环境可用第一种,线上环境用第二种。

第一种:angular5开发过程中可以给chrome加入参数: --args --disable-web-security  --user-data-dir来解决跨域问题。

在chrome快捷方式上右键,追加参数:

angular5 nginx跨域问题_第1张图片

第二种:angular5开发完项目后,发现存在跨域问题,可以配合nginx来解决。

打开nginx.conf

配置如下:

server {
        listen       8081;
        server_name  127.0.0.1;


        #charset koi8-r;


     #   access_log  logs/host.access.log  main;


        location / {
            root   D:\git\fep_dev\AITeller-ng-manage-platform\dist;
            index  index.html;
        }


        location /manage_platform/{
            proxy_pass http://127.0.0.1:8083/manage_platform/;
            #proxy_cookie_path  /manage_platform /manage_platform;
        }

            
        }

    }

意思是nginx监控本地8081端口,location /:当输入http://127.0.0.1:8081时,会进入到index.html。

请求http://127.0.0.1:8081/manage_platform时,会将请求转到http://127.0.0.1:8083/manage_platform/.如果contextPath一样,就不用管cookie了。否则,就需要设置proxy_cookie_path 。如果设置为:proxy_cookie_path  /manage_platform2 /manage_platform;意思就是将/manage_platform2转到/manage_platform下。一般会这样设置:

location /manage_platform/{
            proxy_pass http://127.0.0.1:8083/manage_platform2/;
            proxy_cookie_path  /manage_platform2 /manage_platform;
        }

你可能感兴趣的:(angular2)