Ви не можете вибрати більше 25 тем Теми мають розпочинатися з літери або цифри, можуть містити дефіси (-) і не повинні перевищувати 35 символів.
 
 
 

166 рядки
5.3 KiB

  1. import deepMerge from "../function/deepMerge";
  2. import validate from "../function/test";
  3. class Request {
  4. // 设置全局默认配置
  5. setConfig(customConfig) {
  6. // 深度合并对象,否则会造成对象深层属性丢失
  7. this.config = deepMerge(this.config, customConfig);
  8. }
  9. // 主要请求部分
  10. request(options = {}) {
  11. // 检查请求拦截
  12. if (this.interceptor.request && typeof this.interceptor.request === 'function') {
  13. let tmpConfig = {};
  14. let interceptorReuest = this.interceptor.request(options);
  15. if (interceptorReuest === false) {
  16. return false;
  17. }
  18. this.options = interceptorReuest;
  19. }
  20. options.dataType = options.dataType || this.config.dataType;
  21. options.responseType = options.responseType || this.config.responseType;
  22. options.url = options.url || '';
  23. options.params = options.params || {};
  24. options.header = Object.assign(this.config.header, options.header);
  25. options.method = options.method || this.config.method;
  26. return new Promise((resolve, reject) => {
  27. options.complete = (response) => {
  28. // 请求返回后,隐藏loading(如果请求返回快的话,可能会没有loading)
  29. uni.hideLoading();
  30. // 清除定时器,如果请求回来了,就无需loading
  31. clearTimeout(this.config.timer);
  32. this.timer = null;
  33. // 判断用户对拦截返回数据的要求,如果originalData为true,返回所有的数据(response)到拦截器,否则只返回response.data
  34. if(this.config.originalData) {
  35. // 判断是否存在拦截器
  36. if (this.interceptor.response && typeof this.interceptor.response === 'function') {
  37. let resInterceptors = this.interceptor.response(response);
  38. // 如果拦截器不返回false,就将拦截器返回的内容给this.$u.post的then回调
  39. if (resInterceptors !== false) {
  40. resolve(resInterceptors);
  41. } else {
  42. // 如果拦截器返回false,意味着拦截器定义者认为返回有问题,直接接入catch回调
  43. reject(response);
  44. }
  45. } else {
  46. // 如果要求返回原始数据,就算没有拦截器,也返回最原始的数据
  47. resolve(response);
  48. }
  49. } else {
  50. if (response.statusCode == 200) {
  51. if (this.interceptor.response && typeof this.interceptor.response === 'function') {
  52. let resInterceptors = this.interceptor.response(response.data);
  53. if (resInterceptors !== false) {
  54. resolve(resInterceptors);
  55. } else {
  56. reject(response.data);
  57. }
  58. } else {
  59. // 如果不是返回原始数据(originalData=false),且没有拦截器的情况下,返回纯数据给then回调
  60. resolve(response.data);
  61. }
  62. } else {
  63. // 不返回原始数据的情况下,服务器状态码不为200,modal弹框提示
  64. if(response.errMsg) {
  65. uni.showModal({
  66. title: response.errMsg,
  67. cancelColor:"#999999",
  68. });
  69. }
  70. reject(response)
  71. }
  72. }
  73. }
  74. // 判断用户传递的URL是否/开头,如果不是,加上/,这里使用了uView的test.js验证库的url()方法
  75. options.url = validate.url(options.url) ? options.url : (this.config.baseUrl + (options.url.indexOf('/') == 0 ?
  76. options.url : '/' + options.url));
  77. // 是否显示loading
  78. // 加一个是否已有timer定时器的判断,否则有两个同时请求的时候,后者会清除前者的定时器id
  79. // 而没有清除前者的定时器,导致前者超时,一直显示loading
  80. if(this.config.showLoading && !this.config.timer) {
  81. this.config.timer = setTimeout(() => {
  82. uni.showLoading({
  83. title: this.config.loadingText,
  84. mask: this.config.loadingMask
  85. })
  86. this.config.timer = null;
  87. }, this.config.loadingTime);
  88. }
  89. uni.request(options);
  90. })
  91. }
  92. constructor() {
  93. this.config = {
  94. baseUrl: '', // 请求的根域名
  95. // 默认的请求头
  96. header: {},
  97. method: 'POST',
  98. // 设置为json,返回后uni.request会对数据进行一次JSON.parse
  99. dataType: 'json',
  100. // 此参数无需处理,因为5+和支付宝小程序不支持,默认为text即可
  101. responseType: 'text',
  102. showLoading: true, // 是否显示请求中的loading
  103. loadingText: '请求中...',
  104. loadingTime: 800, // 在此时间内,请求还没回来的话,就显示加载中动画,单位ms
  105. timer: null, // 定时器
  106. originalData: false, // 是否在拦截器中返回服务端的原始数据,见文档说明
  107. loadingMask: true, // 展示loading的时候,是否给一个透明的蒙层,防止触摸穿透
  108. }
  109. // 拦截器
  110. this.interceptor = {
  111. // 请求前的拦截
  112. request: null,
  113. // 请求后的拦截
  114. response: null
  115. }
  116. // get请求
  117. this.get = (url, data = {}, header = {}) => {
  118. return this.request({
  119. method: 'GET',
  120. url,
  121. header,
  122. data
  123. })
  124. }
  125. // post请求
  126. this.post = (url, data = {}, header = {}) => {
  127. return this.request({
  128. url,
  129. method: 'POST',
  130. header,
  131. data
  132. })
  133. }
  134. // put请求,不支持支付宝小程序(HX2.6.15)
  135. this.put = (url, data = {}, header = {}) => {
  136. return this.request({
  137. url,
  138. method: 'PUT',
  139. header,
  140. data
  141. })
  142. }
  143. // delete请求,不支持支付宝和头条小程序(HX2.6.15)
  144. this.delete = (url, data = {}, header = {}) => {
  145. return this.request({
  146. url,
  147. method: 'DELETE',
  148. header,
  149. data
  150. })
  151. }
  152. }
  153. }
  154. export default new Request