当前位置:   article > 正文

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

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

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

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

  1. ;(function () {
  2. if (window.msgSdk) {
  3. return
  4. }
  5. var msgSdk = (function () {
  6. var m_msgSdk = this
  7. var apiServiceAddress="http://172.12.14.5:8000"
  8. this.I_SendHTTPRequest = function (msgApiUrl, methodType,option) {
  9. let oPromise = new Promise(async function (resolve, reject) {
  10. let url=apiServiceAddress+msgApiUrl
  11. $.ajax({
  12. url: url, // 请求的URL
  13. method: methodType, // 请求方法,可以是GET、POST、PUT、DELETE等
  14. data: {...option}, // 发送到服务器的数据
  15. success: function(data) {
  16. // 请求成功时的回调函数
  17. resolve(data)
  18. },
  19. error: function(jqXHR, textStatus, errorThrown) {
  20. // 请求失败时的回调函数
  21. reject(errorThrown)
  22. }
  23. });
  24. })
  25. return oPromise
  26. }
  27. // 站内
  28. this.M_inStation = function (options) {
  29. let oPromise = new Promise((resolve, reject) => {
  30. this.m_ISAPIProtocol
  31. .station(options)
  32. .then(
  33. () => {
  34. resolve()
  35. },
  36. oError => {
  37. reject(oError)
  38. }
  39. )
  40. })
  41. return oPromise
  42. }
  43. // 小程序
  44. this.M_miniProject = function (options) {
  45. let oPromise = new Promise((resolve, reject) => {
  46. this.m_ISAPIProtocol
  47. .miniProject(options)
  48. .then(
  49. () => {
  50. resolve()
  51. },
  52. oError => {
  53. reject(oError)
  54. }
  55. )
  56. })
  57. return oPromise
  58. }
  59. // 公众号
  60. this.M_officialAccount = function (options) {
  61. let oPromise = new Promise((resolve, reject) => {
  62. this.m_ISAPIProtocol
  63. .officialAccount(options)
  64. .then(
  65. () => {
  66. resolve()
  67. },
  68. oError => {
  69. reject(oError)
  70. }
  71. )
  72. })
  73. return oPromise
  74. }
  75. // app
  76. this.M_App = function (options) {
  77. let oPromise = new Promise((resolve, reject) => {
  78. this.m_ISAPIProtocol
  79. .App(options)
  80. .then(
  81. () => {
  82. resolve()
  83. },
  84. oError => {
  85. reject(oError)
  86. }
  87. )
  88. })
  89. return oPromise
  90. }
  91. // 短信
  92. this.M_textMessage = function (options) {
  93. let oPromise = new Promise((resolve, reject) => {
  94. this.m_ISAPIProtocol
  95. .textMessage(options)
  96. .then(
  97. () => {
  98. resolve()
  99. },
  100. oError => {
  101. reject(oError)
  102. }
  103. )
  104. })
  105. return oPromise
  106. }
  107. // 企业微信
  108. this.M_weCom = function (options) {
  109. let oPromise = new Promise((resolve, reject) => {
  110. this.m_ISAPIProtocol
  111. .weCom(options)
  112. .then(
  113. () => {
  114. resolve()
  115. },
  116. oError => {
  117. reject(oError)
  118. }
  119. )
  120. })
  121. return oPromise
  122. }
  123. var ISAPIProtocol = function () {}
  124. // 站内消息
  125. ISAPIProtocol.prototype.station = function (options) {
  126. return m_msgSdk.I_SendHTTPRequest("/ISAPI/Security/userCheck?format=json","get",options )
  127. }
  128. // 小程序
  129. ISAPIProtocol.prototype.miniProject = function (options) {
  130. return m_msgSdk.I_SendHTTPRequest("/ISAPI/Security/userCheck?format=json","get",options )
  131. }
  132. // 公众号
  133. ISAPIProtocol.prototype.officialAccount = function (options) {
  134. return m_msgSdk.I_SendHTTPRequest("/ISAPI/Security/userCheck?format=json","get",options )
  135. }
  136. // app
  137. ISAPIProtocol.prototype.App = function (options) {
  138. return m_msgSdk.I_SendHTTPRequest("/ISAPI/Security/userCheck?format=json","get",options )
  139. }
  140. // 短信
  141. ISAPIProtocol.prototype.textMessage = function (options) {
  142. return m_msgSdk.I_SendHTTPRequest("/ISAPI/Security/userCheck?format=json","get",options )
  143. }
  144. // 企业微信
  145. ISAPIProtocol.prototype.weCom = function (options) {
  146. return m_msgSdk.I_SendHTTPRequest("/ISAPI/Security/weCom?weCom","get",options )
  147. }
  148. m_ISAPIProtocol = new ISAPIProtocol()
  149. return this
  150. })()
  151. var NS = (window.msgSdk = msgSdk)
  152. NS.version = '1.0.0'
  153. })(this)
  154. if ('object' === typeof exports && typeof module !== 'undefined') {
  155. } else if ('function' === typeof define && define.amd) {
  156. define(function () {
  157. return msgSdk
  158. })
  159. } else if ('function' === typeof define && define.cmd) {
  160. define(function (require, exports, module) {
  161. module.exports = msgSdk
  162. })
  163. } else {
  164. }

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

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

3.在页面中调用

  1. mounted() {
  2. let oDeviceInfo = {
  3. IP: "http://666",
  4. Port: "8000",
  5. Auth: "95484",
  6. }
  7. msgSdk.M_weCom(oDeviceInfo).then(
  8. (data) => {
  9. console.log(data,"data");
  10. },
  11. (error) => {
  12. console.log(error,"error");
  13. }
  14. );
  15. }

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/我家自动化/article/detail/278943?site
推荐阅读