当前位置：首页 > uni-app

uniapp换接口

2026-03-05 08:34:06uni-app

在 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'
  })
}

封装通用请求方法

推荐封装统一的请求方法处理接口路径：

uniapp换接口

// 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