問題描述：

因為部分原因需要呼叫其他網頁的api，類似空氣質量的資訊

1、ajax 最開始的操作

$.ajax({
                type: 'GET',  // 預設值: "GET")。請求方式 ("POST" 或 "GET")
                dataType: 'jsonp',  // 預期伺服器返回的資料型別:JSONP 格式
                jsonp: 'callback',  // jsonp 請求中重寫回調函式的名字
                jsonpCallback: 'getName',  // jsonp 請求指定一個回撥函式名
 

                url: 'http://113.204.xx.xx:3362/BatchDataController/getBatchAQI',  // 傳送請求的地址
                // data 是傳送到伺服器的資料。將自動轉換為請求字串格式
                data: {},
                // 傳送請求之前呼叫，並且傳入一個 XMLHttpRequest 作為引數
                beforeSend: (request) => {
                },
                // 請求之後呼叫, 傳入返回後的資料，以及包含成功程式碼的字串
 

                success: (data) => {
                    this.weatherObCq = data.data.now
                },
                // 請求出錯時呼叫
                error: (e) => {
                    console.error("error：" + e);
                }
            })

然後就遇到了跨域的問題

 當然我也嘗試著修改了dataType的格式 json、text，毫無暖用；也嘗試修改header的資訊，結果瀏覽器拒絕手動修改header的資訊，厚禮蟹。

最後還是放棄了ajax。。。。。。。。。。

2、本地proxy代理

通過代理只想我們訪問的api。

因為我是vue3.0,我是直接在vite.config.ts 裡面配置proxy

vite.config.ts

proxy: {
        // 設定空氣質量網頁域名
     '/aqi': {
           target: 'http://113.204.xx.xx:3362/',
           changeOrigin: true,
           rewrite: path => path.replace(/^\/aqi/, '')
          }
     }

 具體使用

const url1 = '/aqi/BatchDataController/home';

const resp = await axios.get(url, { params: {} });

location ^~/api/ {
     proxy_pass  http://113.204.xx.xx:3362/;

 }