小程序请求API接口，网络请求封装-白红宇

小程序请求API接口，网络请求封装

阅读量：4084 次

发布时间：2019-05-25

本文共 2441 字，大约阅读时间需要 8 分钟。

utils/request.js: 核心的API请求接口类封装

pages/index/index.js: 网络请求控制页面的逻辑

pages/index/index.wxml: 页面的布局文件

pages/index/index.wxss: 页面的样式文件

代码示例：

[AppleScript]

纯文本查看

复制代码

                                     
/
*
*
 
*
 @desc    API请求接口类封装
 
*
 @author  [
url
=
mailto
:
shangheguang@yeah.net]shangheguang@yeah.net[
/
url
]
 
*
 @
date
 2017
-01
-20
 
*
/
/
*
*
 
*
 POST请求API
 
*
 @param  
{ 
String
}
 url
 接口地址
 
*
 @param  
{ 
Object
}
 params      请求的参数
 
*
 @param  
{ 
Object
}
 sourceObj   来源对象
 
*
 @param  
{ 
Function
}
 successFun  接口调用成功返回的回调函数
 
*
 @param  
{ 
Function
}
 failFun     接口调用失败的回调函数
 
*
 @param  
{ 
Function
}
 completeFun 接口调用结束的回调函数
(
调用成功、失败都会执行
)
 
*
/
function requestPostApi
(
url
,
 params
,
 sourceObj
,
 successFun
,
 failFun
,
 completeFun
)
 { 
    
requestApi
(
url
,
 params
,
 'POST'
,
 sourceObj
,
 successFun
,
 failFun
,
 completeFun
)
}
/
*
*
 
*
 GET请求API
 
*
 @param  
{ 
String
}
 url
 接口地址
 
*
 @param  
{ 
Object
}
 params      请求的参数
 
*
 @param  
{ 
Object
}
 sourceObj   来源对象
 
*
 @param  
{ 
Function
}
 successFun  接口调用成功返回的回调函数
 
*
 @param  
{ 
Function
}
 failFun     接口调用失败的回调函数
 
*
 @param  
{ 
Function
}
 completeFun 接口调用结束的回调函数
(
调用成功、失败都会执行
)
 
*
/
function requestGetApi
(
url
,
 params
,
 sourceObj
,
 successFun
,
 failFun
,
 completeFun
)
 { 
    
requestApi
(
url
,
 params
,
 'GET'
,
 sourceObj
,
 successFun
,
 failFun
,
 completeFun
)
}
/
*
*
 
*
 请求API
 
*
 @param  
{ 
String
}
 url
 接口地址
 
*
 @param  
{ 
Object
}
 params      请求的参数
 
*
 @param  
{ 
String
}
 method      请求类型
 
*
 @param  
{ 
Object
}
 sourceObj   来源对象
 
*
 @param  
{ 
Function
}
 successFun  接口调用成功返回的回调函数
 
*
 @param  
{ 
Function
}
 failFun     接口调用失败的回调函数
 
*
 @param  
{ 
Function
}
 completeFun 接口调用结束的回调函数
(
调用成功、失败都会执行
)
 
*
/
function requestApi
(
url
,
 params
,
 method
,
 sourceObj
,
 successFun
,
 failFun
,
 completeFun
)
 { 
    
if
 (
method 
=
=
 'POST'
)
 { 
        
var contentType 
=
 '
application
/
x
-
www
-
form
-
urlencoded'
    
}
 else
 { 
        
var contentType 
=
 '
application
/
json'
    
}
    
wx.request
(
{ 
        
url
:
 url
,
        
method
:
 method
,
        
data
:
 params
,
        
header
:
 { 
'Content
-
Type'
:
 contentType
}
,
        
success
:
 function 
(
res
)
 { 
            
typeof successFun  
=
=
 'function' 
&
&
 successFun
(
res.
data
,
 sourceObj
)
        
}
,
        
fail
:
 function 
(
res
)
 { 
            
typeof failFun     
=
=
 'function' 
&
&
 failFun
(
res.
data
,
 sourceObj
)
        
}
,
        
complete
:
 function 
(
res
)
 { 
            
typeof completeFun 
=
=
 'function' 
&
&
 completeFun
(
res.
data
,
 sourceObj
)
        
}
    
}
)
}
module.exports 
=
 { 
        
requestPostApi
,
            
requestGetApi
}
            
          