my.uploadFile

上传本地资源到开发者服务器。

使用前提

请预先在 阿里云小程序管理中心 > 小程序详情 >设置 > 开发设置 > 服务器域名白名单 中配置域名白名单。小程序在以下 API 调用时只能与白名单中的域名进行通讯:HTTP请求(my.request)、上传文件(my.uploadFile)、下载文件(my.downloadFile)和 WebSocket(my.connectSocket)。

image

扫码体验

image.png

示例代码

//  API-DEMO page/upload-file/upload-file.json{    "defaultTitle": "Upload File"}undefined

<!-- API-DEMO page/upload-file/upload-file.axml --><view class="page"> 
  <button type="primary" onTap="uploadFile">上传图片</button>
</view>

// API-DEMO page/API/upload-file/upload-file.js
Page({
  uploadFile() {
    my.chooseImage({
      chooseImage: 1,
      success: res => {
        const path = res.apFilePaths[0];
        console.log(path);
        my.uploadFile({
          url: 'http://httpbin.org/post',
          fileType: 'image',
          fileName: 'file',
          filePath: path,
          success: res => {
            my.alert({ title: '上传成功' });
          },
          fail: function(res) {
            my.alert({ title: '上传失败' });
          },
        });
      },
    });
  },
});

上传文件的后端代码。

@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
    
    String path =  req.getParameter("filePath");
    //得到要下载的文件名
    String fileName = URLEncoder.encode(req.getParameter("fileName"),"utf-8");
    String fileType = path.substring(path.lastIndexOf('.')+1,path.length());
    FileInputStream fis = new FileInputStream(path); 
    
    System.out.println("debugFileName: "+ fileName);
    //下载文件存放路径
    String localPath = "";
    
    FileOutputStream fs = new FileOutputStream(localPath + fileName +"."+fileType);
    
    resp.setHeader("content-disposition", "attachment;filename="+fileName);
    resp.setHeader("content-type", fileType );
   
    //执行fileOutputStream的输出操作
    int len = 1;
    byte[] b = new byte[1024];
    while((len=fis.read(b))!=-1){
        fs.write(b, 0, len);
    }
    fs.close();
    fis.close();
}

入参

Object 类型,属性如下:

属性

类型

必填

描述

url

String

开发者服务器地址。

filePath

String

要上传文件资源的本地定位符。

fileName

String

文件名,即对应的 key,开发者在服务器端通过这个 key 可以获取到文件二进制内容。

fileType

String

文件类型支持图片、视频、音频( image / video / audio)

header

Object

HTTP 请求 Header。

formData

Object

HTTP 请求中其他额外的 form 数据。

success

Function

调用成功的回调函数。

fail

Function

调用失败的回调函数。

complete

Function

调用结束的回调函数(调用成功、失败都会执行)。

success 回调函数

入参为 Object 类型,属性如下:

属性

类型

描述

data

String

服务器返回的数据。

statusCode

String

HTTP 状态码。

header

Object

服务器返回的 header。

结果码

结果码

描述

11

文件不存在。

12

上传文件失败。

13

没有权限。

UploadTask

版本要求:阿里云客户端 10.1.35 及以上版本,低版本需做 兼容处理。

监听上传进度变化,取消上传任务的对象。

方法

方法

描述

UploadTask.abort()

中断上传任务

UploadTask.onProgressUpdate(function callback)

监听上传进度变化事件

常见问题 FAQ

小程序上传图片可以自动转成 base64 (基于 64 个可打印字符来表示二进制数据的方法)吗?

小程序暂不支持图片转成 base64。

my.uploadFile 如何获取服务器返回的错误信息呢?

解决方案:

  1. 可以通过 success 回调中的 data 参数获取。

  2. 可以在服务端增加一个日志获取接口。如果上传失败,就请求到日志获取接口获取详细的失败日志。

my.uploadFile 默认超时时间是多少?是否可以设置默认延长时间?

my.uploadFile 默认超时时间是 30s,目前无法设置默认延长时间。

使用 my.uploadFile 上传文件,为何报错 error:12?

上传失败导致报错 error:12 ,造成上传失败的可能原因有:

  1. 文件过大

  2. 上传时间超过 30s

  3. 没有权限

使用 my.uploadFile 上传图片至后台,接收的是二进制图片,再从后台发送小程序前台对应的二进制图片,小程序前台是如何解析呢?

上传图片是后端通过二进制流接受图片,之后后端只需提供对应的图片在服务器上的位置地址就可以。