簡介

在uni-app中，uni.request 用于發起網絡請求，類似于原生的 XMLHttpRequest 或 fetch 請求。如果你想設置可變的請求IP地址，可以通過在發送請求之前動態修改請求的URL來實現。

方法一：直接在請求URL中嵌入變量

你可以在發起請求時，將IP地址作為URL的一部分來傳遞。例如，你可以將IP地址存儲在全局變量或Vuex狀態管理庫中，然后在發起請求時使用這個變量。

// 假設你有一個全局變量來存儲IP地址
let baseUrl = 'http://your_default_ip.com';function sendRequest(path) {uni.request({url: baseUrl + path, // 將IP地址和路徑合并method: 'GET', // 或 'POST' 等success: (res) => {console.log('請求成功:', res.data);},fail: (err) => {console.error('請求失敗:', err);}});
}// 調用函數
sendRequest('/api/data');

方法二：使用全局變量

你可以在項目的全局文件（如main.js或main.ts）中定義一個全局變量來存儲基礎URL，然后在需要發送請求的地方引用這個變量。

步驟如下：

定義全局變量

在main.js或main.ts中定義一個全局變量：

Vue.prototype.globalApiUrl = 'https://example.com/api';

在組件中使用

在需要發送請求的組件中，你可以這樣使用這個全局變量：

methods: {fetchData() {const url = this.globalApiUrl + '/data';uni.request({url: url,method: 'GET',success: (res) => {console.log(res.data);},fail: (err) => {console.error(err);}});}
}

方法三：使用環境變量

對于不同的環境（開發環境、測試環境、生產環境），你可以使用環境變量來動態配置請求地址。

步驟如下：

定義環境變量

在項目的根目錄下創建.env文件（或.env.development, .env.production等，根據需要）。例如，.env.development:

VUE_APP_API_URL=https://dev-api.example.com/api

在代碼中使用環境變量

在main.js或main.ts中，你可以這樣使用環境變量：

Vue.prototype.globalApiUrl = process.env.VUE_APP_API_URL;

確保環境變量被正確加載

確保你的構建工具（如Vite或Webpack）配置正確，能夠加載.env文件中的環境變量。例如，在使用Vue CLI時，它會自動處理.env文件。

方法四：服務端配置

對于更復雜的應用，你可能希望從服務端獲取API的基礎URL或者在應用啟動時從配置文件中讀取。這通常涉及到更復雜的初始化邏輯，比如啟動腳本或應用啟動時從用戶設置中讀取。

示例：從服務端獲取URL

在應用啟動時，你可以向服務端發送一個請求來獲取API的基礎URL，然后根據返回的URL進行后續操作。例如：

fetch(‘https://your-config-server/api/config’) // 假設服務端提供配置信息的接口
.then(response => response.json())
.then(data => {
Vue.prototype.globalApiUrl = data.apiUrl; // 假設返回的JSON包含apiUrl字段
})
.catch(error => console.error(‘Error fetching config:’, error));
選擇哪種方法取決于你的具體需求和項目結構。通常，對于簡單的項目，使用全局變量或環境變量就足夠了。對于更復雜或需要動態配置的場景，考慮使用服務端配置或更高級的配置管理方法。

方法五：使用配置文件（如config.js）:

// config.js
const config = {development: {apiUrl: 'http://dev-api.example.com'},production: {apiUrl: 'http://prod-api.example.com'}
};

在代碼中使用：

function sendRequest(path) {const env = process.env.NODE_ENV; // 獲取當前環境，例如 'development' 或 'production'const apiUrl = config[env].apiUrl; // 根據環境獲取對應的API URLuni.request({url: apiUrl + path, // 使用配置的API URLmethod: 'GET', // 或 'POST' 等success: (res) => {console.log('請求成功:', res.data);},fail: (err) => {console.error('請求失敗:', err);}});
}

確保在構建應用時正確設置了環境。例如，使用vue-cli-service時，可以通過命令行參數–mode來指定環境。例如，vue-cli-service build --mode production。

總結

選擇哪種方法取決于你的具體需求和項目結構。如果只是簡單的開發/生產切換，使用環境變量或配置文件會更方便管理。如果需要更靈活的動態IP切換，可以在發送請求前直接修改URL中的IP部分。