Appearance
前端使用 STS 令牌访问云存储
在前端使用 使用云函数生成云存储临时令牌(STS) 生成的 STS 令牌信息,访问云存储。
- 安装前端依赖
npm i @aws-sdk/client-s3 laf-client-sdk
1
- 编写前端代码实现文件上传:
import { S3, PutObjectCommand } from "@aws-sdk/client-s3";
import { Cloud } from "laf-client-sdk";
const APPID = "YOUR_APPID";
const cloud = new Cloud({
baseUrl: `https://${appid}.lafyun.com`,
getAccessToken: () => localStorage.getItem("access_token"),
});
// 获取云存储临时令牌
const { credentials, endpoint, region } = await cloud.invokeFunction(
"get-sts",
{}
);
const s3 = new S3({
endpoint: endpoint,
region: region,
credentials: {
accessKeyId: credentials.AccessKeyId,
secretAccessKey: credentials.SecretAccessKey,
sessionToken: credentials.SessionToken,
expiration: credentials.Expiration,
},
forcePathStyle: true,
});
// bucket name prefixed with appid
const bucket = `${APPID}-public`;
const cmd = new PutObjectCommand({
Bucket: bucket,
Key: "index.html",
Body: "Hello from laf oss!", // 文件内容可以是二进制数据,也可以是文本数据, 或者是 File 对象
ContentType: "text/html",
});
const res = await s3.send(cmd);
console.log(res);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
INFO
这里我们使用 @aws-sdk/client-s3
库,实现文件上传,你可以使用任何兼容 aws s3 接口的 SDK 来替代,如 minio js sdk