iis服务器助手广告广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >分析uniapp如何动态获取接口域名
  • 831
分享到

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

2024-04-02 19:04:59 831人浏览 安东尼
摘要

背景 接口域名没有写死,而是动态获取。具体实现就是 通过读取一个静态JSON文件,来设置真实的接口域名。好处是原域名有可能被封,这样可以直接后台操作修改该配置文件即可;不然的话,h5

背景

接口域名没有写死,而是动态获取。具体实现就是 通过读取一个静态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 {

    
    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)
            );
        })
    }

    
    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

以上就是分析uniapp如何动态获取接口域名的详细内容,更多关于uniapp动态获取接口域名的资料请关注编程网其它相关文章!

--结束END--

本文标题: 分析uniapp如何动态获取接口域名

本文链接: https://www.lsjlt.com/news/127693.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 分析uniapp如何动态获取接口域名
    背景 接口域名没有写死,而是动态获取。具体实现就是 通过读取一个静态json文件,来设置真实的接口域名。好处是原域名有可能被封,这样可以直接后台操作修改该配置文件即可;不然的话,h5...
    99+
    2022-11-12
  • 如何跨域获取Cookie分析
    如何跨域获取Cookie分析,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。最近在发现使用Taobao的时候的一个小细节,于是便萌发起了写这...
    99+
    2022-10-19
  • 如何实现动态域名解析
    在linux系统中实现动态域名解析的方法首先,在linux系统中搭建一个动态域名解析环境;yum install dhcp -ycd /etc/dhcp cp /usr/share/doc/dhcp*/dhcpd.conf.example ...
    99+
    2022-10-13
  • ResultSet如何动态获取列名和值
    目录ResultSet 动态获取列名和值Java通过ResultSet获取列字段等信息总结ResultSet 动态获取列名和值 仅供自己方便查阅,无其他用途 ResultSet re...
    99+
    2022-12-21
    ResultSet动态获取列名 ResultSet动态获取值 ResultSet动态获取列名和值
  • 如何使用spring动态获取接口的不同实现类
    这篇“如何使用spring动态获取接口的不同实现类”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“如何使用spring动态获取...
    99+
    2023-06-29
  • 利用Java如何获取Mybatis动态生成的sql接口实现
    目录前言1、编写xml: SqlGenarate.mapper.xml2、定义接口3、实现接口总结前言 如果你有使用 JDBC 或其他类似框架的经验,你就能体会到根据不同条件拼接 S...
    99+
    2022-11-12
  • springboot启动时如何获取端口和项目名
    目录springboot启动获取端口和项目名背景踩坑使用效果springboot配置项目运行端口号这个方法极其简洁springboot启动获取端口和项目名 背景 项目启动每次都要手动...
    99+
    2022-11-12
  • vue类名如何获取动态生成的元素
    目录类名获取动态生成的元素如何获取并操作dom元素类名获取动态生成的元素 首先注意的是,该元素必须在id为app这个元素里面  new Vue({    el: "#app",   ...
    99+
    2022-11-13
  • Python接口自动化浅析如何处理动态数据
    在上一篇Python接口自动化测试系列文章:Python接口自动化浅析logging封装及实战操作,主要介绍如何提取token、将token作为类属性全局调用及充值接口如何携带tok...
    99+
    2022-11-12
  • vue中如何使用echarts实现动态数据绑定及获取后端接口数据
    本篇内容主要讲解“vue中如何使用echarts实现动态数据绑定及获取后端接口数据”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“vue中如何使用echarts实现动态数据绑定及获取后端接口数据”...
    99+
    2023-07-02
  • Java如何根据不同系统动态获取换行符和盘分割符
    目录根据不同系统动态获取换行符和盘分割符1、获取盘分割符2、获取换行符java分割空行 分割换行符txtAll是总文本,数据如下根据不同系统动态获取换行符和盘分割符 1、获取盘分割符...
    99+
    2022-11-12
  • 小程序开发中如何调用接口获取登录凭证进而换取用户登录态信息
    这篇文章主要为大家展示了小程序开发中如何调用接口获取登录凭证进而换取用户登录态信息,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带大家一起来研究并学习一下“小程序开发中如何调用接口获取登录凭证进而换取用户登录态信息”这篇文章...
    99+
    2023-06-26
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作