js封装SDK 在VUE、小程序、公众号直接调用js调用后端接口(本文以vue项目为例)

1.封装一个js文件msgSdk.js

注意:需要修改这个请求地址 apiServiceAddress

javascript 复制代码
;(function () {
  if (window.msgSdk) {
    return
  }
  var msgSdk = (function () {
    var m_msgSdk = this
    var apiServiceAddress="http://172.12.14.5:8000"
    this.I_SendHTTPRequest = function (msgApiUrl, methodType,option) {
      let oPromise = new Promise(async function (resolve, reject) {
        let url=apiServiceAddress+msgApiUrl
        $.ajax({
            url: url, // 请求的URL
            method: methodType, // 请求方法,可以是GET、POST、PUT、DELETE等
            data: {...option}, // 发送到服务器的数据
            success: function(data) {
                // 请求成功时的回调函数
                resolve(data)
            },
            error: function(jqXHR, textStatus, errorThrown) {
                // 请求失败时的回调函数
                reject(errorThrown)
            }
        });
      })
      return oPromise
    }
    // 站内
    this.M_inStation = function (options) {
      let oPromise = new Promise((resolve, reject) => {
        this.m_ISAPIProtocol
          .station(options)
          .then(
            () => {
              resolve()
            },
            oError => {
              reject(oError)
            }
          )
      })
      return oPromise
    }
    // 小程序
    this.M_miniProject = function (options) {
      let oPromise = new Promise((resolve, reject) => {
        this.m_ISAPIProtocol
          .miniProject(options)
          .then(
            () => {
              resolve()
            },
            oError => {
              reject(oError)
            }
          )
      })
      return oPromise
    }
    // 公众号
    this.M_officialAccount = function (options) {
      let oPromise = new Promise((resolve, reject) => {
        this.m_ISAPIProtocol
          .officialAccount(options)
          .then(
            () => {
              resolve()
            },
            oError => {
              reject(oError)
            }
          )
      })
      return oPromise
    }
    // app
    this.M_App = function (options) {
      let oPromise = new Promise((resolve, reject) => {
        this.m_ISAPIProtocol
          .App(options)
          .then(
            () => {
              resolve()
            },
            oError => {
              reject(oError)
            }
          )
      })
      return oPromise
    }
    // 短信
    this.M_textMessage = function (options) {
      let oPromise = new Promise((resolve, reject) => {
        this.m_ISAPIProtocol
          .textMessage(options)
          .then(
            () => {
              resolve()
            },
            oError => {
              reject(oError)
            }
          )
      })
      return oPromise
    }
    // 企业微信
    this.M_weCom = function (options) {
      let oPromise = new Promise((resolve, reject) => {
        this.m_ISAPIProtocol
          .weCom(options)
          .then(
            () => {
              resolve()
            },
            oError => {
              reject(oError)
            }
          )
      })
      return oPromise
    }
    var ISAPIProtocol = function () {}
    // 站内消息
    ISAPIProtocol.prototype.station = function (options) {
      return m_msgSdk.I_SendHTTPRequest("/ISAPI/Security/userCheck?format=json","get",options )
    }
    // 小程序
    ISAPIProtocol.prototype.miniProject = function (options) {
      return m_msgSdk.I_SendHTTPRequest("/ISAPI/Security/userCheck?format=json","get",options )
    }
    // 公众号
    ISAPIProtocol.prototype.officialAccount = function (options) {
      return m_msgSdk.I_SendHTTPRequest("/ISAPI/Security/userCheck?format=json","get",options )
    }
    // app
    ISAPIProtocol.prototype.App = function (options) {
      return m_msgSdk.I_SendHTTPRequest("/ISAPI/Security/userCheck?format=json","get",options )
    }
    // 短信
    ISAPIProtocol.prototype.textMessage = function (options) {
      return m_msgSdk.I_SendHTTPRequest("/ISAPI/Security/userCheck?format=json","get",options )
    }
    // 企业微信
    ISAPIProtocol.prototype.weCom = function (options) {
      return m_msgSdk.I_SendHTTPRequest("/ISAPI/Security/weCom?weCom","get",options )
    }
    m_ISAPIProtocol = new ISAPIProtocol()
    return this
  })()
  var NS = (window.msgSdk = msgSdk)
  NS.version = '1.0.0'
})(this)
if ('object' === typeof exports && typeof module !== 'undefined') {
} else if ('function' === typeof define && define.amd) {
  define(function () {
    return msgSdk
  })
} else if ('function' === typeof define && define.cmd) {
  define(function (require, exports, module) {
    module.exports = msgSdk
  })
} else {
}

2.在index.html中引入msgSdk.js文件jquery文件

javascript 复制代码
<script src="./static/js/jquery-1.7.1.min.js"></script>
<script src="./static/js/msgSdk.js"></script>

3.在页面中调用

javascript 复制代码
 mounted() {
    let oDeviceInfo = {
      IP: "http://666",
      Port: "8000",
      Auth: "95484",
    }
    msgSdk.M_weCom(oDeviceInfo).then(
      (data) => {
        console.log(data,"data");
      },
      (error) => {
        console.log(error,"error");
      }
    );
  }
相关推荐
王琦03182 分钟前
Python 0909
前端·javascript·python
ss2737 分钟前
基于Springboot + vue实现的高校大学生竞赛项目管理系统
vue.js·spring boot·后端
前端小巷子22 分钟前
JS 打造仿腾讯影视轮播导航
前端·javascript·面试
2501_9159214326 分钟前
前端开发工具有哪些?常用前端开发工具、前端调试工具、前端构建工具与效率提升工具对比与最佳实践
android·前端·ios·小程序·uni-app·iphone·webview
ホロHoro44 分钟前
学习笔记:Javascript(5)——事件监听(用户交互)
javascript·笔记·学习
meng半颗糖1 小时前
JavaScript 性能优化实战指南
前端·javascript·servlet·性能优化
EndingCoder1 小时前
离线应用开发:Service Worker 与缓存
前端·javascript·缓存·性能优化·electron·前端框架
说私域2 小时前
基于开源AI智能名片、链动2+1模式与S2B2C商城小程序的流量运营与个人IP构建研究
人工智能·小程序·流量运营
haogexiaole3 小时前
vue知识点总结
前端·javascript·vue.js