微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

Angular跨域设置在部署时出现的问题及解决方法

按照网上许多的写法操作,先是创建一个proxy.json文件,写下代理设置,如下代码。代表所有以/api为相对地址开头的请求都将转向http://localhost:8080/api,按照这种方法,在开发模式下完全正常,可以跨域请求。

 1 {
 2     "/api":{
 3         "target": "http://localhost:8080/api",
 4         "secure": false,
 5         "logLevel": "debug",
 6         "changeOrigin": true,
 7         "pathRewrite": {
 8             "^/api": "/"
 9         }
10     }
11 }

        但是当将项目部署到tomcat服务器时,(index.html文件位于webapps/dist里),此时出现了问题,部分组件里的请求可正常跨域请求,而部分组件里的请求却始终不正常,请求地址总是多出一个dist,例如本应请求http://localhost:8080/api/login,却变成了向http://localhost:8080/dist/api/login请求,而且读取assets静态文件的路径也出错。始终不能明白是什么原因导致这样的问题,如有大虾知道,请留言告知。我的解决方法是将所有文件迁移至ROOT里部署,这样就把http://localhost:8080直接指向了项目index,html,另外再把assets里的静态文件复制一份到tomcat的webapps文件夹里(即在webapps下创建一个assets文件夹,只复制那些指向不正确的静态文件,根据控制台的报错信息来确定需要复制哪些)。

       其实更好的方法是不要使用tomcat作为angular的web服务器,只用它作为java后端服务器,而angular前端服务器则采用Nginx服务器。把angular生成dist文件整个复制到Nginx服务器的html文件夹下,然后修改服务器的conf文件夹下的Nginx.conf文件,只修改如下图几行即可。这时,访问http://localhost:8081就是静态页面的主页,而请求相对地址为/api开头的地址将自动转化为以http://10.69.194.15:8080/api为开头的地址(即后端服务器地址)。

 

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐