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

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

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

;(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文件

<script src="./static/js/jquery-1.7.1.min.js"></script>
<script src="./static/js/msgSdk.js"></script>

3.在页面中调用

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

相关推荐

  1. js vue调用activex ocx

    2024-03-20 10:26:03       27 阅读
  2. vue3前端调用接口实现批量删除

    2024-03-20 10:26:03       8 阅读
  3. vue3前端调用接口实现分页,搜索

    2024-03-20 10:26:03       11 阅读
  4. Vue.js 中父组件调用子组件的方法

    2024-03-20 10:26:03       31 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-03-20 10:26:03       16 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-03-20 10:26:03       16 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-03-20 10:26:03       15 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-03-20 10:26:03       18 阅读

热门阅读

  1. 简单函数_简单算术表达式求值

    2024-03-20 10:26:03       17 阅读
  2. 设计模式(结构型设计模式——享元模式)

    2024-03-20 10:26:03       19 阅读
  3. 单例模式的两种方法:饥汉模式和懒汉模式

    2024-03-20 10:26:03       18 阅读
  4. CSS实现点击防抖

    2024-03-20 10:26:03       20 阅读
  5. 原型,模板,策略,适配器模式

    2024-03-20 10:26:03       16 阅读
  6. 设计模式(结构型设计模式——适配器模式)

    2024-03-20 10:26:03       16 阅读
  7. flink启动错误(使用YARN)

    2024-03-20 10:26:03       20 阅读
  8. HttpClient4基础

    2024-03-20 10:26:03       21 阅读