分析uniapp如何动态获取接口域名

作者:点几 时间:2024-04-10 13:59:26 

背景

接口域名没有写死,而是动态获取。具体实现就是 通过读取一个静态json文件,来设置真实的接口域名。好处是原域名有可能被封,这样可以直接后台操作修改该配置文件即可;不然的话,h5 项目可能还好说,app 的话必须重新发版。

代码

// httpService.js 对 uni.request 的封装。

在数据请求入口处,统一先进行 域名获取,即 执行 config.requestRemoteIp 方法


import config from '@/config'
import Vue from 'vue'
import cacheData from '@/service/cacheData.js'
const MockUtil = () => import('@/libs/mockUtil.js')
import Storage from '@/libs/storage.js'

class HttpRequest {

/**
    * 读取接口数据
    * @param options 请求信息
    * @param noMock  在整体使用mock数据的情形下,可 单独设置 某个接口请求真实数据
    * @param cacheId
    * @returns {*}
    */
   async requestResolve(options, urlCustom = '', noMock = false, cacheId = null) {
       let remoteIP = await config.requestRemoteIp(); // 动态设置接口请求域名

if (process.env.NODE_ENV === 'development' && config.isMockApi && !noMock) {
           return this.getMockData(options)
       }
       if (cacheId && cacheData[cacheId]) {
           return this.testHttp(cacheData[cacheId])
       }
       return new Promise((resolve, reject) => {
           let baseUrl = process.env.NODE_ENV === 'development' ? config.baseUrl.dev : config.baseUrl.pro;
           options.url = baseUrl + options.url + `${urlCustom}`;
           uni.request(
               Object.assign({
                   success: (res) => {
                       if (res.statusCode != '200'){
                           uni.showToast({
                               title: '服务器错误:'+res.statusCode,
                               icon: "none"
                           })
                           reject()
                       }
                       else if (res.data.code == 10001) {
                           Storage.removeToken();
                           let vue = new Vue();
                           vue.$store.dispatch('logout')
                           vue.$routeUtil.reLaunch('main');
                       }

else if (res.data.code != 200) {
                           if (res.data.message) {
                               uni.showToast({
                                   icon: 'none',
                                   title: res.data.message
                               });
                           }
                           reject(res.data)
                       } else {
                           if (cacheId) {
                               cacheData[cacheId] = res.data.data
                           }
                           resolve(res.data.data)
                       }
                   },
                   fail: err => {
                       uni.showToast({
                           title: '服务器错误',
                           icon: "none"
                       })
                   }
               }, options)
           );
       })
   }

/**
    * mock数据按需导入
    * @param options
    * @returns {*}
    */
   async getMockData(options) {
       const Mock = await MockUtil()
       const MockUrl = Mock.default[options.url]
       if (typeof MockUrl !== 'function') {
           return this.testHttp(MockUrl)
       }
       if (options.method === 'post') {
           return this.testHttp(MockUrl(options.data, false))
       }
       return this.testHttp(MockUrl(options.params, true))
   }
   testHttp(data) {
       let pro = new Promise(function(resolve, reject) {
           setTimeout(function() {
               resolve(data)
           }, 50)
       })
       return pro
   }
}
export default new HttpRequest()

// config.js


const config = {
 isMockApi: false,
 // requestUrl: 'http://qiniu.eightyin.cn/teacherpath.json?time=' + Math.random().toString(36),
 requestUrl: 'http://qiniu.eightyin.cn/teacherpathtest.json?time=' + Math.random().toString(36),
 baseUrl: {

dev: '',
   pro: ''
 },
 img: {
   ossDomain: ''
 },
 uuid: Math.random().toString(36).substring(3, 20),
 requestRemoteIp: () => {
     console.log('config:', config)
     if (config.RemoteIpInited)
       return Promise.resolve();
       return new Promise((resolve, reject) => {
           uni.request({
               url: config.requestUrl,
               success: (response) => {
                   //todo 测试
                   // config.baseUrl.pro = response.data.data.path;
                   config.baseUrl.dev = 'http://bayin5.mycwgs.com/';
                   config.img.ossDomain = response.data.data.ossDomain;
                   config.RemoteIpInited = true;
                   resolve()
               },
               fail: () => {
                   config.RemoteIpInited = true;
                   resolve()
               }
           })
       });
 }
}

export default config

来源:https://www.cnblogs.com/fan-zha/p/11373118.html

标签:uniapp,接口域名
0
投稿

猜你喜欢

  • 轻量级的原生js日历插件calendar.js使用指南

    2024-04-17 09:44:39
  • 解决Windows10下mysql5.5数据库命令行中文乱码问题

    2024-01-16 15:04:29
  • SQL Server代理服务无法启动怎么办

    2024-01-13 20:27:03
  • SQL Server 中调整自增字段的当前初始值

    2024-01-27 13:53:01
  • laravel-admin select框默认选中的方法

    2024-05-13 09:51:06
  • 终于搞懂了Python中super(XXXX, self).__init__()的作用了

    2022-01-04 00:35:44
  • Golang使用协程实现批量获取数据

    2024-01-30 05:05:57
  • 使用python编写脚本获取手机当前应用apk的信息

    2022-08-01 22:54:15
  • PyQt编程之如何在屏幕中央显示窗体的实例

    2022-04-26 07:00:49
  • Python3.9.1中使用split()的处理方法(推荐)

    2022-04-17 23:16:12
  • Python 经典面试题 21 道【不可错过】

    2023-10-29 04:56:20
  • Python探索之pLSA实现代码

    2022-01-03 11:30:28
  • gin 获取post请求的json body操作

    2023-04-22 13:47:30
  • Python里disconnect UDP套接字的方法

    2023-03-26 02:48:00
  • Python中Pyenv virtualenv插件的使用

    2021-10-25 08:07:19
  • oracle 彻底删除方法

    2024-01-19 10:20:57
  • python根据路径导入模块的方法

    2021-10-23 14:27:38
  • MySQL查看数据库表容量大小的方法示例

    2024-01-14 23:19:47
  • XML:OpenSearch 浏览器指定搜索应用

    2010-05-04 19:37:00
  • Python 虚拟机集合set实现原理及源码解析

    2023-11-20 11:36:13
  • asp之家 网络编程 m.aspxhome.com