luch request
3.1.1
npm install luch - request - S
Baca Mulai Cepat Sebelum Menggunakan npm
Setelah menginstal dependensi di github, npm run build
dan gunakan folder DCloud/luch-request.
Pasar plugin DCloud
Buat contoh
import Request from '@/utils/luch-request/index.js' // 下载的插件
// import Request from 'luch-request' // 使用npm
const http = new Request ( ) ;
Lakukan permintaan 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 => {
} )
Lakukan permintaan 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 => {
} )
Jalankan permintaan 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 => {
} )
alamat situs web resmi luch-request
github
vue-admin-beautiful - solusi mid-end, back-end, dan front-end universal tingkat perusahaan (berdasarkan versi terbaru vue/cli 4, komputer pendukung, ponsel, dan tablet)
vue-admin-cantik - demo online
Dokumentasi uView - Kerangka kerja lintas ujung seluler yang mengagumkan dengan dokumentasi terperinci dan mudah digunakan
本地访问接口时跨域请求,所以浏览器会先发一个option 去预测能否成功,然后再发一个真正的请求
(amati sendiri header permintaan, Metode Permintaan, permintaan sederhana Baidu).Object/String/ArrayBuffer
import { http } from '@/utils/luch-request/index.js'
setConfig
? Parameter apa yang perlu diatur dalam pencegat request
?setConfig
cocok untuk mengatur beberapa parameter statis/default; seperti beberapa nilai default di header dan parameter global default (konfigurasi permintaan global). token
tidak cocok untuk pengaturan di sini.interceptors.request
interseptor memiliki cakupan aplikasi yang lebih luas, tetapi saya tetap menyarankan untuk memasukkan beberapa hal statis ke dalam setConfig
. Pencegat akan dipanggil pada setiap permintaan, sedangkan setConfig
hanya diubah satu kali saat dipanggil. npm
< a href = "https://ext.dcloud.net.cn/plugin?id=392" > luch-request </ a >
370306150
Instruksi terperinci tentang masalah hadiah