dropzone.js सामग्री-प्रकार

Question

के साथ S3 पर सीधे अपलोड अपलोड करें मैं वर्तमान में dropzone.js का उपयोग कर रहा हूं ताकि एक निर्धारित यूआरएल के साथ छवियों को S3 पर अपलोड किया जा सके। सब कुछ काम करता है सिवाय इसके कि मैं अपलोड की जा रही फ़ाइल के सामग्री-प्रकार को सेट करने में असमर्थ हूं। डिफ़ॉल्ट रूप से वे सभी binary/octet-stream के साथ अपलोड किए जा रहे हैं और मैं उन्हें ब्राउज़र में सीधे देखने में असमर्थ हूं।

मेरे S3 presigned नीति इस तरह दिखता है:

const policy = s3PolicyV4.generate({ 
    key: key, 
    bucket: process.env.S3_BUCKET, 
    contentType: 'multipart/form-data', 
    region: process.env.REGION, 
    accessKey: process.env.ACCESS_KEY_ID, 
    secretKey: process.env.SECRET_ACCESS_KEY, 
}); 

मैं कोई भाग्य के साथ यहाँ contentType कुंजी को बदलने की कोशिश की है और मैं भी कुछ अनुसंधान करने के बाद इस जोड़ने के लिए कोशिश की है।

conditions: [ 
    ["starts-with", "$Content-Type", ""] 
] 

यह फ्रंट एंड कोड है जहां मैं dropzone.js विकल्पों पर निर्धारित यूआरएल के मान जोड़ता हूं।

$.ajax({ 
    type: "POST", 
    contentType: "application/json", 
    dataType: "json", 
    url: api_endpoint, 
    cache: false, 
    success: function(data) { 
     s3_filename_key = data.key; 
     $this.options.params = { 
      key: data.key, 
      acl: data.acl, 
      success_action_status: data.success_action_status, 
      "X-Amz-Credential": data['X-Amz-Credential'], 
      "X-Amz-Algorithm": data['X-Amz-Algorithm'], 
      "X-Amz-Date": data['X-Amz-Date'], 
      "Policy": data.Policy, 
      "X-Amz-Signature": data['X-Amz-Signature'] 
     } 
     done(); 
    }, 
    error: function(data) {} 
}); 

जब मैं dropzone विकल्प मैं इस परिणाम वापस पाने के लिए Content-Type जोड़ने - Invalid according to Policy: Extra input fields: content-type

यहाँ मेरी CORS बाल्टी के लिए विन्यास है।

<?xml version="1.0" encoding="UTF-8"?> 
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/"> 
<CORSRule> 
    <AllowedOrigin>*</AllowedOrigin> 
    <AllowedMethod>HEAD</AllowedMethod> 
    <AllowedMethod>PUT</AllowedMethod> 
    <AllowedMethod>POST</AllowedMethod> 
    <AllowedMethod>GET</AllowedMethod> 
    <ExposeHeader>ETag</ExposeHeader> 
    <ExposeHeader>Content-length</ExposeHeader> 
    <AllowedHeader>*</AllowedHeader> 
    <AllowedHeader>Content-*</AllowedHeader> 
</CORSRule> 
</CORSConfiguration> 

Answer 1

सही सामग्री जोड़ने का प्रयास करें टाइप, आपने इसके बजाय enctype परिभाषित किया है। उदा .:

const policy = s3PolicyV4.generate({ 
key: key, 
bucket: process.env.S3_BUCKET, 
contentType: 'application/json', 
region: process.env.REGION, 
accessKey: process.env.ACCESS_KEY_ID, 
secretKey: process.env.SECRET_ACCESS_KEY, 
}); 

मल्टीपार्ट/फॉर्म-डेटा फॉर्म की enctype विशेषता है।

Answer 2

हम नोडजेस में नीचे दिए गए समाधान का उपयोग कर रहे हैं।

const mimeobj = FileType(buffer); 

const s3Options = { 
    ACL: 'public-read', 
    Body: buffer, 
    ContentType: mimeobj.mime, 
    Key: UUID + '.' + mimeobj.ext, 
    Bucket: 'your-bucket-name' 
}; 

S3.upload(s3Options).send((err, data) => { 

    if (err) { 
     return reply(Boom.badImplementation('Internal Server Error')); 
    } 

    const responseObj = { 
     orgFileName: decodedFileName, 
     name:uuId + '.' + mimeobj.ext, 
     url: data.Location 
    }; 

    responseArray.push(responseObj); 

    count++; 
    if (count === fileCount) { 
     return reply({ files: responseArray }); 
    } 
});