封装jsop请求（2021-8-20）

[yaogengzhu]

function jsonp(url, opts) {
    // 实现Promise化
    return new Promise((resolve, reject) => {
      // 自增值初始化 
      let count = 0;
      //设置默认参数
      const { 
        prefix = '__jp',
        param = 'callback',
        timeout = 60000,
        data = {}
      } = opts;
      let name = prefix + count++;
      let timer;
      //清除script标签以及注册的全局函数以及超时定时器
      function cleanup() { // 清除函数
        if (script.parentNode) {
          script.parentNode.removeChild(script);
          window[name] = null;
          if (timer) {
            clearTimeout(timer);
          }
        }
      }
      if (timeout) { // 超时
        timer = setTimeout(() => {
          cleanup();
          reject('timeout');
        }, timeout);
      }
      // 注册全局函数，等待执行中...
      window[name] = res => {
        // 只要这个函数一执行，就表示请求成功，可以使用清除函数了
        if (window[name]) {
          cleanup();
        }
        // 将请求到的数据扔给then
        resolve(res);
      }
      // 以下将data对象格式的参数拼接到url的后面
      let str = '';
      for (const key in data) {
        const value = data[key] !== undefined ? data[key] : '';
        str += `&${key}=${encodeURIComponent(value)}`;
      }
      url = url + (url.indexOf('?') > 0 ? '' : '?') + str.substr(1);
      // 最后加上与服务端协商的jsonp请求字段
      url = `${url}&${param}=${name}`;
      const script = document.createElement('script');
      script.src = url;
      // 以下这条执行且成功后，全局等待函数就会被执行
      document.head.appendChild(script);
    })
}

[yaogengzhu]

/**
 * 接口函数封装
 * {
 *  url, data, method,
 * }
 * @param {*} options
 * @returns
 */
function fetch(options) {
    const url = 'xxxxxx'
    return new Promise((resolve, reject) => {
        const data =
            options.method && options.method.toLocaleLowerCase() === 'get'
                ? 'params'
                : 'data';
        axios({
            url: url + options.url,
            method: options.method || 'post',
            [data]: options.data || {},
            headers: {
                'Content-Type': 'application/json',
            },
        })
            .then((response) => {
                const { data: result } = response;
                if (result.code === 1) {
                    //
                } else {
                    resolve(result);
                }
            })
            .catch((e) => {
                reject(e);
            });
    });
}