前端之Vue使用axios跨域正确配置

组件代码

<script>

  export default {
    name: 'App',
    methods: {
      getData() {
        this.$http.get('/api/emojis').then(function (res) {
            console.log(res)
        })
      }
    },
    mounted(){
      this.getData()
    }
  }
script>

proxyTable（config/index.js）

dev: {
    // Paths
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    proxyTable: {

      '/api': {
        target: 'https://www.github.com',
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      },
      secure:false
    },

注意点：

• proxyTable修改后需要重启！！！
• /api代表https://www.github.com，所以组件使用时直接/api/emojis，代表的意思：https://www.github.com/emojis
• /api/emojis最前面的/可加可不加
• '^/api': ''前面的尖角号可加可不加
• 最后一点也是最重要的一点：请求的是用localhost:8080报错就是localhost:8080，实际请求时候会被转到https://www.github.com，很多人在这个上理解有误差，我差点也被误导了！