/** * @(#)2019/11/14. * 封装底层请求,试图替代jq的请求 * @author 足道 * Copyright (c) 2019, YUNXI. All rights reserved. * YUNXI PROPRIETARY/CONFIDENTIAL. Use is subject to license terms. */ const jsonpParse = JSON.parse class XHR { constructor(url, headers, method) { this.url = url this.method = method this.headers = headers || {} this.xhr = new XMLHttpRequest() this.init() } /** * 这样就可以链式调用节约一行代码 * * @static * @param {*} url * @param {*} header * @returns * @memberof XHR */ static new(url, header) { return new this(url, header) } /** * 父类初始化 * * @memberof XHR */ init() { this.xhr.timeout = 8000 this.xhr.open(this.method, this.url, true) Object.keys(this.headers).forEach((key) => { const val = this.headers[key] this.xhr.setRequestHeader(key, val) }) } _send = (xhr, data) => { if (data == null) { xhr.send() } else { xhr.send(data) } } /** * 请求发送 * * @param {Object} data * @returns */ xhrSend(data, onprogress) { const { xhr } = this xhr.withCredentials = false return new Promise((resolve, reject) => { xhr.onreadystatechange = (event) => { const that = event.currentTarget const { status } = that if (that.readyState === 4) { if ([200, 204].includes(status)) { const { response } = that resolve(response.data) } else if (status === 403) { resolve({ status, message: '没有权限' }) } else if (that.readyState === 4) { reject({ status, body: that }) } } } xhr.onprogress = onprogress xhr.ontimeout = () => reject('请求超时') xhr.onerror = reject this._send(xhr, data) }) } } class PostXhr extends XHR { constructor(url, headers) { super(url, headers, 'post') this.xhr.timeout = 100 * 1000 } send(data) { this.xhrSend(data) } } class GetXhr extends XHR { constructor(url, headers) { super(url, headers, 'get') this.xhr.timeout = 100 * 1000 this.xhr.responseType = 'json' } send(data) { return this.xhrSend(data) } } export { PostXhr, GetXhr }