luch request
3.1.1
npm install luch - request - S
npm을 사용하기 전에 빠른 시작을 읽어보세요.
github에 dependency를 설치한 후 npm run build
하고 DCloud/luch-request 폴더를 사용하세요.
DCloud 플러그인 시장
인스턴스 생성
import Request from '@/utils/luch-request/index.js' // 下载的插件
// import Request from 'luch-request' // 使用npm
const http = new Request ( ) ;
GET
요청 수행
http . get ( '/user/login' , { params : { userName : 'name' , password : '123456' } } ) . then ( res => {
} ) . catch ( err => {
} )
// 局部修改配置,局部配置优先级高于全局配置
http . get ( '/user/login' , {
params : { userName : 'name' , password : '123456' } , /* 会加在url上 */
header : { } , /* 会与全局header合并,如有同名属性,局部覆盖全局 */
dataType : 'json' ,
// 注:如果局部custom与全局custom有同名属性,则后面的属性会覆盖前面的属性,相当于Object.assign(全局,局部)
custom : { auth : true } , // 可以加一些自定义参数,在拦截器等地方使用。比如这里我加了一个auth,可在拦截器里拿到,如果true就传token
// #ifndef MP-ALIPAY
responseType : 'text' ,
// #endif
// #ifdef H5 || APP-PLUS || MP-ALIPAY || MP-WEIXIN
timeout : 60000 , // H5(HBuilderX 2.9.9+)、APP(HBuilderX 2.9.9+)、微信小程序(2.10.0)、支付宝小程序
// #endif
// #ifdef APP-PLUS
sslVerify : true , // 验证 ssl 证书 仅5+App安卓端支持(HBuilderX 2.3.3+)
// #endif
// #ifdef H5
withCredentials : false , // 跨域请求时是否携带凭证(cookies)仅H5支持(HBuilderX 2.6.15+)
// #endif
// 返回当前请求的task, options。请勿在此处修改options。非必填
getTask : ( task , options ) => {
// setTimeout(() => {
// task.abort()
// }, 500)
} ,
// 自定义验证器。statusCode必存在。非必填
validateStatus : function validateStatus ( statusCode ) {
return statusCode >= 200 && statusCode < 300
} ,
// forcedJSONParsing: true, // 是否尝试将响应数据json化,默认为true。如果失败则返回原数据
} ) . then ( res => {
} ) . catch ( err => {
} )
POST
요청 수행
http . post ( '/user/login' , { userName : 'name' , password : '123456' } ) . then ( res => {
} ) . catch ( err => {
} )
// 局部修改配置,局部配置优先级高于全局配置
http . post ( '/user/login' , { userName : 'name' , password : '123456' } , {
params : { } , /* 会加在url上 */
header : { } , /* 会与全局header合并,如有同名属性,局部覆盖全局 */
dataType : 'json' ,
// 注:如果局部custom与全局custom有同名属性,则后面的属性会覆盖前面的属性,相当于Object.assign(全局,局部)
custom : { auth : true } , // 可以加一些自定义参数,在拦截器等地方使用。比如这里我加了一个auth,可在拦截器里拿到,如果true就传token
// #ifndef MP-ALIPAY
responseType : 'text' ,
// #endif
// #ifdef H5 || APP-PLUS || MP-ALIPAY || MP-WEIXIN
timeout : 60000 , // H5(HBuilderX 2.9.9+)、APP(HBuilderX 2.9.9+)、微信小程序(2.10.0)、支付宝小程序
// #endif
// #ifdef APP-PLUS
sslVerify : true , // 验证 ssl 证书 仅5+App安卓端支持(HBuilderX 2.3.3+)
// #endif
// #ifdef H5
withCredentials : false , // 跨域请求时是否携带凭证(cookies)仅H5支持(HBuilderX 2.6.15+)
// #endif
// 返回当前请求的task, options。请勿在此处修改options。非必填
getTask : ( task , options ) => {
// setTimeout(() => {
// task.abort()
// }, 500)
} ,
// 自定义验证器。statusCode必存在。非必填
validateStatus : function validateStatus ( statusCode ) {
return statusCode >= 200 && statusCode < 300
}
} ) . then ( res => {
} ) . catch ( err => {
} )
upload
요청 실행
http . upload ( 'api/upload/img' , {
params : { } , /* 会加在url上 */
// #ifdef APP-PLUS || H5
files : [ ] , // 需要上传的文件列表。使用 files 时,filePath 和 name 不生效。App、H5( 2.6.15+)
// #endif
// #ifdef MP-ALIPAY
fileType : 'image/video/audio' , // 仅支付宝小程序,且必填。
// #endif
filePath : '' , // 要上传文件资源的路径。
// 注:如果局部custom与全局custom有同名属性,则后面的属性会覆盖前面的属性,相当于Object.assign(全局,局部)
custom : { auth : true } , // 可以加一些自定义参数,在拦截器等地方使用。比如这里我加了一个auth,可在拦截器里拿到,如果true就传token
name : 'file' , // 文件对应的 key , 开发者在服务器端通过这个 key 可以获取到文件二进制内容
// #ifdef H5 || APP-PLUS
timeout : 60000 , // H5(HBuilderX 2.9.9+)、APP(HBuilderX 2.9.9+)
// #endif
header : { } , /* 会与全局header合并,如有同名属性,局部覆盖全局 */
formData : { } , // HTTP 请求中其他额外的 form data
// 返回当前请求的task, options。请勿在此处修改options。非必填
getTask : ( task , options ) => {
// task.onProgressUpdate((res) => {
// console.log('上传进度' + res.progress);
// console.log('已经上传的数据长度' + res.totalBytesSent);
// console.log('预期需要上传的数据总长度' + res.totalBytesExpectedToSend);
//
// // 测试条件,取消上传任务。
// if (res.progress > 50) {
// uploadTask.abort();
// }
// });
} ,
// 是否尝试将响应数据json化。boolean 或者一个包含include的对象。非必填。默认true。include为数组,包含需要json化的method
// forcedJSONParsing: {include: ['UPLOAD', 'DOWNLOAD']}
} ) . then ( res => {
// 返回的res.data 已经进行JSON.parse
} ) . catch ( err => {
} )
luch-request 공식 웹사이트 주소
깃허브
vue-admin-beautiful - 엔터프라이즈 수준의 범용 미드엔드, 백엔드 및 프런트엔드 솔루션(최신 버전의 vue/cli 4 기반, 컴퓨터, 휴대폰 및 태블릿 지원)
vue-admin-beautiful - 온라인 데모
uView 문서 - 상세한 문서와 사용하기 쉬운 멋진 모바일 크로스엔드 프레임워크
本地访问接口时跨域请求,所以浏览器会先发一个option 去预测能否成功,然后再发一个真正的请求
(요청 헤더, 요청 방법, Baidu 단순 요청을 직접 확인하세요).Object/String/ArrayBuffer
이것은 실제로 0.0과 관련이 없습니다.import { http } from '@/utils/luch-request/index.js'
setConfig
에 어떤 매개변수를 설정해야 합니까? request
인터셉터에 어떤 매개변수를 설정해야 합니까?setConfig
는 헤더의 일부 기본값 및 기본 전역 매개변수(전역 요청 구성)와 같은 일부 정적/기본 매개변수를 설정하는 데 적합합니다. token
여기 설정에 적합하지 않습니다.interceptors.request
인터셉터에는 더 넓은 범위의 애플리케이션이 있지만 여전히 setConfig
에 몇 가지 정적 항목을 넣는 것이 좋습니다. 인터셉터는 모든 요청마다 호출되는 반면 setConfig
호출될 때 한 번만 수정됩니다. npm
< a href = "https://ext.dcloud.net.cn/plugin?id=392" > luch-request </ a >
370306150
을 추가하세요. 포상사항에 대한 자세한 안내