Vue代理设置不起作用

时间:2018-06-18 15:23:01

标签: http webpack vue.js

我有一个来自@vue/cli 3.x。

的Vue项目

我在基于this articlepackage.json中定义的代理不起作用。目标服务器没有看到API请求。

我在这里缺少什么?

vue文件:

<script lang="ts">
import { Component, Prop, Vue } from 'vue-property-decorator';
import VueResource from 'vue-resource';

Vue.use(VueResource);

@Component
export default class HelloWorld extends Vue {
  @Prop() private msg!: string;

  constructor() {
    super();

    this.$http.post('/api');
  }
}
</script>

的package.json:

  "proxy": {
    "/api": "http://localhost:9000/api"
  },

1 个答案:

答案 0 :(得分:10)

该文章可能是指设置代理的过时方法。最新版本的@vue/cli(当前为3.0.0-rc.3)有new method配置开发服务器。

对于该代理的等效设置,请使用以下内容创建vue.config.js(如果它尚不存在):

module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: 'http://localhost:9000',
        ws: true,
        changeOrigin: true
      }
    }
  }
}