【筆記】vue和ssm開發接口聯調跨域問題

爬了兩個小時的大坑

前端在github上拉了個vue項目，因爲歷來沒正式學過vue，跨域這個問題一直困擾了好久。

目前暫時能用的解決方案（開發環境）就是：

• 前端在vue.config.js中加入代理。

devServer: {
        port: 8085,
        open: true,
        // proxy: 8080,
        proxy: {
            '/api': {
                target: 'http://localhost:8080',
                ws: true,
                changeOrigin: true,
            }
        }
    },

• 將封裝的axios請求中的baseURL改成'/api'，這樣子全部請求就會轉發到target/api，理論上還能夠寫個pathRewrite，把api去掉，可是試了不少次都不行，就暫且這樣了。

• 後端spring-mvc加入

  <mvc:cors>
          <mvc:mapping path="/**"
                       allowed-origins="http://127.0.0.1:8085,http://localhost:8085"
                       allowed-methods="POST,GET, OPTIONS,DELETE,PUT"
                       allowed-headers="Content-Type,ContentType,Access-Control-Allow-Headers, Authorization, X-Requested-With Access-Control-Allow-Origin"
                       allow-credentials="true"/>
      </mvc:cors>