vue oss 上传图片

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

我就去查看了下，阿里云的上传分为表单上传，普通上传，点断上传（分片上传）。

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

第一步：你的有阿里云账号，然后开辟存储空间，拥有一个区域，然后得有一个包名，当然还得有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);
 });

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

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