I'm relatively news to Rails/AWS, and I'm trying to set up S3 File Field for uploading images to my AWS bucket. The set up instructions seem pretty straightforward, yet I am having issues.
I've gone ahead and installed the gem, included the JS, set up the initializer with my S3 credentials, and configured my bucket with the correct policy and CORS settings.
When I try to upload a file using the S3FileField
jQuery plugin, the fail
method gets called with the following object returned:
(Sorry it's so long, wasn't sure what points of info were important)
{
"disabled": false,
"create": null,
"dropZone": {
"0": {
"location": {
"ancestorOrigins": {},
"origin": "http://localhost:3000",
"hash": "",
"search": "",
"pathname": "/products/new",
"port": "3000",
"hostname": "localhost",
"host": "localhost:3000",
"protocol": "http:",
"href": "http://localhost:3000/products/new"
},
"jQuery111108232088349759579": 1,
"gtmHasClickListenerTag": true,
"gtmHasLinkClickListenerTag": true,
"gtmLinkClickListener": true
},
"context": {
"location": {
"ancestorOrigins": {},
"origin": "http://localhost:3000",
"hash": "",
"search": "",
"pathname": "/products/new",
"port": "3000",
"hostname": "localhost",
"host": "localhost:3000",
"protocol": "http:",
"href": "http://localhost:3000/products/new"
},
"jQuery111108232088349759579": 1,
"gtmHasClickListenerTag": true,
"gtmHasLinkClickListenerTag": true,
"gtmLinkClickListener": true
},
"length": 1
},
"replaceFileInput": true,
"singleFileUploads": true,
"limitMultiFileUploadSizeOverhead": 512,
"sequentialUploads": false,
"forceIframeTransport": false,
"multipart": true,
"recalculateProgress": true,
"progressInterval": 100,
"bitrateInterval": 500,
"autoUpload": true,
"messages": {
"uploadedBytes": "Uploaded bytes exceed file size"
},
"processData": false,
"contentType": false,
"cache": false,
"paramName": [
"file"
],
"url": "//***.oregon.amazonaws.com/",
"acl": "public-read",
"awsAccessKeyId": "***",
"key": "/${timestamp}/${filename}",
"policy": "***",
"signature": "***",
"fileInput": {
"0": {
"jQuery111108232088349759579": 27
},
"context": {
"jQuery111108232088349759579": 27
},
"length": 1
},
"pasteZone": {},
"form": {
"0": {
"0": {},
"1": {},
"2": {},
"3": {},
"4": {},
"5": {
"jQuery111108232088349759579": 46
},
"6": {},
"7": {},
"8": {},
"9": {
"jQuery111108232088349759579": 45
},
"10": {},
"length": 11,
"elements": {
"0": {},
"1": {},
"2": {},
"3": {},
"4": {},
"5": {
"jQuery111108232088349759579": 46
},
"6": {},
"7": {},
"8": {},
"9": {
"jQuery111108232088349759579": 45
},
"10": {},
"utf8": {},
"authenticity_token": {},
"product_title": {},
"product[title]": {},
"product_short_description": {},
"product[short_description]": {},
"product_long_description": {},
"product[long_description]": {},
"image-uploader_": {
"jQuery111108232088349759579": 46
},
"image-uploader[]": {
"jQuery111108232088349759579": 46
},
"product_features": {},
"product[features]": {},
"features-input_": {},
"features-input[]": {},
"product_tags": {},
"product[tags]": {},
"tags-input_": {
"jQuery111108232088349759579": 45
},
"tags-input[]": {
"jQuery111108232088349759579": 45
},
"commit": {}
},
"target": "",
"noValidate": false,
"name": "",
"method": "post",
"encoding": "application/x-www-form-urlencoded",
"enctype": "application/x-www-form-urlencoded",
"autocomplete": "on",
"action": "http://localhost:3000/products",
"acceptCharset": "UTF-8"
},
"context": {
"0": {},
"1": {},
"2": {},
"3": {},
"4": {},
"5": {
"jQuery111108232088349759579": 46
},
"6": {},
"7": {},
"8": {},
"9": {
"jQuery111108232088349759579": 45
},
"10": {},
"length": 11,
"elements": {
"0": {},
"1": {},
"2": {},
"3": {},
"4": {},
"5": {
"jQuery111108232088349759579": 46
},
"6": {},
"7": {},
"8": {},
"9": {
"jQuery111108232088349759579": 45
},
"10": {},
"utf8": {},
"authenticity_token": {},
"product_title": {},
"product[title]": {},
"product_short_description": {},
"product[short_description]": {},
"product_long_description": {},
"product[long_description]": {},
"image-uploader_": {
"jQuery111108232088349759579": 46
},
"image-uploader[]": {
"jQuery111108232088349759579": 46
},
"product_features": {},
"product[features]": {},
"features-input_": {},
"features-input[]": {},
"product_tags": {},
"product[tags]": {},
"tags-input_": {
"jQuery111108232088349759579": 45
},
"tags-input[]": {
"jQuery111108232088349759579": 45
},
"commit": {}
},
"target": "",
"noValidate": false,
"name": "",
"method": "post",
"encoding": "application/x-www-form-urlencoded",
"enctype": "application/x-www-form-urlencoded",
"autocomplete": "on",
"action": "http://localhost:3000/products",
"acceptCharset": "UTF-8"
},
"length": 1
},
"files": [
{
"unique_id": "awifniwe8jx7p66r"
}
],
"fileInputClone": {
"0": {
"jQuery111108232088349759579": 46
},
"length": 1,
"prevObject": {
"0": {
"jQuery111108232088349759579": 27
},
"context": {
"jQuery111108232088349759579": 27
},
"length": 1
},
"context": {
"jQuery111108232088349759579": 27
}
},
"originalFiles": [
{
"unique_id": "awifniwe8jx7p66r"
}
],
"_response": {
"jqXHR": {
"readyState": 0,
"responseText": "",
"status": 0,
"statusText": "error"
},
"textStatus": "error",
"errorThrown": ""
},
"_progress": {
"loaded": 0,
"total": 272171,
"bitrate": 0
},
"type": "POST",
"formAcceptCharset": "UTF-8",
"uploadedBytes": 0,
"headers": {},
"data": {},
"blob": null,
"loaded": 0,
"total": 272171,
"bitrate": 0,
"_bitrateTimer": {
"timestamp": 1439828714473,
"loaded": 0,
"bitrate": 0
},
"jqXHR": {
"readyState": 0,
"responseText": "",
"status": 0,
"statusText": "error"
},
"textStatus": "error",
"errorThrown": ""
}
I'm not entirely sure what the error is here. It doesn't help that the textStatus
is error
and the errorThrown
is ""
. I initially thought that the error was Uploaded bytes exceed file size
, but I discovered that this is actually part of the response object in jquery-fileupload (not sure why). There is a method called state()
that comes with the response, which, when called, is rejected
.
Could it be that I am working locally? Does it have to do with my AWS config (should I post my policy?)? I'm pretty new with this so any help is much appreciated!
Aucun commentaire:
Enregistrer un commentaire