vue项目如何使用nginx配置跨域
2017-06-27 15:04
1076 查看
最近使用vue开发一个功能,npm run build之后打包的代码放在了a.com.cn下但是php接口部署在了b.com下,那么问题来了,如何让后端接口支持跨域。有两种方法:
让后端在返回数据的时候设置下返回请求的header,这种方法比较不稳定,因为接口一旦多了就得改好多代码,而且每次出了问题还得去找后端开发改代码,很烦。
另一种方法是,自己配置nginx,首先ssh登录到部署接口所在的服务器,修改nginx配置,在http对象中加入两行代码:
改完重启下nginx,然后在vue项目中,在导入axios的地方加如以下代码:
然后测试,发现就可以跨域了。
详情请参考我的博客 http://www.andylistudio.com/2017/06/27/vue_cross_domain/
让后端在返回数据的时候设置下返回请求的header,这种方法比较不稳定,因为接口一旦多了就得改好多代码,而且每次出了问题还得去找后端开发改代码,很烦。
另一种方法是,自己配置nginx,首先ssh登录到部署接口所在的服务器,修改nginx配置,在http对象中加入两行代码:
http { // 需要加入的代码 add_header Access-Control-Allow-Origin http://a.com.cn add_header Access-Control-Allow-Credentials true server { // b.com.cn的具体配置 } }
改完重启下nginx,然后在vue项目中,在导入axios的地方加如以下代码:
import axios from 'axios' axios.defaults.withCredentials = true
然后测试,发现就可以跨域了。
详情请参考我的博客 http://www.andylistudio.com/2017/06/27/vue_cross_domain/
相关文章推荐
- 如何部署vue前端项目到服务器上(nginx处理跨域)
- Vue2.5学习笔记之如何在项目中使用和配置Vue
- 详解Vue-cli 创建的项目如何跨域请求
- nginx如何配置才能与Tomcat一起使用呢?
- Nginx实现跨域使用字体文件的配置详解
- 如何使用Nginx配置虚拟服务器和做负载均衡
- 项目回顾2-vue的初体验-在已有项目局部使用vue,无须额外配置
- 如何制作Vuejs组件,并且在项目中使用
- 如何使用vue-cli生成项目
- 如何使用webpack打包vue项目?
- Nginx跨域使用字体文件的配置方法
- jenkins发布项目到远程主机上,配置两台linux如何使用SSH免密码登录
- 使用nginx工具如何来配置域名
- 使用Nginx如何配置Tomcat访问日志记录真实IP
- 详解使用Nginx和uWSGI配置Python的web项目的方法
- 如何使用Nginx配置虚拟服务器和做负载均衡
- Servlet开发(一)如何在Myeclipse 中使用tomcat(配置tomcat,发布web项目)
- [使用 Weex 和 Vue 开发原生应用] 1 如何配置开发环境
- vue2.0 使用vue-cli搭建的项目如何在index.html里引入静态css和js