UniCloud 云存储上传文件教程(不依赖uniapp)

上传流程

1. 获取上传的请求参数

先通过接口获取需要的请求参数,请查看 https://www.alapi.cn/api/view/100 获取需要的上传配置 先通过 ALAPI 获取 unicloud 云存储上传的请求参数,正常返回如下:

代码语言:javascript
复制
{
    "code": 200,
    "msg": "success",
    "data": {
        "Cache-Control": "max-age=2592000",
        "Content-Disposition": "attachment",
        "OSSAccessKeyId": "LTAIupaslTlUlspm",
        "Signature": "v9evdqBPxPNx5SHWzfGcIJeB2mM=",
        "host": "bsppub.oss-cn-shanghai.aliyuncs.com",
        "id": "18c6565f-1e34-4aec-9e82-a3d14743feb9",
        "key": "VKCEYUGU-xxxxx-47ff-4374-a4f5-1ed32921a3ff/0f2da8f5-9a60-4e8c-bed6-e94edafed57d.png",
        "policy": "eyJleHBpcmF0aW9uIjoiMjAyMi0wMS0xM1QxMTo1NzoyMi42NjFaIiwiY29uZGl0aW9ucyI6W1siY29udGVudC1sZW5ndGgtcmFuZ2UiLDAsMTA0ODU3NjAwXSxbImVxIiwiJGtleSIsIlZLQ0VZVUdVLTllZjY5ZjVlLTQ3ZmYtNDM3NC1hNGY1LTFlZDMyOTIxYTNmZi8wZjJkYThmNS05YTYwLTRlOGMtYmVkNi1lOTRlZGFmZWQ1N2QucG5nIl1dfQ==",
        "success_action_status": 200,
        "url": "https://vkceyugu.cdn.bspapp.com/VKCEYUGU-9ef69f5e-47ff-4374-a4f5-1ed32921a3ff/0f2da8f5-9a60-4e8c-bed6-e94edafed57d.png"
    },
    "time": 1642074442,
    "log_id": 340218631351480321
}

开始上传文件

获取到参数后就可以去上传文件了,每次上传文件都需要重新获取请求参数哦。这里教大家怎么用 AJAX上传和php上传 上传文件的必要参数

代码语言:javascript
复制
 "Cache-Control": "max-age=2592000",
        "Content-Disposition": "attachment",
        "OSSAccessKeyId": "LTAIupaslTlUlspm",
        "Signature": "v9evdqBPxPNx5SHWzfGcIJeB2mM=",
        "host": "bsppub.oss-cn-shanghai.aliyuncs.com",
        "id": "18c6565f-1e34-4aec-9e82-a3d14743feb9",
        "key": "VKCEYUGU-xxxxx-47ff-4374-a4f5-1ed32921a3ff/0f2da8f5-9a60-4e8c-bed6-e94edafed57d.png",
        "policy": "eyJleHBpcmF0aW9uIjoiMjAyMi0wMS0xM1QxMTo1NzoyMi42NjFaIiwiY29uZGl0aW9ucyI6W1siY29udGVudC1sZW5ndGgtcmFuZ2UiLDAsMTA0ODU3NjAwXSxbImVxIiwiJGtleSIsIlZLQ0VZVUdVLTllZjY5ZjVlLTQ3ZmYtNDM3NC1hNGY1LTFlZDMyOTIxYTNmZi8wZjJkYThmNS05YTYwLTRlOGMtYmVkNi1lOTRlZGFmZWQ1N2QucG5nIl1dfQ==",
        "success_action_status": 200,
        "url": "https://vkceyugu.cdn.bspapp.com/VKCEYUGU-9ef69f5e-47ff-4374-a4f5-1ed32921a3ff/0f2da8f5-9a60-4e8c-bed6-e94edafed57d.png",

在这些参数的最后面再加一个 file 参数就可以了,file就是你要上传的文件,还需要加一个请求头 {"X-OSS-server-side-encrpytion":"AES256"}

AJAX 上传

ajax 就是前端上传文件

代码语言:javascript
复制
$.ajax({
        url: "https://v2.alapi.cn/api/unicloud/upload",
        method: "POST",
        data: {
            token: "你的ALAPItoken",
            space_id: "你的unicloud spaceId",
            client_secret: "你的 unicloud secret 秘钥",
            filename: "要上传的文件名"
        },
        success: function (res) {
            if (res.code === 200) {
                //获取上传配置成功了。
                const {data} = res
                //
                const form = new FormData();
                //把上传的参数转为 fromdata
                for (const it in data) {
                    form.append(it,data[it])
                }
                //添加你要上传的文件, fileinput 是表单文件
                form.append("file",fileinput[0]);
                //form 参数配置好了后开始上传文件
                //设置上传的url,返回参数里面的 host 就是上传url地址
                //返回的参数里的 url 就是你上传完文件的url地址
                const uploadUrl = "https://"+data.host
                const url = data.url // 文件的url地址
                const id = data.id //文件的id,上传完成需要用到
                $.ajax({
                    url:uploadUrl,
                    method:"POST",
                    data:form,
                    headers:{"X-OSS-server-side-encrpytion":"AES256"},//要加这个请求头
                    success(res){
                        //上传完文件是没有返回实际内容的,但是返回的状态码是200
                        console.log('上传完成,url:' + url)
                        //上传完成后还需要设置上传完成,才会添加到你的服务空间里(不设置也是可以正常下载文件的,就是不会在你的云存储里面显示出来,好像也不会占用空间?)
                        $.ajax({
                            url:"https://v2.alapi.cn/api/unicloud/uploadok",
                            method:"POST",
                            data:{
                                token: "你的ALAPItoken",
                                space_id: "你的unicloud spaceId",
                                client_secret: "你的 unicloud secret 秘钥",
                                id: id,//文件ID
                            }
                        })
                    },
                    error(err){
                        console.log('上传出错了,请查看返回的 xml 信息。')
                    }
                })
            }
        }
    })

使用 PHP 上传

代码语言:javascript
复制
<?php

#1.获取上传配置

$token = "alapi的TOKEN";
$filename = "test.txt";
$space_id = 'unicloud spaceid';
$client_secret = "unicloud client_secret";

uploadConfig = json_decode(file_get_contents(sprintf(&#34;https://v2.alapi.cn/api/unicloud/upload?token=%s&amp;filename=%s&amp;space_id=%s&amp;client_secret=%s&#34;, token, filename, space_id, $client_secret)), true);

if ($uploadConfig['code'] == 200) {
config = uploadConfig['data'];
url = config['url'];//文件URL 地址
id = config['id'];//文件ID,设置上传完成需要用到
uploadUrl = &#39;https://&#39; . config['host'];//上传请求地址
//开始上传文件
$curl = curl_init();
config[&#39;file&#39;] = new CURLFile(filename);//添加上传的文件

curl_setopt_array($curl, [
    CURLOPT_URL =&gt; $config[&#39;host&#39;],
    CURLOPT_RETURNTRANSFER =&gt; true,
    CURLOPT_ENCODING =&gt; &#39;&#39;,
    CURLOPT_MAXREDIRS =&gt; 10,
    CURLOPT_TIMEOUT =&gt; 0,
    CURLOPT_FOLLOWLOCATION =&gt; true,
    CURLOPT_HTTP_VERSION =&gt; CURL_HTTP_VERSION_1_1,
    CURLOPT_CUSTOMREQUEST =&gt; &#39;POST&#39;,
    CURLOPT_POSTFIELDS =&gt; $config,
    CURLOPT_HEADEROPT =&gt; [&#39;X-OSS-server-side-encrpytion:AES256&#39;],//添加必要的请求头
]);
$response = curl_exec($curl);
$httpCode = curl_getinfo($curl, CURLINFO_HTTP_CODE);
curl_close($curl);
if($httpCode === 200){
    //上传成功了
    echo $url;//文件URL 地址

    //上传完成后还需要设置上传完成,才会添加到你的服务空间里(不设置也是可以正常下载文件的,就是不会在你的云存储里面显示出来,好像也不会占用空间?)
    file_get_contents(sprintf(&#34;https://v2.alapi.cn/api/unicloud/uploadok?token=%s&amp;id=%s&amp;space_id=%s&amp;client_secret=%s&#34;, $token, $id, $space_id, $client_secret));
}

}else{
//获取上传信息出错了,请检查秘钥信息
echo '//获取上传信息出错了,请检查秘钥信息';
}