uniapp换接口
在 uniapp 中更换接口的方法
uniapp 中更换接口通常涉及修改请求的 baseURL 或动态切换接口地址,以下是几种常见实现方式:
通过配置文件管理接口地址
在 config.js 或 env.js 中定义不同环境的接口地址:
// config.js
export default {
dev: {
baseUrl: 'http://dev.api.example.com'
},
prod: {
baseUrl: 'https://api.example.com'
}
}
使用时根据环境变量切换:
import config from './config.js'
const baseUrl = process.env.NODE_ENV === 'development'
? config.dev.baseUrl
: config.prod.baseUrl
使用环境变量动态切换
在项目根目录创建 .env 文件:
# .env.development
VUE_APP_API_BASEURL=http://dev.api.example.com
# .env.production
VUE_APP_API_BASEURL=https://api.example.com
代码中通过 process.env 获取:
const baseUrl = process.env.VUE_APP_API_BASEURL
动态接口切换实现
对于需要运行时切换接口的场景(如多租户系统):
// api.js
let currentBaseUrl = 'https://default.api.example.com'
export function setBaseUrl(newUrl) {
currentBaseUrl = newUrl
}
export function request(options) {
return uni.request({
url: currentBaseUrl + options.url,
method: options.method || 'GET'
})
}
封装通用请求方法
推荐封装统一的请求方法处理接口路径:
// http.js
const http = {
baseUrl: 'https://api.example.com',
request(method, path, data) {
return new Promise((resolve, reject) => {
uni.request({
url: this.baseUrl + path,
method,
data,
success: (res) => resolve(res.data),
fail: (err) => reject(err)
})
})
},
get(path, params) {
return this.request('GET', path, params)
},
post(path, data) {
return this.request('POST', path, data)
}
}
export default http
注意事项
- 跨域问题需在后台配置 CORS 或使用 uniapp 的代理设置
- 生产环境建议使用 HTTPS 协议
- 动态切换接口时注意清除之前的请求缓存
- 小程序平台需将域名加入合法名单
实际项目中可根据需求组合使用上述方法,建议将接口配置与业务代码分离以便维护。







