Skip to content

Commit 21fa63c

Browse files
author
dfounderliu
committed
add upload_demo
1 parent 109384c commit 21fa63c

File tree

3 files changed

+255
-0
lines changed

3 files changed

+255
-0
lines changed

‎how_to_upload_for_serverless/fileUploadToCos/index.py‎

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
import os, json, random, base64, hashlib
2+
import urllib.parse
3+
from qcloud_cos_v5 import CosConfig
4+
from qcloud_cos_v5 import CosS3Client
5+
6+
7+
def getPresignedUrl(event, context):
8+
print('event', event)
9+
print('context', context)
10+
body = json.loads(event['body'])
11+
12+
# 可以通过客户端传来的token进行鉴权，只有鉴权通过才可以获得临时上传地址
13+
# 这一部分可以按需修改，例如用户的token可以在redis获取，可以通过某些加密方法获取等
14+
# 也可以是传来一个username和一个token，然后去数据库中找这个username对应的token是否
15+
# 与之匹配等，这样会尽可能的提升安全性
16+
if "key" not in body or "token" not in body or body['token'] != 'mytoken' or "key" not in body:
17+
return {"url": None}
18+
19+
# 初始化COS对象
20+
region = os.environ.get("region")
21+
secret_id = os.environ.get("TENCENTCLOUD_SECRETID")
22+
secret_key = os.environ.get("TENCENTCLOUD_SECRETKEY")
23+
token = os.environ.get("TENCENTCLOUD_SESSIONTOKEN")
24+
config = CosConfig(Region=region, SecretId=secret_id, SecretKey=secret_key, Token=token)
25+
client = CosS3Client(config)
26+
27+
response = client.get_presigned_url(
28+
Method='PUT',
29+
Bucket=os.environ.get('bucket_name'),
30+
Key=body['key'],
31+
Expired=30,
32+
)
33+
return {"url": response.split("?sign=")[0],
34+
"sign": urllib.parse.unquote(response.split("?sign=")[1]),
35+
"token": os.environ.get("TENCENTCLOUD_SESSIONTOKEN")}
36+
37+
38+
def uploadToScf(event, context):
39+
print('event', event)
40+
print('context', context)
41+
body = json.loads(event['body'])
42+
43+
# 可以通过客户端传来的token进行鉴权，只有鉴权通过才可以获得临时上传地址
44+
# 这一部分可以按需修改，例如用户的token可以在redis获取，可以通过某些加密方法获取等
45+
# 也可以是传来一个username和一个token，然后去数据库中找这个username对应的token是否
46+
# 与之匹配等，这样会尽可能的提升安全性
47+
if "key" not in body or "token" not in body or body['token'] != 'mytoken' or "key" not in body:
48+
return {"url": None}
49+
50+
pictureBase64 = body["picture"].split("base64,")[1]
51+
with open('/tmp/%s' % body['key'], 'wb') as f:
52+
f.write(base64.b64decode(pictureBase64))
53+
region = os.environ.get("region")
54+
secret_id = os.environ.get("TENCENTCLOUD_SECRETID")
55+
secret_key = os.environ.get("TENCENTCLOUD_SECRETKEY")
56+
token = os.environ.get("TENCENTCLOUD_SESSIONTOKEN")
57+
config = CosConfig(Region=region, SecretId=secret_id, SecretKey=secret_key, Token=token)
58+
client = CosS3Client(config)
59+
response = client.upload_file(
60+
Bucket=os.environ.get("bucket_name"),
61+
LocalFilePath='/tmp/%s' % body['key'],
62+
Key=body['key'],
63+
)
64+
return {
65+
"uploaded": 1,
66+
"url": 'https://%s.cos.%s.myqcloud.com' % (
67+
os.environ.get("bucket_name"), os.environ.get("region")) + body['key']
68+
}

‎how_to_upload_for_serverless/serverless.yaml‎

Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
Conf:
2+
component: "serverless-global"
3+
inputs:
4+
region: ap-beijing
5+
runtime: Python3.6
6+
role: SCF_UploadToCOSRole
7+
bucket_name: scf-upload-1256773370
8+
9+
UploadToCOSRole:
10+
component: "@serverless/tencent-cam-role"
11+
inputs:
12+
roleName: ${Conf.role}
13+
service:
14+
- scf.qcloud.com
15+
policy:
16+
policyName:
17+
- QcloudCOSFullAccess
18+
19+
SCFUploadBucket:
20+
component: '@gosls/tencent-cos'
21+
inputs:
22+
bucket: ${Conf.bucket_name}
23+
region: ${Conf.region}
24+
cors:
25+
- id: abc
26+
maxAgeSeconds: '10'
27+
allowedMethods:
28+
- POST
29+
- PUT
30+
allowedOrigins:
31+
- '*'
32+
allowedHeaders:
33+
- '*'
34+
35+
getUploadPresignedUrl:
36+
component: "@gosls/tencent-scf"
37+
inputs:
38+
name: Upload_getUploadPresignedUrl
39+
role: ${Conf.role}
40+
codeUri: ./fileUploadToCos
41+
handler: index.getPresignedUrl
42+
runtime: ${Conf.runtime}
43+
region: ${Conf.region}
44+
description: 获取cos临时上传地址
45+
memorySize: 64
46+
timeout: 3
47+
environment:
48+
variables:
49+
region: ${Conf.region}
50+
bucket_name: ${Conf.bucket_name}
51+
52+
uploadToSCFToCOS:
53+
component: "@gosls/tencent-scf"
54+
inputs:
55+
name: Upload_uploadToSCFToCOS
56+
role: ${Conf.role}
57+
codeUri: ./fileUploadToCos
58+
handler: index.uploadToScf
59+
runtime: ${Conf.runtime}
60+
region: ${Conf.region}
61+
description: 通过上传到SCF再传到COS
62+
memorySize: 128
63+
timeout: 20
64+
environment:
65+
variables:
66+
region: ${Conf.region}
67+
bucket_name: ${Conf.bucket_name}
68+
69+
UploadService:
70+
component: "@gosls/tencent-apigateway"
71+
inputs:
72+
region: ${Conf.region}
73+
protocols:
74+
- http
75+
- https
76+
serviceName: UploadAPI
77+
environment: release
78+
endpoints:
79+
- path: /upload/cos
80+
description: 通过SCF上传cos
81+
method: POST
82+
enableCORS: TRUE
83+
function:
84+
functionName: Upload_uploadToSCFToCOS
85+
- path: /upload/presigned
86+
description: 获取临时地址
87+
method: POST
88+
enableCORS: TRUE
89+
function:
90+
functionName: Upload_getUploadPresignedUrl

‎how_to_upload_for_serverless/upload.html‎

Lines changed: 97 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,97 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>MyUpload For SCF</title>
6+
<script>
7+
8+
function doUpload(key, bodyUrl, bodySign, bodyToken) {
9+
var fileObj = document.getElementById("fileCos").files[0];
10+
xmlhttp = window.XMLHttpRequest ? (new XMLHttpRequest()) : (new ActiveXObject("Microsoft.XMLHTTP"));
11+
xmlhttp.open("PUT", bodyUrl, true);
12+
xmlhttp.onload = function () {
13+
console.log(xmlhttp.responseText)
14+
if (!xmlhttp.responseText) {
15+
alert("上传成功")
16+
}
17+
};
18+
xmlhttp.setRequestHeader("Authorization", bodySign);
19+
xmlhttp.setRequestHeader("x-cos-security-token", bodyToken);
20+
xmlhttp.send(fileObj);
21+
}
22+
23+
function UpladFileCOS() {
24+
const key = Math.random().toString(36).substr(2);
25+
26+
var xmlhttp = window.XMLHttpRequest ? (new XMLHttpRequest()) : (new ActiveXObject("Microsoft.XMLHTTP"))
27+
xmlhttp.onreadystatechange = function () {
28+
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
29+
var body = JSON.parse(xmlhttp.responseText)
30+
if (body['url']) {
31+
doUpload(key, body['url'], body['sign'], body['token'])
32+
}
33+
}
34+
}
35+
var getUploadUrl = 'https://service-f1zk07f3-1256773370.bj.apigw.tencentcs.com/release/upload/presigned'
36+
xmlhttp.open("POST", getUploadUrl, true);
37+
xmlhttp.setRequestHeader("Content-type", "application/json");
38+
xmlhttp.send(JSON.stringify({
39+
token: 'mytoken',
40+
key: key,
41+
}));
42+
}
43+
44+
function UpladFileSCF() {
45+
var oFReader = new FileReader();
46+
oFReader.readAsDataURL(document.getElementById("fileScf").files[0]);
47+
oFReader.onload = function (oFREvent) {
48+
const key = Math.random().toString(36).substr(2);
49+
var xmlhttp = window.XMLHttpRequest ? (new XMLHttpRequest()) : (new ActiveXObject("Microsoft.XMLHTTP"))
50+
xmlhttp.onreadystatechange = function () {
51+
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
52+
if (JSON.parse(xmlhttp.responseText)['uploaded'] == 1) {
53+
alert("上传成功")
54+
}
55+
}
56+
}
57+
var url = " https://service-f1zk07f3-1256773370.bj.apigw.tencentcs.com/release/upload/cos"
58+
xmlhttp.open("POST", url, true);
59+
xmlhttp.setRequestHeader("Content-type", "application/json");
60+
var postData = {
61+
picture: oFREvent.target.result,
62+
token: 'mytoken',
63+
key: key,
64+
}
65+
xmlhttp.send(JSON.stringify(postData));
66+
}
67+
68+
}
69+
</script>
70+
</head>
71+
<body>
72+
<center>
73+
<div style="width: 70%">
74+
<div style="text-align: center">
75+
<h3>Web端上传文件</h3>
76+
</div>
77+
<hr>
78+
<div>
79+
<p>
80+
方案1： 通过上传到SCF，进行处理再转存到COS，这种方法比较直观，但是问题是SCF从APIGW处只能接收到小于6M的数据，而且对二进制文件处理并不好。
81+
</p>
82+
<input type="file" name="file" id="fileScf"/>
83+
<input type="button" onclick="UpladFileSCF()" value="上传"/>
84+
</div>
85+
<hr>
86+
<div>
87+
<p>
88+
方案2：
89+
直接上传到COS，流程是先从SCF获得临时地址，进行数据存储（例如将文件信息存到redis等），然后再从客户端进行上传COS，上传结束可通过COS触发器触发函数，从存储系统（例如已经存储到redis）读取到更对信息，在对图像进行处理。
90+
</p>
91+
<input type="file" name="file" id="fileCos"/>
92+
<input type="button" onclick="UpladFileCOS()" value="上传"/>
93+
</div>
94+
</div>
95+
</center>
96+
</body>
97+
</html>

0 commit comments

Comments
 (0)