Use vue-cli to build the project, and the interface is forwarded as follows
proxyTable: {
'/api': {
target: 'http://abcd.com/api',
changeOrigin: true,
pathRewrite: {
'^/api': ''
}
}
}
In the development environment, configuring this can solve cross-domain requests in the development environment. Then in the production environment, after packaging through npm run build, will vue-cli handle this problem by itself? What else should I pay attention to in a production environment? Ask God for answers
axios.post('api/auth/register', {
'firstname':this.firstname,
'lastname':this.lastname,
'email':this.email,
'password':this.password,
'password_confirmation':this.configPassword
})
.then(function (response) {
console.log(response.data);
})
.catch(function (error) {
console.log(error);
});
Assuming that the above API is requested (the production environment does not have cross-domain), and the data can be requested after the local configuration interface forwarding, what should it be like in the production environment? After direct packaging, will the resources be placed on the server?
天蓬老师2017-05-16 13:27:37
vue-cli will not handle it for you. .
The development environment uses the interface of the local agent, and the production environment uses the formal interface. Just write the logic in your own code, and call different interface addresses according to different environments
怪我咯2017-05-16 13:27:37
This is vue-cli
对反向代理
的一个实现,方便开发环境使用。
生产环境中反向代理
的方式也有很多:nginx
、Apache
之类的,如果没有跨域,不需要反向代理
的话,就把前端代码直接丢在接口服务器中就行了(tomcat、jboss之类
),但不推荐,静态资源
就应该走静态服务器
。
我们的生产环境是nginx
, the configuration is probably like this:
server {
listen 80;
server_name localhost;
location / {
root /home/project/;
index index.html index.htm;
}
location /api {
proxy_pass http://10.0.0.10:8080/api;
}
}