我只使用JavaScript，不使用任何服务器端代码，通过REST API实现了从客户机到AmazonS3的直接文件上载。一切正常但有一件事让我担心...
当我向AmazonS3 REST API发送请求时，我需要对请求进行签名，并将签名放入authentication头中。要创建签名，我必须使用我的密钥。但是所有的事情都发生在客户端，所以，秘密密钥可以很容易地从页面源（即使我混淆/加密我的源）泄露出来。
我该怎么处理？这真的是个问题吗？也许我可以限制特定私钥的使用，仅限于来自特定CORS来源的REST API调用，并且仅限于PUT和POST方法，或者仅限于S3和特定bucket的链接密钥？可能还有其他的认证方式吗？
“无服务器”解决方案是理想的，但我可以考虑涉及一些服务器端处理，不包括将一个文件上传到我的服务器，然后发送到S3。
我认为你想要的是使用POST的基于浏览器的上传。
基本上，您确实需要服务器端代码，但它所做的只是生成签名策略。一旦客户端代码有了签名的策略，它就可以使用POST直接上传到S3，而不需要通过服务器传输数据。
以下是官方文档链接：
图：http://docs.aws.amazon.com/amazons3/latest/dev/usinghttppost.html
示例代码：http://docs.aws.amazon.com/amazons3/latest/dev/httppostexamples.html
签名的策略将以如下表单出现在html中：
<html>
<head>
...
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
...
</head>
<body>
...
<form action="http://johnsmith.s3.amazonaws.com/" method="post" enctype="multipart/form-data">
Key to upload: <input type="input" name="key" value="user/eric/" /><br />
<input type="hidden" name="acl" value="public-read" />
<input type="hidden" name="success_action_redirect" value="http://johnsmith.s3.amazonaws.com/successful_upload.html" />
Content-Type: <input type="input" name="Content-Type" value="image/jpeg" /><br />
<input type="hidden" name="x-amz-meta-uuid" value="14365123651274" />
Tags for File: <input type="input" name="x-amz-meta-tag" value="" /><br />
<input type="hidden" name="AWSAccessKeyId" value="AKIAIOSFODNN7EXAMPLE" />
<input type="hidden" name="Policy" value="POLICY" />
<input type="hidden" name="Signature" value="SIGNATURE" />
File: <input type="file" name="file" /> <br />
<!-- The elements after this will be ignored -->
<input type="submit" name="submit" value="Upload to Amazon S3" />
</form>
...
</html>
注意，表单操作将文件直接发送到S3-而不是通过服务器。
每次您的用户想要上传文件时，您都要在服务器上创建策略和签名。您将页面返回到用户的浏览器。然后，用户可以将文件直接上传到S3，而不需要通过服务器。
签署策略时，通常会使策略在几分钟后过期。这将强制您的用户在上载之前与服务器进行对话。这使您可以监视和限制上载，如果您愿意。
进出服务器的唯一数据是签名的URL。您的密钥在服务器上是保密的。
您可以通过AWS S3 Cogniti来完成此操作，请尝试以下链接：
http://docs.aws.amazon.com/awsjavascriptsdk/guide/browser-examples.html#Amazon_S3
也试试这段代码
只需更改Region、IdentityPoolId和bucket名称即可
null
<!DOCTYPE html>
<html>
<head>
<title>AWS S3 File Upload</title>
<script src="https://sdk.amazonaws.com/js/aws-sdk-2.1.12.min.js"></script>
</head>
<body>
<input type="file" id="file-chooser" />
<button id="upload-button">Upload to S3</button>
<div id="results"></div>
<script type="text/javascript">
AWS.config.region = 'your-region'; // 1. Enter your region
AWS.config.credentials = new AWS.CognitoIdentityCredentials({
IdentityPoolId: 'your-IdentityPoolId' // 2. Enter your identity pool
});
AWS.config.credentials.get(function(err) {
if (err) alert(err);
console.log(AWS.config.credentials);
});
var bucketName = 'your-bucket'; // Enter your bucket name
var bucket = new AWS.S3({
params: {
Bucket: bucketName
}
});
var fileChooser = document.getElementById('file-chooser');
var button = document.getElementById('upload-button');
var results = document.getElementById('results');
button.addEventListener('click', function() {
var file = fileChooser.files[0];
if (file) {
results.innerHTML = '';
var objKey = 'testing/' + file.name;
var params = {
Key: objKey,
ContentType: file.type,
Body: file,
ACL: 'public-read'
};
bucket.putObject(params, function(err, data) {
if (err) {
results.innerHTML = 'ERROR: ' + err;
} else {
listObjs();
}
});
} else {
results.innerHTML = 'Nothing to upload.';
}
}, false);
function listObjs() {
var prefix = 'testing';
bucket.listObjects({
Prefix: prefix
}, function(err, data) {
if (err) {
results.innerHTML = 'ERROR: ' + err;
} else {
var objKeys = "";
data.Contents.forEach(function(obj) {
objKeys += obj.Key + "<br>";
});
results.innerHTML = objKeys;
}
});
}
</script>
</body>
</html>