阅读(2675) 赞(9)

百度智能小程序本地资源上传

2020-08-13 15:31:27 更新

swan.uploadFile

请参考使用注意事项进行开发。

解释：将本地资源上传到开发者服务器，客户端发起一个 HTTPS POST 请求，其中content-type为

multipart/form-data

如页面通过 swan.chooseImage 等接口获取到一个本地资源的临时文件路径后，可通过此接口将本地资源上传到指定服务器。

方法参数

Object object

object 参数说明

属性名	类型	必填	说明
url	String	是	开发者服务器 url
filePath	String	是	要上传文件资源的路径
name	String	是	文件对应的 key ，开发者在服务器端通过这个 key 可以获取到文件二进制内容
header	Object	否	HTTP 请求 Header ， header 中不能设置 Referer
formData	Object	否	HTTP 请求中其他额外的 form data
success	Function	否	接口调用成功的回调函数
fail	Function	否	接口调用失败的回调函数
complete	Function	否	接口调用结束的回调函数（调用成功、失败都会执行）

success 返回参数说明

参数	类型	说明
data	String	开发者服务器返回的数据
statusCode	Number	开发者服务器返回的 HTTP 状态码

fail 返回值参数说明

Android

错误码	说明
201	解析失败，请检查调起协议是否合法
202	解析失败，请检查参数是否正确
1001	执行失败

iOS

错误码	说明
202	解析失败，请检查参数是否正确
1	解析失败，请检查参数是否正确

示例

在开发者工具中打开

图片示例

代码示例

<view class="wrap">
    <view class="card-area">
        <view class="display-area">
            <view s-if="{{filePath}}" bindtap="chooseImage">
                <image class="image-items" src="{{filePath}}" mode="aspectFit"></image>
            </view>
            <view s-else bindtap="chooseImage">
                <image class="img" src="https://b.bdstatic.com/searchbox/icms/searchbox/img/plus.png" rel="external nofollow" ></image>
                <view class="title">添加图片文件</view>
            </view>
        </view>
        <view class="button-area">
            <button type="primary" bindtap="uploadFile">点击上传</button>
        </view>
    </view>
</view>

Page({
    data: {
        filePath: ''
    },
    chooseImage() {
        swan.chooseImage({
            count: 1,
            sizeType: ['compressed'],
            sourceType: ['album'],
            success: res => {
                this.setData('filePath', res.tempFilePaths[0]);
            }
        });
    },
    uploadFile() {
        const filePath = this.getData('filePath');
        if (!filePath) {
            swan.showToast({
                title: '请先上传图片',
                icon: 'none'
            });
        }
        swan.uploadFile({
            url: 'https://xxxx', // 仅为示例，并非真实的接口地址
            filePath,
            name: 'myfile',
            header: {
                'content-type': 'multipart/form-data'
            },
            formData: {
                'user': 'test'
            },
            success: res => {
                swan.showToast({
                    title: '上传成功',
                    icon: 'none'
                });
                console.log('uploadFile success', res);
                this.setData({filePath});
            },
            fail: err => {
                console.log('uploadFile fail', err);
                swan.showToast({
                    title: '上传失败',
                    icon: 'none'
                });
            }
        }); 
    }
});

返回值：返回一个uploadTask对象，通过uploadTask，可监听上传进度变化事件，以及取消上传任务。

Bug & Tip

uploadFile 上传文件大小限制为 25M 。

← 百度智能小程序网络请求任务对象

百度智能小程序上传任务对象 →

百度智能小程序 本地资源上传