uni-js-bridge.js 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", { value: true });
  3. if (window.UniJsBridge) {
  4. throw new Error('UniJsBridge已经存在了');
  5. }
  6. var uniqueId = 1; // 全局唯一标识,主要用来生产callbackId
  7. var responseCallbacks = {}; // 给客户端发送消息后的回调函数集合
  8. var messageHandlers = {}; // 在H5中注册的函数(就是等待客户端调用的函数)的集合
  9. var receiveMessageQueue = []; // 消息队列,Native给H5发消息的队列,所有的消息都集中在此,依次调用
  10. if (!uni) {
  11. throw new Error('uni未定义,需要先引入uni-sdk,地址为:https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js');
  12. }
  13. var UniJsBridge = {
  14. init: init,
  15. send: send,
  16. callHandler: callHandler,
  17. registerHandler: registerHandler,
  18. uni: uni,
  19. _handleMessageFromNative: _handleMessageFromNative,
  20. };
  21. // Native调用H5函数必须是要挂载到window下
  22. window.UniJsBridge = UniJsBridge;
  23. function init(messageHandler) {
  24. if (UniJsBridge._messageHandler) {
  25. throw new Error('UniJSBridge._messageHandler 被调用了两次');
  26. }
  27. UniJsBridge._messageHandler = messageHandler;
  28. var receiveMessage = receiveMessageQueue;
  29. receiveMessageQueue = null;
  30. for (var i = 0; i < receiveMessage.length; i++) {
  31. _dispatchMessageFromNative(receiveMessage[i]);
  32. }
  33. }
  34. /**
  35. * 发送消息给客户端
  36. * PS:主动发送
  37. * @param data 给客户端的数据
  38. * @param responseCallback 回调函数
  39. */
  40. function send(data, responseCallback) {
  41. _doSend('send', data, responseCallback);
  42. }
  43. // 调用线程
  44. function callHandler(handlerName, data, responseCallback) {
  45. _doSend(handlerName, data, responseCallback);
  46. }
  47. /**
  48. * 注册一个函数,待客户端调用
  49. * PS:被动等待调用
  50. * @param handlerName
  51. * @param handler: 接收两个参数,data(客户端回复给H5的数据),responseCallback(一个回调函数:调用该函数,客户端才可以执行回调,且可以传参数给客户端)
  52. */
  53. function registerHandler(handlerName, handler) {
  54. messageHandlers[handlerName] = handler;
  55. }
  56. /**
  57. * 发送给客户端的核心函数,依赖uni-app SDk
  58. * PS:主动发送
  59. * @param handlerName
  60. * @param message
  61. * @param responseCallback: 可接收String和Function,如果为String的话就是给客户端的一个回调ID,这个ID其实本来就是由客户端自己传过来的
  62. * 如果为Function的话就是H5的回调函数
  63. * @private
  64. */
  65. function _doSend(handlerName, message, responseCallback) {
  66. var callbackId;
  67. if (typeof responseCallback === 'string') {
  68. callbackId = responseCallback;
  69. }
  70. else if (responseCallback) {
  71. /**
  72. * 把回调函数塞进集合中去,待客户端代码执行完毕就去找到对应的函数开始执行
  73. */
  74. callbackId = 'cb_' + (uniqueId++) + '_' + new Date().getTime();
  75. responseCallbacks[callbackId] = responseCallback;
  76. }
  77. else {
  78. callbackId = '';
  79. }
  80. if (!uni.postMessage) {
  81. return console.error('此接口依赖uni.webview,具体参考:https://uniapp.dcloud.io/component/web-view');
  82. }
  83. // 给客户端发送消息
  84. uni.postMessage({
  85. data: {
  86. data: message,
  87. callbackId: callbackId,
  88. handlerName: handlerName,
  89. },
  90. });
  91. }
  92. function _dispatchMessageFromNative(messageJSON) {
  93. if (!messageJSON) {
  94. return console.warn('客户端没有回复任何消息');
  95. }
  96. try {
  97. /**
  98. * responseId: 客户端回复前端的回调函数的ID
  99. * callbackId: 给客户端自己用的回调ID
  100. * handlerName: 前后端统一约定的一个名字[约定不同的名字对应不同的功能,需要后期加,这里只是封装的一个方法]
  101. * responseData: 客户端给前端的参数
  102. */
  103. var callbackId = messageJSON.callbackId, responseId = messageJSON.responseId, handlerName = messageJSON.handlerName, responseData = messageJSON.responseData;
  104. var responseCallback = void 0;
  105. if (responseId) {
  106. responseCallbacks[responseId] && responseCallbacks[responseId](responseData);
  107. delete responseCallbacks[responseId];
  108. }
  109. else {
  110. if (callbackId) {
  111. var callbackResponseId_1 = callbackId;
  112. responseCallback = function (responseData) {
  113. _doSend('response', responseData, callbackResponseId_1);
  114. };
  115. }
  116. var handler = UniJsBridge._messageHandler;
  117. if (handlerName) {
  118. handler = messageHandlers[handlerName];
  119. }
  120. handler(responseData, responseCallback);
  121. }
  122. }
  123. catch (e) {
  124. console.log(e);
  125. }
  126. }
  127. /**
  128. * 提供给客户端调用的函数,
  129. * 约定客户端只能通过此函数发消息给H5
  130. * @param messageJSON
  131. * @private
  132. */
  133. function _handleMessageFromNative(messageJSON) {
  134. if (receiveMessageQueue) {
  135. receiveMessageQueue.push(messageJSON);
  136. }
  137. _dispatchMessageFromNative(messageJSON);
  138. }
  139. //# sourceMappingURL=uni-js-bridge.js.map