vue oss 上传图片

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/besttoby01/article/details/88699484

今天 有人问阿里云的上传图片的问题。

我就去查看了下,阿里云的上传分为表单上传,普通上传,点断上传(分片上传)。

这次主要是使用普通上传,来做上传一个图片功能。

第一步:你的有阿里云账号,然后开辟存储空间,拥有一个区域,然后得有一个包名,当然还得有accessKeyId和accessKeySecret(id和秘钥)。

第二步:我这项目是使用vue写的。所以我使用npm install ali-oss 安装ali-oss插件。

第三步:引入这个插件,请求后台返回配置信息,就是accessKeyId和accessKeySecret以及另外一些参数,因为保密性的原因,一般是交给后台返回的。

第四步:使用put上传。这里一共有两个参数(文件名字,文件流)。

代码:

const OSS = require("ali-oss");


var client = new OSS({
    region: "oss-cn-beijing",
    endpoint: "oss-cn-beijing.aliyuncs.com", //外网域名
    accessKeyId: "accessKeyId",
    accessKeySecret: "accessKeySecret",
    bucket: "bucket"
});

client.put(name, file).then(results => {
     console.log(results);
 }).catch(err => {
     console.log(err);
 });

后面研究分片上传的时候,发现好多有趣的事情。但是因为阿里云账号是自己的就没怎么去试上传了。

发现上传的时候可以设置第三个参数,这个参数可以监听上传进度,回调函数,可以监听上传的断点。第三个参数文档

猜你喜欢

转载自blog.csdn.net/besttoby01/article/details/88699484