nginx - 关于vue项目部署到ngnix后出现的问题
问题描述
原本想用github预览自己做的vue demo,但是发现不行,说要把build后的文件拿到ngnix服务器上去跑。
1、demo中用到了跨域访问豆瓣api,proxyable已经设置了,npm run dev是可以跨域访问的,但为什么我在服务器上一运行就报错,如下图
2、如下图,如何设置ngnix才能把原有的127.0.0.1:8090/项目路径,改为自己购买的域名或者github.io/项目路径
3、怎样部署才能把项目放到域名上,不需要每次启动ngnix服务才能运行项目这么蛋疼。
其实上面3个问题总结一下就是“如何在ngnix服务器上跨域访问豆瓣api数据”。。。我没想到会搞得这么难。。
求有经验的大神解答,谢谢!
问题解答
回答1:这个是域名的问题,你应该先定义一个全局的url
定义全局变量的方法如果不清楚的话可在sf搜索一下有很多
这个是定义全局参数const isDebug = trueconst commonUrl = isDebug? ’’:’http://xxxx’在你接口调用的地方 getNew(){this.$http.get(commonUrl + ’/v2/movie/new_movies’).then(response => { console.log(response) Indicator.close() this.topList = response.data.subjects}, response => {}) },
如果是在本地开发那isDebug就是true 如果是传到服务器上isDebug就是false
回答2:我理解的问题:部署vue到github.
具体代码也没时间贴了,就讲下思路吧:
好了,这里我们就不需要ngnix服务器了.
我们知道两点:
github访问是访问index.html作为入口;
vue打包文件必须在服务端运行
所以,问题逐渐清晰了,我们将vue打包的index.html作为github的入口文件不就行了.所以问题应该就是打包的问题了.
tips:关于跨域,你npm run dev之所以能运行是因为你在本地的nodejs服务器设置了代理,而服务端并没有,若单纯的想在服务端跨域,还是需要做很多工作的.
相关文章:
1. Android 高德地图如何实现拖动平移地图时地图上的小图标不动?2. android - 求 360浏览器 百度浏览器 搜狗浏览器的最新启动类名3. 微信端电子书翻页效果4. javascript - 在html中写了个<video>视频,浏览器却是一片空白为什么呢?360浏览器?5. pdo_mysql 值自增写法6. css - 前端flex布局嵌套内层的布局不起作用?7. html5 - HTML代码中的文字乱码是怎么回事?8. javascript - 微信小程序 wx.downloadFile下载文件大小有限制吗9. 安装sublime text 3 控制台的时候出现这个报错怎么办?10. php laravel框架模型作用域