私は現在、blueimpライブラリを介して自分のバケットにクライアント側のアップロードをセットアップしようとしています。これは、セットアップのための最新のチュートリアルです。
私は署名を間違って作成しているようですが、どうやってそうしているのかは私にはわかりません。誰かが新しい目を貸してくれるなら、それは大歓迎です.
また、正確な応答は「SignatureDoesNotMatch計算されたリクエストの署名が、提供された署名と一致しません。キーと署名方法を確認してください」です。
署名が生成される PHP API
$policy = base64_encode(
preg_replace("/\n|\r/", "",
json_encode(
array(
"expiration" => $expires,
"bucket" => $S3_BUCKET,
"acl" => "public-read",
"starts-with" => $object_name,
"success_action_status" => "201"
)
)
)
);
//$policy = preg_replace("/\n|\r/", "", $policy);
$signature = base64_encode(
hash_hmac(
'sha1',
$config->aws_secret,
$policy
)
);
$signature = preg_replace("/\n/", "", $signature);
$awsAccessInfo = array(
"signature" => $signature,
"aws_key" => $AWS_ACCESS_KEY,
"policy" => $policy,
"bucket" => $S3_BUCKET,
"key" => $AWS_ACCESS_KEY
);
return $this->getResponse()->json($awsAccessInfo);
JS
$('.direct-upload').each(function() {
var form = $(this);
$(this).fileupload({
url: form.attr('action'),
type: 'POST',
autoUpload: true,
dataType: 'xml', // This is really important as s3 gives us back the url of the file in a XML document
add: function (event, data) {
console.log(data.files[0].name);
$.ajax({
url: "http://api/sign_request_s3?allowOrigin=1",
type: 'GET',
dataType: 'json',
data: { s3_object_name: data.files[0].name}, // send the file name to the server so it can generate the key param
async: false,
success: function(data) {
// Now that we have our data, we update the form so it contains all
// the needed data to sign the request
console.log("Key: " + data.aws_key + " Signature: " + data.signature);
form.find('input[name=key]').val(data.aws_key);
form.find('input[name=AWSAccessKeyId]').val(data.aws_key);
form.find('input[name=policy]').val(data.policy);
form.find('input[name=signature]').val(data.signature);
}
});
data.submit();
},
send: function(e, data) {
$('.progress').fadeIn();
console.log("sending...");
},
progress: function(e, data){
// This is what makes everything really cool, thanks to that callback
// you can now update the progress bar based on the upload progress
var percent = Math.round((e.loaded / e.total) * 100)
$('.bar').css('width', percent + '%')
},
fail: function(e, data) {
console.log('failed');
},
success: function(data) {
// Here we get the file url on s3 in an xml doc
var url = $(data).find('Location').text()
console.log('success');
$('#real_file_url').val(url) // Update the real input in the other form
},
done: function (event, data) {
$('.progress').fadeOut(300, function() {
$('.bar').css('width', 0)
})
},
})
})