一、前言
在使用 Vue + TypeScript + axios 時,後端已經配置了Cors的前提下,但是在請求接口的時候,返回狀態爲 200,但是返回值卻被瀏覽器給攔截了。
二、解決方案
1. 在全局定義
在 main.ts(main.js) 中增加一條 axios 的配置,withCredentials 默認爲 false,所以爲一條。
import Vue from 'vue';
import App from './App.vue';
import router from './router';
import axios from 'axios';
Vue.config.productionTip = false;
// 不能設置爲 true
axios.defaults.withCredentials = false;
// 定義代理服務器的主機名和端口
axios.defaults.proxy = {
host: 'http://localhost',
port: 5000,
};
new Vue({
router,
render: (h) => h(App),
}).$mount('#app');
2. 單獨定義
將 proxy 直接定義到單個請求中
let url = `http://localhost:5001/identity`;
const result = await axios({
method: 'GET',
url,
proxy: {
host: 'http://localhost',
port: 5001,
},
});