vue exchange port and cross-domain

1 exchange port : index.js

    // Various Dev Server settings
    host: 'localhost', // can be overwritten by process.env.HOST
    port: 7777, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
    autoOpenBrowser: false,
    errorOverlay: true,
    notifyOnErrors: true,
    poll: false, // https://webpack.js.org/configuration/dev-server/#devserver-watchoptions-

2 cross-domain : index.js

    proxyTable: {
      '/api': {
        target: 'http://localhost:8080',//设置你调用的接口域名和端口号 别忘了加http
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''//这里理解成用‘/api’代替target里面的地址,后面组件中我们掉接口时直接用api代替 比如我要调用'http://40.00.100.100:3002/user/add',直接写‘/api/user/add’即可
        }
      }
    },

HelloWorld.vue

    <el-row>
      <el-button v-on:click="visitMethod()">默认按钮</el-button>
    </el-row>

  methods: {
    visitMethod() {
      this.$axios.post('/api/hello')
        .then(function (response) {
          console.log(response);
        })
        .catch(function (error) {
          console.log(error);
        })
    }
  }



猜你喜欢

转载自blog.csdn.net/qq_28197211/article/details/80717461