Javascript – Weiterleitung der lokalen Schnittstelle von vue-cli

Question

Verwenden Sie vue-cli, um das Projekt zu erstellen. Die Schnittstelle wird wie folgt weitergeleitet

proxyTable: {
      '/api': {
            target: 'http://abcd.com/api',
            changeOrigin: true,
            pathRewrite: {
                '^/api': ''
            }
        }
    }

In der Entwicklungsumgebung kann die Konfiguration domänenübergreifende Anforderungen in der Entwicklungsumgebung lösen. Wird vue-cli dieses Problem dann in der Produktionsumgebung nach dem Packen durch npm run build selbst lösen? Worauf sollte ich in einer Produktionsumgebung noch achten? Bitte Gott um Antworten

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);
        });

Angenommen, die obige API wird angefordert (die Produktionsumgebung ist nicht domänenübergreifend) und die Daten können nach der Weiterleitung der lokalen Konfigurationsschnittstelle angefordert werden. Wie sollte dies in der Produktionsumgebung aussehen? Werden die Ressourcen nach der Direktverpackung auf dem Server platziert?

Answer 1

vue-cli不会帮你处理。。
开发环境使用本地代理的接口，生产环境使用正式的接口，这个自己代码里逻辑写好就可以了，根据不同环境调用不同的接口地址

Answer 2

这个是vue-cli对反向代理的一个实现，方便开发环境使用。
生产环境中反向代理的方式也有很多：nginx、Apache之类的，如果没有跨域，不需要反向代理的话，就把前端代码直接丢在接口服务器中就行了(tomcat、jboss之类)，但不推荐，静态资源就应该走静态服务器。
我们的生产环境是nginx，配置大概是这样的：

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;
        }
}