mui.jsonp.js 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108
  1. /**
  2. * MUI JSONP
  3. * varstion 1.0.0
  4. * by Houfeng
  5. * Houfeng@DCloud.io
  6. */
  7. (function($, win, doc) {
  8. var callbackIndex = 0;
  9. //生成回调函数名
  10. var createCallbackName = function() {
  11. return 'mui_jsonp_callback_' + (callbackIndex++);
  12. };
  13. var container = doc.body;
  14. //导入 script 元素
  15. var importScript = function(url) {
  16. var element = doc.createElement('script');
  17. element.src = url;
  18. element.async = true;
  19. element.defer = true;
  20. container.appendChild(element);
  21. return element;
  22. };
  23. //转换 URL,JSONP 只支持 get 方式的 queryString ,需将 data 拼入 url
  24. var convertUrl = function(url, data, jsonpParam, callbacnName) {
  25. if (jsonpParam) {
  26. url = url.replace(jsonpParam + '=?', jsonpParam + '=' + callbacnName);
  27. } else {
  28. data['callback'] = callbacnName;
  29. }
  30. var buffer = [];
  31. for (var key in data) {
  32. buffer.push(key + '=' + encodeURIComponent(data[key]));
  33. }
  34. return url + (url.indexOf('?') > -1 ? '&' : '?') + buffer.join('&');
  35. };
  36. //获取 QueryString
  37. var getQueryString = function(url) {
  38. url = url || location.search;
  39. var splitIndex = url.indexOf('?');
  40. var queryString = url.substr(splitIndex + 1);
  41. var paramArray = queryString.split('&');
  42. var result = {};
  43. for (var i in paramArray) {
  44. var params = paramArray[i].split('=');
  45. result[params[0]] = params[1];
  46. }
  47. return result;
  48. }
  49. //获取将传递给服务器的回调函数的请求参数名
  50. var getJSONPParam = function(url) {
  51. var query = getQueryString(url);
  52. for (var name in query) {
  53. if (query[name] === '?') {
  54. return name;
  55. }
  56. }
  57. return null;
  58. };
  59. /**
  60. * @description JSONP 方法
  61. * @param {String} url 将请求的地址
  62. * @param {Object} data 请求参数数据
  63. * @param {Function} callback 请求完成时回调函数
  64. * @return {mui} mui 对象自身
  65. **/
  66. $.getJSONP = function(url, data, callback) {
  67. if (!url) {
  68. throw "mui.getJSONP URL error!";
  69. }
  70. var jsonpParam = getJSONPParam(url);
  71. var callbackName = createCallbackName();
  72. data = data || {};
  73. callback = callback || $.noop;
  74. url = convertUrl(url, data, jsonpParam, callbackName);
  75. var scriptElement = null;
  76. win[callbackName] = function(result) {
  77. callback(result);
  78. if (scriptElement) {
  79. container.removeChild(scriptElement);
  80. }
  81. win[callbackName] = null;
  82. delete win[callbackName];
  83. };
  84. scriptElement = importScript(url);
  85. return $;
  86. };
  87. //为原 mui.getJSON 方法添加同 jQuery.getJSON 一样的 JSONP 支持
  88. $.__getJSON = $.getJSON;
  89. $.getJSON = function(url, data, callback) {
  90. var isJSONP = getJSONPParam(url) != null;
  91. if (isJSONP) {
  92. return $.getJSONP(url, data, callback);
  93. } else {
  94. return $.__getJSON(url, data, callback);
  95. }
  96. };
  97. }(mui, window, document));