使用上传组件上传文件到 OSS

前提条件

OSS 关闭阻止公共访问

登录OSS控制台,关闭阻止公共访问

image

OSS 跨域配置

imageimage

名称

配置

来源配置

https://mobinext.console.aliyun.com

https://runtime.mobiapp.cloud

允许 Headers

*

暴露 Headers

ETag

配置RAM角色

  1. 登录RAM控制台,单击进入需要配置的角色。

    image

  2. 复制ARN 信息并为角色授予OSS权限AliyunOSSFullAccess

    image

RAM 子账号

  1. 子账号需要授权 AliyunOSSFullAccess

    image

  2. 创建或者使用已有的子账号的AccessKey

    image

集成配置

  1. 创建阿里云OSS集成,详细操作步骤,请参见使用阿里云 OSS 集成

  2. 使用上传文件组件。

    image

    1. 动作:选择上传至阿里云 OSS。

    2. OSS 凭证操作:选择创建的 oss_link 集成。

    3. 上传大小限制:配置最大可上传的文件大小。

    4. 操作类型:获取选择表单上传配置(最大5G)。

    5. 目录:配置提交到 OSS 的文件目录,注意:这里不能以 / 开头,上图配置的目录为:{{mobi.appInfo.appId}}/{{mobi.currentUser.name}}表达的概念是,上传到当前应用目录下的某个用户的目录下。

    6. 访问权限:继承 Bucket,注意:这里的选择是默认的,可以根据您需求进行配置。

  3. 选择回调,配置上传成功后的事件。

    image

  4. 配置文件上传之后的访问地址给指定的变量,{{up_file.action}}/{{up_file.extraData.key}}这里采用拼串的方式组合出文件的下载地址。

配置过程中遇到的问题总结

文件上传后访问提示 AccessDenied

image

解决方案

需要在 OSS 中关闭阻止公共访问。

获取上传策略失败

be95f1521836643b85a94345848a371d

解决方案

检查 OSS 的跨域配置,需要包含的链接,自己的域名地址,魔笔的测试链接( https://runtime.mobiapp.cloud ),魔笔的设计时地址( https://mobinext.console.aliyun.com )。

上传错误

image

解决方案

检查 Bucket 是否配置正确。

image

分片上传失败

45b06fc58f5e27c9536438560d44291b

解决方案

  • 暴露 Headers 是否配置 ETag

    image

  • 检查集成是否有配置 ARN 对应字段搜索本文档:ARN 信息。

    image

上传失败 InvalidObjectName 400

image

解决方案

目录配置不能存在前缀 /

image

正确示例:image