html5 - specifies - which are the different events that the video tag generates
¿Cómo implementar plupload directamente en s3 con el tiempo de ejecución ''html5''? (1)
Se menciona en esta pregunta muy relacionada ( Subir directamente a Amazon S3 usando el tiempo de ejecución de Plupload HTML5 ) que Amazon ahora permite cargas de CORS usando HTML5, pero ¿alguien ha configurado con éxito plupload para enviar archivos a s3 utilizando el tiempo de ejecución ''html5''? Las respuestas a la pregunta relacionada no ofrecen ningún detalle de implementación.
Aquí está mi configuración de plupload actual:
$("#uploader").plupload({
// General settings
runtimes: ''html5,flash'',
url: ''http://s3.amazonaws.com/'' + $(''#Bucket'').val(),
max_file_size: ''20mb'',
multipart: true,
multipart_params: {
''key'': ''${filename}'', // use filename as a key
''Filename'': ''${filename}'', // adding this to keep consistency across the runtimes
''acl'': $(''#Acl'').val(),
''Content-Type'': ''binary/octet-stream'',
''success_action_status'': ''201'',
''AWSAccessKeyId'': $(''#AWSAccessKeyId'').val(),
''policy'': $(''#Policy'').val(),
''signature'': $(''#Signature'').val()
},
file_data_name: ''file'',
multiple_queues: true,
filters: [
{ title: "Image files", extensions: "jpg,png,gif,jpeg" }
],
flash_swf_url: ''/Scripts/plupload/plupload.flash.swf'',
});
El código anterior funciona para el tiempo de ejecución ''flash'', por lo que la política se genera y se firma correctamente.
¿Me falta algún argumento en el objeto de configuración multipart_params?
Además, estoy usando la siguiente configuración CORS en mi cubo s3:
<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
<AllowedOrigin>*</AllowedOrigin>
<AllowedMethod>PUT</AllowedMethod>
<AllowedMethod>POST</AllowedMethod>
<AllowedMethod>GET</AllowedMethod>
<AllowedMethod>HEAD</AllowedMethod>
<MaxAgeSeconds>3000</MaxAgeSeconds>
<AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>
¿Debo realizar otros cambios de configuración en el depósito s3 para permitir las cargas de CORS desde el tiempo de ejecución plupload ''html5''?
Aquí está el código exacto que usé para que esto funcione ...
var params = {};
$(''#uploader'').pluploadQueue({
runtimes: ''html5,flash'',
flash_swf_url: ''/js/plupload/1.5.4/plupload.flash.swf'', // Have to load locally
url: ''https://s3.amazonaws.com/my-bucket-name'',
multiple_queues: true,
preinit: {
UploadFile: function (up, file) {
up.settings.multipart_params = {
key: file.name,
filename: file.name,
AWSAccessKeyId: ''my-aws-access-key'',
acl: ''private'',
policy: params[file.name]["policy"],
signature: params[file.name]["signature"],
success_action_status: ''201''
}
}
},
init: {
FilesAdded: function (up, files) {
plupload.each(files, function (file) {
$.ajax({
url: ''/r/prepare_raw_upload'',
type: ''post'',
data: {
acl: ''private'',
bucket: ''my-bucket-name'',
file: file.name
},
success: function (data) {
if (data.success) {
params[data.file] = { policy: data.policy, signature: data.signature };
}
else if (data.message) {
alert(data.message);
}
}
});
});
}
}
});
Notarás en el detector de eventos FilesAdded que tengo una llamada ajax. Esto recupera la política y la firma de mi servidor para cada archivo agregado.
Aquí está el código en la parte posterior que devuelve la política y la firma
public static Dictionary<string, object> prepareUpload(DateTime now, string acl, string bucket, string key, string file)
{
Dictionary<string, object> result = new Dictionary<string, object>();
ASCIIEncoding encoding = new ASCIIEncoding();
string policy = createUploadPolicy(now, acl, bucket, key);
result.Add("policy", Convert.ToBase64String(encoding.GetBytes(policy)));
result.Add("signature", createUploadSignature(policy));
result.Add("file", file);
return result;
}
public static string createUploadPolicy(DateTime now, string acl, string bucket, string key)
{
ASCIIEncoding encoding = new ASCIIEncoding();
JavaScriptSerializer jss = new JavaScriptSerializer();
Hashtable policy = new Hashtable();
policy.Add("expiration", now.AddDays(1).ToString("yyyy''-''MM''-''dd''T''HH'':''mm'':''ss.fff''Z''"));
ArrayList conditions = new ArrayList();
conditions.Add(new Hashtable { { "acl", acl } });
conditions.Add(new Hashtable { { "bucket", bucket } });
conditions.Add(new Hashtable { { "key", key } });
conditions.Add(new ArrayList { "starts-with", "$name", "" });
conditions.Add(new ArrayList { "starts-with", "$filename", "" });
conditions.Add(new ArrayList { "starts-with", "$success_action_status", "" });
policy.Add("conditions", conditions);
return jss.Serialize(policy);
}
public static string createUploadSignature(string policy)
{
ASCIIEncoding encoding = new ASCIIEncoding();
byte[] policyBytes = encoding.GetBytes(policy);
string policyBase64 = Convert.ToBase64String(policyBytes);
byte[] secretKeyBytes = encoding.GetBytes(ConfigurationManager.AppSettings["AWSSecretKey"]);
HMACSHA1 hmacsha1 = new HMACSHA1(secretKeyBytes);
byte[] policyBase64Bytes = encoding.GetBytes(policyBase64);
byte[] signatureBytes = hmacsha1.ComputeHash(policyBase64Bytes);
return Convert.ToBase64String(signatureBytes);
}
Enlaces muy útiles para hacer este trabajo fueron ...