InvalidArgumentBucket POST must contain a field named 'key'. If it is specified, please check the order of the fields.keyB

[MattCowski]

Hey, this demo is super helpful since I've also been using the yo fullstack, but I keep running into this:

InvalidArgumentBucket POST must contain a field named 'key'. If it is specified, please check the order of the fields.keyB

any clue how to fix?

[nukulb]

Have you modified any code specifically ?
Or just running the example is causing this error ?

Sent from my iPhone

On Mar 25, 2014, at 7:24 PM, Matt Cowski notifications@github.com wrote:

Hey, this demo is super helpful since I've also been using the yo fullstack, but I keep running into this:

InvalidArgumentBucket POST must contain a field named 'key'. If it is specified, please check the order of the fields.keyB

any clue how to fix?

—
Reply to this email directly or view it on GitHub.

[MattCowski]

only think i modified was 'https://mybucket-dev123.s3-us-west-2.amazonaws.com/',
because i have a different location

[MattCowski]

and obviously the config.js:
"region": "us-west-2" and the keys / secret

[MattCowski]

amazon wouldn't let me use the already existing mybucket-dev url so I had to append 123 to it.

I also just changed aws.js {'bucket': 'mybucket-dev123'}, but didn't help

[nukulb]

Two things are possibly wrong here-

1. There are two locations where the bucket name is used.
   lib- https://github.com/hubba/s3-angular-file-upload/blob/master/lib/controllers/aws.js#L21
   app- https://github.com/hubba/s3-angular-file-upload/blob/master/app/scripts/controllers/main.js#L21
   You need to make sure you change the bucket name in both places.

2. One of the conditions specified in generation of the policy is
   ['starts-with', '$key', 's3UploadExample/'],
   which means that when making the post from the frontend you need the following line
   'key' : 's3UploadExample/'+ Math.round(Math.random()*10000) + '$$' + file.name,
   As in you only upload it to that folder. If you want to change the folder then you need to do it in both app/ and lib/
   https://github.com/hubba/s3-angular-file-upload/blob/master/app/scripts/controllers/main.js#L24
   https://github.com/hubba/s3-angular-file-upload/blob/master/lib/controllers/aws.js#L20

adding bucket to aws.js won't matter, since code doesn't use it.

Let me know if the above helps otherwise we can debug more, next step would be to have a look at the exact 'POST' you are making. If the doesn't fix the problem, then paste your 'POST' here and/or you can email me the code changes you made and I can debug it to figure out what is wrong.

I have added an issue to allow better integration of bucket name.
#2

[MattCowski]

Hm. No, neither of those seem to be it.
Doing a google search brings up this: http://stackoverflow.com/questions/6943138/changing-the-sequence
I'm a noob but do you understand if this could be relevant?

I git add . and git commit the code with my changes but how to I push it on here so u can look?

[nukulb]

Use the fork and pull model

https://help.github.com/articles/using-pull-requests

Fork my repo
Change the remote in the git repo you have to your fork
Then push to your fork
Then do a pull request to my repo

On Tuesday, March 25, 2014, Matt Cowski notifications@github.com wrote:

Hm. No, neither of those seem to be it.
Doing a google search brings up this:
http://stackoverflow.com/questions/6943138/changing-the-sequence
I'm a noob but do you understand if this could be relevant?

I git add . and git commit the code with my changes but how to I push it
on here so u can look?

Reply to this email directly or view it on GitHubhttps://github.com//issues/1#issuecomment-38645668
.

Nukul Bhasin

[MattCowski]

ah, beat ya to it :P MattCowski/s3-angular-file-upload@29b6be1

[nukulb]

I will have a look first thing tomorrow

Sent from my iPhone

On Mar 25, 2014, at 11:12 PM, Matt Cowski notifications@github.com wrote:

ah, beat ya to it :P MattCowski/s3-angular-file-upload@29b6be1

—
Reply to this email directly or view it on GitHub.

[MattCowski]

Yea, i mean I barely changed anything. it's litterally just renaming the bucket to mybucket-dev123 so I think it's gotta be the stackoverflow issue above or something else. Thanks

[nukulb]

Instead of using -
url: 'https://mybucket-dev123.s3-us-west-2.amazonaws.com/'
have you tried
url: 'https://mybucket-dev123.s3.amazonaws.com/'

[MattCowski]

yes

On Wed, Mar 26, 2014 at 4:58 AM, Nukul Bhasin notifications@github.comwrote:

Instead of using -
url: 'https://mybucket-dev123.s3-us-west-2.amazonaws.com/'
have you tried
url: 'https://mybucket-dev123.amazonaws.com/'

Reply to this email directly or view it on GitHubhttps://github.com//issues/1#issuecomment-38665978
.

[nukulb]

I actually tried out your bucket and just uploaded a couple of pictures there.
So it does work.

[MattCowski]

well actually, it was mybucket-dev123.s3.amazonaws.com ... is that
different?

On Wed, Mar 26, 2014 at 5:05 AM, Matt Cowski matt.cowski@gmail.com wrote:

yes

On Wed, Mar 26, 2014 at 4:58 AM, Nukul Bhasin notifications@github.comwrote:

Instead of using -
url: 'https://mybucket-dev123.s3-us-west-2.amazonaws.com/'
have you tried
url: 'https://mybucket-dev123.amazonaws.com/'

Reply to this email directly or view it on GitHubhttps://github.com//issues/1#issuecomment-38665978
.

[nukulb]

no, that was a typo by me. I fixed it.

[nukulb]

checkout your bucket here -
https://mybucket-dev123.s3-us-west-2.amazonaws.com/

you will notice a couple of pictures uploaded to your bucket.

[MattCowski]

WOW haha, you can access my bucket? how? without my keys / private key?

[nukulb]

When configuring the bucket we gave everyone permission if you followed the README
You can close it as much as you want with granular control.

[MattCowski]

Ah, makes sense. So what else can it be?
http://stackoverflow.com/questions/6943138/changing-the-sequence ?

[nukulb]

what browser are you using?

On Wed, Mar 26, 2014 at 6:12 AM, Matt Cowski notifications@github.comwrote:

Ah, makes sense. So what else can it be?
http://stackoverflow.com/questions/6943138/changing-the-sequence ?

Reply to this email directly or view it on GitHubhttps://github.com//issues/1#issuecomment-38667052
.

Nukul Bhasin

[MattCowski]

latest chrome Version 33.0.1750.152

[nukulb]

Can you go to your 'chrome dev tools' and grab the exact POST you are
sending?
I can then compare it with the post I am sending.

On Wed, Mar 26, 2014 at 6:42 AM, Matt Cowski notifications@github.comwrote:

latest chrome Version 33.0.1750.152

Reply to this email directly or view it on GitHubhttps://github.com//issues/1#issuecomment-38669362
.

Nukul Bhasin

[MattCowski]

dont really know if this is the right place

<?xml version="1.0" encoding="UTF-8"?>
<Error><Code>InvalidArgument</Code><Message>Bucket POST must contain a field named 'key'.  If it is specified, please check the order of the fields.</Message><ArgumentValue></ArgumentValue><ArgumentName>key</ArgumentName><RequestId>7843EECF98242815</RequestId><HostId>f5T75hHeNlLSV7tIgPOGg21vZ0MENC2BYHjmMHL64sxek/pKuqWksIjUn1SlyJp4</HostId></Error>

[nukulb]

In chrome
From menu at the top right
Tools --> Developer Tools
Open the network tab
Hit Clear (second icon from left under the network tab )
Now Try to upload again
It should create an item in the network list
Click on the item
On the Right, you will see Headers, preview, response etc..
Copy the entire HEADERS and send them

On Wed, Mar 26, 2014 at 6:51 AM, Matt Cowski notifications@github.comwrote:

dont really know if this is the right place

InvalidArgumentBucket POST must contain a field named 'key'. If it is specified, please check the order of the fields.key7843EECF98242815f5T75hHeNlLSV7tIgPOGg21vZ0MENC2BYHjmMHL64sxek/pKuqWksIjUn1SlyJp4

Reply to this email directly or view it on GitHubhttps://github.com//issues/1#issuecomment-38670089
.

Nukul Bhasin

[MattCowski]

Request URL:https://mybucket-dev123.s3.amazonaws.com/
Request Method:POST
Status Code:400 Bad Request
Request Headersview source
Accept:application/json, text/plain, */*
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8
Connection:keep-alive
Content-Length:209307
Content-Type:multipart/form-data; boundary=----WebKitFormBoundary9yGAvih3oJxKCk9F
Host:mybucket-dev123.s3.amazonaws.com
Origin:http://localhost:9000
Referer:http://localhost:9000/
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/33.0.1750.152 Safari/537.36
Request Payload
------WebKitFormBoundary9yGAvih3oJxKCk9F
Content-Disposition: form-data; name="file"; filename="blind_man.jpg"
Content-Type: image/jpeg


------WebKitFormBoundary9yGAvih3oJxKCk9F
Content-Disposition: form-data; name="key"

s3UploadExample/2910$$blind_man.jpg
------WebKitFormBoundary9yGAvih3oJxKCk9F
Content-Disposition: form-data; name="acl"

public-read
------WebKitFormBoundary9yGAvih3oJxKCk9F
Content-Disposition: form-data; name="Content-Type"

image/jpeg
------WebKitFormBoundary9yGAvih3oJxKCk9F
Content-Disposition: form-data; name="AWSAccessKeyId"

AKIAI5QKSZ77BH7QX5VA
------WebKitFormBoundary9yGAvih3oJxKCk9F
Content-Disposition: form-data; name="success_action_status"

201
------WebKitFormBoundary9yGAvih3oJxKCk9F
Content-Disposition: form-data; name="Policy"

eyJleHBpcmF0aW9uIjoiMjAxNC0zLTI3VDk6MDA6MDAuMDAwWiIsImNvbmRpdGlvbnMiOltbInN0YXJ0cy13aXRoIiwiJGtleSIsInMzVXBsb2FkRXhhbXBsZS8iXSx7ImJ1Y2tldCI6Im15YnVja2V0LWRldjEyMyJ9LHsiYWNsIjoicHVibGljLXJlYWQifSxbInN0YXJ0cy13aXRoIiwiJENvbnRlbnQtVHlwZSIsImltYWdlL2pwZWciXSx7InN1Y2Nlc3NfYWN0aW9uX3N0YXR1cyI6IjIwMSJ9XX0=
------WebKitFormBoundary9yGAvih3oJxKCk9F
Content-Disposition: form-data; name="Signature"

VACgwau/xrJQ1qeUD7JZgg8bIf0=
------WebKitFormBoundary9yGAvih3oJxKCk9F--

[MattCowski]

so under Network, I see mybucket-dev123.s3.amazonaws.com and when I click on it, under the 'Headers' is above ^^. Then under 'preview' tab: InvalidArgumentBucket POST must contain a field named 'key'. If it is specified, please check the order of the fields.keyEA01470D8F9236B3ytKCFkvTmOBklVTy8JC/hnelMOuPaXy12aGjIEQnj8Lke7LRkSOzf3HBcXgbv2zV

[MattCowski]

Oh, I think you meant this:
This XML file does not appear to have any style information associated with it. The document tree is shown below. <ListBucketResult xmlns="http://s3.amazonaws.com/doc/2006-03-01/"> <Name>mybucket-dev123</Name> <Prefix/> <Marker/> <MaxKeys>1000</MaxKeys> <IsTruncated>false</IsTruncated> <Contents> <Key>s3UploadExample/5164$dell-venue.0.jpg</Key> <LastModified>2014-03-26T10:04:39.000Z</LastModified> <ETag>"5a37be3e5f3cee02cb3763717e3723a7"</ETag> <Size>27056</Size> <StorageClass>STANDARD</StorageClass> </Contents> <Contents> <Key>s3UploadExample/5892$dell-streak-7.1.jpg</Key> <LastModified>2014-03-26T11:05:40.000Z</LastModified> <ETag>"56fede0ec1f4070237e60181c618857a"</ETag> <Size>26865</Size> <StorageClass>STANDARD</StorageClass> </Contents> <Contents> <Key>s3UploadExample/7405$dell-streak-7.3.jpg</Key> <LastModified>2014-03-26T10:03:24.000Z</LastModified> <ETag>"b7a41214ca6daa72ef4c6645b31579b3"</ETag> <Size>32331</Size> <StorageClass>STANDARD</StorageClass> </Contents> </ListBucketResult>

[nukulb]

There is one evident difference between your request and mine and that order in which the file appears in the request payload. Yours is at the top whereas for me its at the bottom. I suspect that is why we are seeing the error.

Yours

Request Payload
------WebKitFormBoundary9yGAvih3oJxKCk9F
Content-Disposition: form-data; name="file"; filename="blind_man.jpg"
Content-Type: image/jpeg


------WebKitFormBoundary9yGAvih3oJxKCk9F
Content-Disposition: form-data; name="key"

s3UploadExample/2910$$blind_man.jpg

Mine

------WebKitFormBoundarym0hy0HROBRp8Iml9
Content-Disposition: form-data; name="Policy"

XXXXX
Content-Disposition: form-data; name="Signature"

xxxxxx
------WebKitFormBoundarym0hy0HROBRp8Iml9
Content-Disposition: form-data; name="file"; filename="dell-streak-7.1.jpg"
Content-Type: image/jpeg

[nukulb]

@danialfarid thoughts?
How is order of form-data determined during an upload? And what could affect it.

The problem here seems to be that for some unknown reason when @MattCowski uploads to s3 the form-data; name="file" ends up at the bottom of the request for me whereas for @MattCowski its at the top of his request before form-data; name="key"

[danialfarid]

What version of angular-file-upload are you guys using? It might be because of changes to new version 1.2.10

[nukulb]

I am using ~1.2.9
but I tried ~1.2.10 as well and it worked fine for me.

What exactly could affect the order of form-data?

I try an older version if you know one that would help debug.

[danialfarid]

I released 1.2.11 which would add the data to the form-data first and then the file.
With the recent changes in 1.2.10 if you don't have formDataAppender it would add the data after the file to the form-data.

@MattCowski could you confirm your version of angular-file-upload and try out the new version 1.2.11.

[nukulb]

I upgraded the version in this repo as well.

[MattCowski]

The very latest v1.3.2
On Mar 26, 2014 11:20 AM, "Nukul Bhasin" notifications@github.com wrote:

I upgraded the version in this repo as well.

Reply to this email directly or view it on GitHubhttps://github.com//issues/1#issuecomment-38704932
.

[MattCowski]

Sorry. Above is my version of fullstack.
On Mar 26, 2014 1:10 PM, "Matt Cowski" matt.cowski@gmail.com wrote:

The very latest v1.3.2
On Mar 26, 2014 11:20 AM, "Nukul Bhasin" notifications@github.com wrote:

I upgraded the version in this repo as well.

Reply to this email directly or view it on GitHubhttps://github.com//issues/1#issuecomment-38704932
.

[MattCowski]

Yea, I was on ~1.2.9. I upgraded but now I'm seeing "AccessDeniedAccess Denied"...

[MattCowski]

Fixed! I changed my user policy and now it works! Thanks guys