Bootstrap

vue3.0 + element-plus + 上传图片到七牛云

时间:

2021.8.30 ,想在项目中,把上传的图片存储到 七牛云 上,但是发现,七牛云他只给了一个限时 30 天的 cdn,就是在30天后,这个就会取消掉,不知道上传后的图片还有没有在 。需要绑定 备案的域名,就应该可以永久使用了吧,不过我没有 备案的域名,但是还是记录一下 。


1. 创建七牛云账号:

创建账号后,需要实名后,才能开通一个 30 天,内存为 10G 的域名!

1、创建一个对象存储 空间:

在这里插入图片描述

他会让你起一个空间名称,用来存储你的东西!

在这里插入图片描述

地区我选择的是 华南的,访问控制选择 公开的。

创建后,会显示在这里,要注意的是,如果没有绑定一个 备案的域名,他到30天,就会过期。东西应该就会没有了的。要注意,应该是这样的。

在这里插入图片描述


2. 在后台,返回 token 给前端:

1、选择后端技术:

这个是 七牛云 规定的,上传图片时,必须携带 token 来证明用户的信息,我使用的是 node 来做后端。

官网教程: 这个网站是使用,不同的技术的 后端,生成 token 的做法,可以看看 。

在这里插入图片描述

我选中 node.js 。

他会跳到 github ,让我们现在插件 :
在这里插入图片描述

2、下载插件:

serve > npm install qiniu

是在你的后端中下载的。

使用他时,需要几个参数,要到 七牛云 去查找:

右上角头像 ----- 个人中心 ----- 密钥管理 ------ 就可以看到 AK 和 SK 2个值,复制;

  • accessKey :AK;
  • secretKdy : SK;
  • scope: 你创建空间的名字;

使用的是 nestjs:

import * as qiniu from 'qiniu';

@Controller(
;