

English
将本地资源上传到开发者服务器。
name | type | required | default | description |
---|---|---|---|---|
options | UploadFileOptions | YES | - | - |
name | type | optinal | default | description |
---|---|---|---|---|
url | string | YES | - | 开发者服务器 url |
filePath | string | NO | null | 要上传文件资源的路径 |
name | string | NO | null | 文件对应的 key , 开发者在服务器端通过这个 key 可以获取到文件二进制内容 |
files | Array<UploadFileOptionFiles> | NO | null | 需要上传的文件列表。 |
header | UTSJSONObject | NO | null | HTTP 请求 Header, header 中不能设置 Referer |
formData | UTSJSONObject | NO | null | HTTP 请求中其他额外的 form data |
timeout | number | NO | 120000 | 超时时间,单位 ms |
success | (result: UploadFileSuccess) => void | NO | null | 成功返回的回调函数 |
fail | (result: UploadFileFail) => void | NO | null | 失败的回调函数 |
complete | (result: any) => void | NO | null | 结束的回调函数(调用成功、失败都会执行) |
name | type | optinal | default | description |
---|---|---|---|---|
name | string | NO | "file" | multipart 提交时,表单的项目名,默认为 file,如果 name 不填或填的值相同,可能导致服务端读取文件时只能读取到一个文件。 |
uri | string | YES | - | 要上传文件资源的路径 |
name | type | optinal | default | description |
---|---|---|---|---|
data | string | YES | - | 开发者服务器返回的数据 |
statusCode | number | YES | - | 开发者服务器返回的 HTTP 状态码 |
name | type | optinal | default | description |
---|---|---|---|---|
errCode | 5 | 1000 | 100001 | 100002 | 600003 | 600009 | 602001 | YES | - | 错误码 - 5 接口超时 - 1000 服务端系统错误 - 100001 json数据解析错误 - 100002 错误信息json解析失败 - 600003 网络中断 - 600009 URL格式不合法 - 602001 request系统错误 |
errSubject | string | YES | - | 统一错误主题(模块)名称 |
data | any | NO | - | 错误信息中包含的数据 |
errMsg | string | YES | - | - |
Type | optinal |
---|---|
UploadTask | NO |
name | type | optinal | default | description |
---|---|---|---|---|
abort | () => void | YES | - | 中断上传任务。 |
onProgressUpdate | (callback: (result: OnProgressUpdateResult) => void) => void | YES | - | 监听上传进度变化。 |
name | type | optinal | default | description |
---|---|---|---|---|
progress | number | YES | - | 上传进度百分比 |
totalBytesSent | number | YES | - | 已经上传的数据长度,单位 Bytes |
totalBytesExpectedToSend | number | YES | - | 预期需要上传的数据总长度,单位 Bytes |
Android version | Android uni-app | Android uni-app-x | iOS version | iOS uni-app | iOS uni-app-x | |
---|---|---|---|---|---|---|
abort | 4.4 | √ | 3.9+ | 9.0 | √ | x |
onProgressUpdate | 4.4 | √ | 3.9+ | 9.0 | √ | x |
Android version | Android uni-app | Android uni-app-x | iOS version | iOS uni-app | iOS uni-app-x |
---|---|---|---|---|---|
4.4 | √ | 3.9+ | 9.0 | √ | x |
<template>
<!-- #ifdef APP -->
<scroll-view style="flex: 1">
<!-- #endif -->
<view>
<page-head :title="title"></page-head>
<view class="uni-padding-wrap uni-common-mt">
<view class="demo">
<image v-if="imageSrc" :src="imageSrc" class="image" mode="widthFix"></image>
<text v-else class="uni-hello-addfile" @click="chooseImage">+ 选择图片</text>
</view>
</view>
</view>
<!-- #ifdef APP -->
</scroll-view>
<!-- #endif -->
</template>
<script>
export default {
data() {
return {
title: 'uploadFile',
imageSrc: '',
task: null as UploadTask | null,
//自动化测试例专用
jest_result: false,
}
},
onLoad() {
},
onUnload() {
this.imageSrc = '';
uni.hideLoading();
this.task?.abort();
},
methods: {
chooseImage: function () {
uni.chooseImage({
count: 1,
sizeType: ['compressed'],
sourceType: ['album'],
success: (res) => {
console.log('chooseImage success, temp path is', res.tempFilePaths[0])
var imageSrc = res.tempFilePaths[0]
uni.showLoading({
title: '上传中'
})
this.task = uni.uploadFile({
url: 'https://unidemo.dcloud.net.cn/upload', //仅为示例,非真实的接口地址
filePath: imageSrc,
name: 'file',
formData: {
'user': 'test'
},
success: (res) => {
console.log('uploadImage success, res is:', res)
uni.hideLoading();
uni.showToast({
title: '上传成功',
icon: 'success',
duration: 1000
})
this.imageSrc = imageSrc
},
fail: (err) => {
console.log('uploadImage fail', err);
uni.hideLoading();
uni.showModal({
content: err.errMsg,
showCancel: false
});
},
});
},
fail: (err) => {
console.log('chooseImage fail', err)
}
})
},
//自动化测试例专用
jest_uploadFile() {
const imageSrc = "/static/uni.png";
this.task = uni.uploadFile({
url: 'https://unidemo.dcloud.net.cn/upload', //仅为示例,非真实的接口地址
filePath: imageSrc,
name: 'file',
formData: {
'user': 'test'
},
success: () => {
this.jest_result = true;
},
fail: () => {
this.jest_result = false;
},
})
}
}
}
</script>
<style>
.image {
width: 100%;
}
.demo {
background: #fff;
padding: 50rpx;
justify-content: center;
align-items: center;
}
.uni-hello-addfile {
text-align: center;
background: #fff;
padding: 50rpx;
margin-top: 10px;
font-size: 38rpx;
color: #808080;
}
</style>
name | type | optinal | default | description |
---|---|---|---|---|
errMsg | string | YES | - | 错误信息 |