小程序服务器请求封装,微信小程序封装request请求

/**

* http请求方法枚举*/declare type HttpMethod=

| 'GET'

| 'OPTIONS'

| 'HEAD'

| 'POST'

| 'PUT'

| 'DELETE'

| 'TRACE'

| 'CONNECT';/**

* http 请求封装*/interface HttpRequest {

url: string;

method?: HttpMethod;

data?: any;

token?: boolean;

}/**

* http请求回调*/interface HttpCallback {

onSuccess: SuccessCallback;

onServerError: ErrorCallback;

onNetworkError: ErrorCallback;

}/**

* 成功的callback*/type SuccessCallback= (data: string | Object | ArrayBuffer) => void;/**

* 错误的callback*/type ErrorCallback= (error: HttpError) => void;/**

* 请求错误*/interface HttpError {

code: number;

errMsg: string;

}/**

* http请求拦截器*/interface HttpInterceptor {

handleResponse(statusCode: number, data: string| Object |ArrayBuffer, callback: HttpCallback);

}/**

* 默认的网络拦截器*/class DefaultHttpInterceptor implements HttpInterceptor {

private readonly CODE_SUCCESS: number= 200;

public constructor() {}

handleResponse(statusCode: number, data: string| Object |ArrayBuffer, callback: HttpCallback) {//console.log(1);

let error: ServerError;if (statusCode == this.CODE_SUCCESS) {

callback.onSuccess(data);return;

}

error= newServerError(statusCode, data, callback.onServerError);

error.processError();

}

}//默认回调

export class DefaultCallback implements HttpCallback {

onSuccess: SuccessCallback;

onServerError: ErrorCallback;

onNetworkError: ErrorCallback;

constructor(success: SuccessCallback, serverError?: ErrorCallback, networkError?: ErrorCallback) {this.onSuccess =success;if(serverError) {this.onServerError =serverError;

}else{this.onServerError = error =>{

console.error(error.errMsg);

};

}if(networkError) {this.onNetworkError =networkError;

}else{this.onNetworkError = error =>{

console.error(error.errMsg);

};

}

}

}/**

* 服务器返回错误，如401,500等*/class ServerError implements HttpError {

private readonly ERROR_CODE_UNAUTH: number= 401;

private readonly ERROR_CODE_SERVER_ERROR: number= 500;

code: number;

errMsg: string;

callback: ErrorCallback;

constructor(code: number, data: any, callback: { (error: HttpError):void}) {this.code =code;this.errMsg =data.msg;this.callback =callback;

}/**

* 网络请求错误处理

* @param callback*/processError() {

console.error('error code: ' + this.code + ', error message: ' + this.errMsg);if (this.code == this.ERROR_CODE_UNAUTH) {//处理401未认证错误

} else if (this.code >= this.ERROR_CODE_SERVER_ERROR) {//处理500服务器返回错误

} else{//处理未知错误

}

}

}/**

* 网络请求客户端*/class HttpClient {

private static readonly host: string= 'http://127.0.0.1:8686';

private static instance: HttpClient;

private DefaultInterceptor: HttpInterceptor;

private constructor() {this.DefaultInterceptor = newDefaultHttpInterceptor();

}/**

* 单例*/public static getInstance(): HttpClient {if (!this.instance) {this.instance = newHttpClient();

}return this.instance;

}/**

* 网络请求方法

* @param request 网络请求元素

* @param callback 请求回调

* @param interceptor 自定义拦截器*/public request(request: HttpRequest, callback?: DefaultCallback, interceptor?: HttpInterceptor) {

let method= request.method === undefined ? 'GET': request.method;

wx.request({

url:this.buildUrl(request.url),

data: request.data,

method: method,

header:this.buildHeader(method, request.token),

success: res=>{

console.log(res);if(interceptor) {

interceptor.handleResponse(res.statusCode, res.data, callback);

}else{this.DefaultInterceptor.handleResponse(res.statusCode, res.data, callback);

}

},

fail: (err: HttpError)=>{

console.log(err);if(callback.onNetworkError) {

callback.onNetworkError(err);

}

},

});

}/**

* 构建header

* @param method

* @param needToken*/private buildHeader(method: HttpMethod, needToken= false): Object {

let contentType: string;if (method == 'GET') {

contentType= '';

}else{

contentType= '';

}return{

contentType: contentType,

token: needToken? 'token' : '',

};

}/**

* 构建url

* @param url*/private buildUrl(url: string): string {return HttpClient.host +url;

}

}

export const Api= HttpClient.getInstance();