1. 程式人生 > >前端之Vue使用axios跨域正確配置

前端之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/emojis最前面的/可加可不加
  • '^/api': ''前面的尖角號可加可不加
  • 最後一點也是最重要的一點:請求的是用localhost:8080報錯就是localhost:8080,實際請求時候會被轉到https://www.github.com,很多人在這個上理解有誤差,我差點也被誤導了!