更新记录

0.1.1（2025-05-12）

更新插件依赖库

0.1.0（2025-05-12）

小程序上传文件到阿里云OSS

平台兼容性

云函数类插件通用教程

使用云函数类插件的前提是：使用HBuilderX 2.9+

调用该云函数返回上传所需参数，由前端直接上传文件至阿里云oss；脱离了后端进行上传，极大的提升了上传文件速度。

本示例已提供完整可运行的代码，本文简要说明代码过程

1. 获取OSS秘钥

登录阿里云个人中心，获取账户的AccessKey ID和AccessKey Secret，推荐使用子用户的AccessKey

2. 设置CORS支持跨域

在bucket里面：数据安全 -> 跨域设置，按下图创建一条规则，勾选：GET、POST、PUT、DELETE、HEAD

3. 设置小程序request合法域名、uploadFile合法域名

登录小程序后台管理找到，开发管理->开发设置->服务器域名->点击右边【修改】按钮，依次在request合法域名、uploadFile合法域名处 添加 域名可参考：https://doc.dcloud.net.cn/uniCloud/publish.html#useinmp

4. 页面调用

<template>
    <view class="content">
        <image class="logo" src="/static/logo.png"></image>
        <view class="text-area">
            <button @click="uploadFile">上传</button>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                title: 'Hello'
            }
        },
        onLoad() {

        },
        methods: {
            uploadFile() {
                uni.chooseVideo({
                    success: async (res) => {
                        console.log("res====>", res)
                        let filePath = res.tempFilePath;
                        // #ifdef MP-ALIPAY
                        filePath = res.tempFile;
                        // #endif

                        const BaseUrl = "xxxxxxxxx";  // 外网访问 Bucket 域名 去你的 Bucket域名 概览中找， 示例: abc.oss-cn-beijing.aliyuncs.com
                        const accessKeyId = "xxxxxxxxx"; //AccessKeyId 去你的阿里云上控制台上找
                        const accessKeySecret = "xxxxxxxxx"; //AccessKeySecret 去你的阿里云上控制台上找
                        const ali = uniCloud.importObject('ossFile') //调用云对象 勿修改
                        //调用云对象的方法，勿修改  code:200 表示成功， 其他都是失败，错误信息：resData.err
                        let resData = await ali.getUploadFileParam({
                            count: 1,         //上传文件数量,默认上传1个 示例 coun:9 表示上传9个文件,
                            accessKeyId,     //必传，固定参数勿修改
                            accessKeySecret  //必传，固定参数勿修改 
                        });
                        if (resData.code != 200) {
                            console.log("上传失败..", resData.err);
                            return;
                        }
                        //返回生成文件名, 数组 [] 形式
                        let aliyunFileKeys = resData.data.aliyunFileKeys; 
                        let policy = resData.data.policy;
                        let OSSAccessKeyId = resData.data.OSSAccessKeyId;
                        let signature = resData.data.signature;
                        console.log("resData====>", resData)
                        // key: 表示上传的路径 + 文件名 + 文件名后缀 
                        let key = "123/" + aliyunFileKeys[0] + ".mp4"; 
                        uni.uploadFile({
                            url: BaseUrl,
                            filePath: filePath,
                            name: 'file',
                            formData: {
                                key,   //固定参数勿修改
                                policy, //固定参数勿修改
                                OSSAccessKeyId, //固定参数勿修改
                                signature, //固定参数勿修改
                                success_action_status: '200', //固定参数勿修改
                            },
                            success: (uploadFileRes) => {
                                //上传成功后文件的Url = BaseUrl + '/' + key    
                                console.log("上传成功", BaseUrl + '/' + key)
                            },
                            fail: (error) => {
                                console.log("上传失败..", error);
                            }
                        });
                    },
                    fail: (err) => {
                        console.log("err====>", err)
                    }
                })
            }
        }
    }
</script>

5. 技术交流群，有问题可在群内反馈

QQ群：705623891

6. 提醒

前端签名有密钥泄露风险，注意妥善保管accessKeyId和accessKeySecret 有问题请联系我微信