javascript - vue-cli local interface forwarding
为情所困
为情所困 2017-05-16 13:25:37
0
2
854

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?

为情所困
为情所困

reply all(2)
Peter_Zhu

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

刘奇

This is vue-cli反向代理的一个实现,方便开发环境使用。
生产环境中反向代理的方式也有很多:nginxApache之类的,如果没有跨域,不需要反向代理的话,就把前端代码直接丢在接口服务器中就行了(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;
        }
}
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!