vue和TP5同域名下怎么部署??
前端使用vue-cli3 搭建的,后端使用TP5。但是它们的入口文件都不一样。
在配置的时候域名根目录要指向哪个入口文件呢?
要是指向vue的入口文件,那TP5的代码要放哪。要是指向TP5的public下的入口,vue是要放在public目录下吗?
以Apache配置为例:
<VirtualHost *:80>
DocumentRoot "D:\phpweb\PHPTutorial\WWW\VueThinkPHP\admin\public"
ServerName www.vuetp.com
ServerAlias vuetp.com
<Directory "D:\phpweb\PHPTutorial\WWW\VueThinkPHP\admin\public">
Options FollowSymLinks ExecCGI
AllowOverride All
Order allow,deny
Allow from all
Require all granted
</Directory>
</VirtualHost>
上面域名根目录指向TP5的public下的入口文件.
vue打包的时候
publicPath: process.env.NODE_ENV === 'production' ? '/vue' : '/',
所以把vue打包后的dist目录下的文件放在根目录下的vue文件夹下面也就是在TP5的public/vue下面。
要是这么部署的haul这里有两个问题:
1.直接访问域名请求的是TP5默认控制器对应的首页
2.vue请求接口不对:
在vue代码里我的请求是这样的 this.$http.get('/index/testApi')
因为在开发的时候在vue.config.js配置跨域请求测试接口我配置的是:
proxy: {
'/index': {
target: 'http://www.tp.com', // 请求测试接口域名
ws: true,
changeOrigin: true, //是否跨域
pathRewrite: {
'^/index':'/index'
}
}
}
但是由于我部署的时候前端代码是放在TP5的public/vue下面的。
所以 this.$http.get('/index/testApi') 请求的时候变成了
http://www.vuetp.com/vue/inde...;按照域名配置指向的根目录。接口地址应该是
http://www.vuetp.com/index/te...
所以在开发的时候这个请求的接口地址需要怎么配置呢;还有就是部署的时候域名指向的入口文件是要指向前端入口还是后端的入口呢?
因为我们在开发的时候,通过跨域配置很容易请求到接口数据。但是部署的时候根本不知道运维是如何部署的。要是按照我上面说的那样部署的话,就会出现接口地址请求错误。 到时候整个前端接口请求都需要改。
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
前后端分离,为什么要同一个域名,还部署在一个地方?
我的问题和你的一样,不过我的是tp6,请问你是怎么解决的?