Hi!

I'm getting this error:

<?xml version="1.0" encoding="UTF-8"?>\n<Error><Code>AccessDenied</Code>
<Message>Invalid according to Policy: Policy expired.</Message>
<RequestId></RequestId>
<HostId>w//</HostId></Error><?xml version="1.0" encoding="UTF-8"?>\n
<Error><Code>AccessDenied</Code>
<Message>Invalid according to Policy: Policy expired.</Message>
<RequestId></RequestId>
<HostId>
</HostId></Error>

I tried to add more timeDelta, but I can't fix this issue. Anyone with same problem??

Thanks

is it posible to upload with a pre-signed url ?
If not, it would be awesome you could implement that feature.

http://docs.aws.amazon.com/AmazonS3/latest/dev/UsingHTTPPOST.html

Is it possible to download using this package?

I am not currently working in react native regularly, so this project is not a priority for me. However, there is a fair amount of interest around this project so I'd be happy to consider handing the project over to someone who is capable and interested in maintaining it.

cannot load assets-library: file

If not, any tips for a pull request to do so?

I'm following the example from the readme exactly, but running into this fatal error during upload:

Searching around, it looks like maybe Apple thinks there could be something wrong with AWS' cert: https://stackoverflow.com/questions/32755674/ios9-getting-error-an-ssl-error-has-occurred-and-a-secure-connection-to-the-ser

Will keep investigating...

Hi Ben, Thanks for the library! I inherited a project that records and posts audio files to s3 and has a react web app and a react-native webview bridge app. The web app successfully uploads to s3 on desktop. The native app records a file, receives the credentials from the web app but always fails with on put with access denied. No error is generated in the console. Would you have any suggestions where I could look for a problem? Thanks ~john

Only change needed is to update the readme and an instructions that uri is not required, one can just pass the file from the input element as the file instead and get the same experience as in React Native.

Wonderful solution! 👍

Currently, I don't need to put my credentials onto any phone because I use presigning from a network request that gives temporary permission to the person uploading with a namespaced bucket. That is a smarter approach in the long run.

Thanks for the code, will just modify it to use signing then do a PR if you want it, take it.

Not sure if I am doing something wrong here, but I have a recorded video, I can preview it perfectly, and then when I use the uploader it uploads fine, but the video that got uploaded to S3 doesn't playback properly. It is 0 seconds and only shows the first frame of the video. I am testing this on iOS first before testing on Android. Any ideas about this? I am using "video/quicktime" as the type and an assets-library uri that I use to preview the video and that is working.

Hey benjreinhart,
I was wondering if there is any way you could possible upload multiple photos at once.

This is undocumented.
https://github.com/benjreinhart/react-native-aws3/blob/master/src/S3Policy.js#L23

What is this suppose to be ?

Was wondering if anyone else had encountered this issue and perhaps had some feedback on how it got resolved. Full disclosure, I'm pretty new to programming so this very well could be a trivial error on my part. Additionally, it may not have anything to do with the library in which case I apologize. Running on the newest version(0.0.4). I logged the results and everything seems to be in order but when I go to the bucket, the file is 0 bytes and nothing is visible. Below is all what I believe to be pertinent code from my project. Any help would be much appreciated!

// Camera Component

@connectActionSheet
class PicturePicker extends React.Component {
  state = {
    image: null,
  }

  render() {
    let { image } = this.state;

    return (
      <View>
      <TouchableNativeFeedbackSafe
        style={styles.profilePictureContainer}
        delayPressIn={150}
        onPress={this._editProfilePicture}>
          <FadeIn placeholderStyle={{backgroundColor: Platform.OS === 'android' ? 'transparent' : 'transparent' }}>
            <View style={styles.profilePicture}>
            { image && <Image
                source={{uri: image }}
                style={styles.profilePicture}
              /> }
            </View>
          </FadeIn>
      </TouchableNativeFeedbackSafe>
      </View>
    )
  };

   _editProfilePicture = () => {
    this.props.showActionSheetWithOptions({
        options: [ 'Upload Image', 'Take Picture', 'Cancel'],
        cancelButtonIndex: 2,
      },
      (buttonIndex) => {
        if (buttonIndex === 1) {
          this._openCamera();
        } else if (buttonIndex === 0) {
          this._openGallery();
        }
      },
    )};

    _openGallery = async () => {
      let result = await Exponent.ImagePicker.launchImageLibraryAsync({
        allowsEditing: true,
      });

      if (!result.cancelled) {
        const image = result.uri;
        this.setState({image: result.uri});
        this.props.imageChanged(image);
        console.log(this.props.imageChanged(image));
      }
    };

    _openCamera = async () => {
      let result = await Exponent.ImagePicker.launchCameraAsync({
        allowsEditing: true,
      });

      if (!result.cancelled) {
        const image = result.uri;
        this.setState({image: result.uri});
        this.props.imageChanged(image);
      }
    };
}

// Redux Actions 
export const imageChanged = (image) => {
  console.log(image)
  return {
    type: IMAGE_CHANGED,
    payload: image,
  };
};

export const imageUploaded = (image) => {
  return (dispatch) => {

  const timeStamp = new Date().getTime();

  const file = {
    uri: image,
    name: `profilePicture${timeStamp}.jpg`,
    type: 'image/jpg'
  };

  const options = {
    keyPrefix: "profilePictures/",
    bucket: "BUCKET-NAME",
    region: "us-east-1",
    accessKey: "ACCESSKEY",
    secretKey: "SECRETKEY",
    successActionStatus: 201,
  };

  RNS3.put(file, options).then(response => {
    if (response.status !== 201) {
      throw new Error('Failed to upload image to S3', response);
    }
    console.log(response.body)
    const picture = response.body.postResponse.location;
    firebaseImage(picture, dispatch);
  });
 };
};

// Redux Reducers

import {
  USERNAME_CHANGED,
  USERNAME_REGISTERED,
  DISPLAY1_CHANGED,
  DISPLAY2_CHANGED,
  DISPLAY_REGISTERED,
  IMAGE_CHANGED,
  IMAGE_UPLOADED,
} from '../actions/actionTypes';

const INITIAL_STATE = {
  username: '',
  display1: '',
  display2: '',
  image: '',
  error: '',
  loading: false,
};

export default (state = INITIAL_STATE, action) => {
  switch (action.type) {
    case USERNAME_CHANGED:
      return { ...state, username: action.payload };
    case USERNAME_REGISTERED:
      return { ...state, loading: true, error: ''};
    case DISPLAY1_CHANGED:
      return { ...state, display1: action.payload };
    case DISPLAY2_CHANGED:
      return { ...state, display2: action.payload };
    case DISPLAY_REGISTERED:
      return { ...state, loading: true, error: ''};
    case IMAGE_CHANGED:
      return { ...state, image: action.payload };
    case IMAGE_UPLOADED:
      return { ...state, loading: true, error: ''};
    default:
      return state;
    }
};

// Console Log Results


file:///var/mobile/Containers/Data/Application/E05302D4-E48B-48CD-8770-D8F7BA2E9907/tmp/25471B1E-407B-4FF4-AA1C-04FDD4107623.jpg

{"type":"image_changed","payload":"file:///var/mobile/Containers/Data/Application/E05302D4-E48B-48CD-8770-D8F7BA2E9907/tmp/25471B1E-407B-4FF4-AA1C-04FDD4107623.jpg"}

{"postResponse":{"key":"profilePictures/profilePicture1488246044447.jpg","etag":"d41d8cd98f00b204e9800998ecf8427e","bucket":"BUCKETNAME","location":"https://BUCKETNAME.s3.amazonaws.com/profilePictures%2FprofilePicture1488246044447.jpg"}}

On Android, the progress method never gets called.

RNS3.put(file, options)
  .then(/* ... */)
  .catch(/* ... */)
  .progress(/* never called */);

Currently in the Request class you have the option for a catch, the problem is that the RNS3 class creates and then immediately calls send on the XMLHTTPRequest, which if there is an issue will fail before the return, this prevents the catch method a user might add from being called.

Checked that this libs s3 endpoint is

s3.amazonaws.com

Following this document,

http://docs.aws.amazon.com/general/latest/gr/rande.html#s3_region

needs to be set differently depending on the region.

Hey,

Very good library, thanks !
I also need fast get and deleteObject very fast :)
I added get function:

`static get(fileUrl, options, type) {
options = Object.assign({}, options, {
key: (options.keyPrefix || ''),
contentType: type
});

  let url = `http://${ options.bucket }.s3.amazonaws.com/${ fileUrl }`;
  let method = "GET";
  let policy = S3Policy.generate(options);

  return Request.create(url, method, policy)
    .send()
    .then(setBodyAsParsedXML);

}`
But it doesnt work.
Any suggestions ?
Thanks.

Would you have any suggestions for a react web aws3 uploader library? Want to use something with a similar API to this but for the web. As an application i'm working on will be a webapp and react native app (Android & iOS)

SSL handshake aborted: ssl=0x945b9ec0: I/O error during system call, Connection reset by peer

What is this?

I'm having this error (which seems to indicate that there's a network issue)

{
  status: 0, 
  text: "Write error: ssl=0xd1e3e880: I/O error during system call, Connection reset by peer",
  headers: {}
}

Nevertheless, my device is connected to fast internet. Any idea?

Is it on the roadmap to add automatic retry for failed uploads?

Hi,

I need to add the session token because I have temporary credentials. How to do it ? Looking at the code, it seems impossible.

Thank you

this is my code after it executes i get ssl error

 UploadImage(f){
   console.log(f,options)
  RNS3.put(f, options).then(response => {
    if (response.status !== 201)
      throw new Error("Failed to upload image to S3");
    console.log(response.body);
  }).catch((error)=>{
    console.log(error);
 });
 }

text:"An SSL error has occurred and a secure connection to the server cannot be made."

Hi,

Is there a way to change the resolution of the image when it's uploaded? I'm uploading images that are reasonably high quality but are being compressed into a really low resolution on upload.

Any suggestions?

aws/aws-sdk-js#1632

http://docs.aws.amazon.com/AWSJavaScriptSDK/latest/AWS/Config.html#correctClockSkew-property

Hey there,

Im getting a networking error when trying to upload to S3 from my react-native app running on my device.

Error

NSURLSession/NSURLConnection HTTP load failed (kCFStreamErrorDomainSSL, -9843)

From Googling around there are suggestions to add the AWS domains to the NSExceptionDomains in the info.plist. Ive tried the following xml in the plist but am still experiencing the same issue.

<key>NSAppTransportSecurity</key>
<dict>
  <key>NSAllowsArbitraryLoads</key>
  <true/>
  <key>NSExceptionDomains</key>
  <dict>
    <key>amazonaws.com</key>
    <dict>
      <key>NSThirdPartyExceptionMinimumTLSVersion</key>
      <string>TLSv1.0</string>
      <key>NSThirdPartyExceptionRequiresForwardSecrecy</key>
      <false/>
      <key>NSTemporaryExceptionRequiresForwardSecrecy</key>
      <false/>
      <key>NSTemporaryExceptionMinimumTLSVersion</key>
      <string>1.0</string>
      <key>NSIncludesSubdomains</key>
      <true/>
      <key>NSTemporaryExceptionAllowsInsecureHTTPLoads</key>
      <true/>
    </dict>
    <key>amazonaws.com.cn</key>
    <dict>
      <key>NSThirdPartyExceptionMinimumTLSVersion</key>
      <string>TLSv1.0</string>
      <key>NSThirdPartyExceptionRequiresForwardSecrecy</key>
      <false/>
      <key>NSTemporaryExceptionRequiresForwardSecrecy</key>
      <false/>
      <key>NSTemporaryExceptionMinimumTLSVersion</key>
      <string>1.0</string>
      <key>NSIncludesSubdomains</key>
      <true/>
    </dict>
  </dict>
</dict>

What NSAppTransportSecurity do you use for uploading to S3?

Hi, I'm getting the following error when trying to upload an image:

and this is my code:

I have uploaded twice before and it work well. suddenly
When I upload a file, it throws an error when it is at 100% uploaded:

{"line":14492, "column":65, "sourceURL":"http://localhost:8081/"}

Please any help

First, fantastic work and very clean source! Thanks for your work!
As far as I know, it's not a good idea to put your api key in the client side source.
It's better to have your server sign a policy and send it to the client for each upload.
So I think it would be nice to factor out S3Policy module into a separate repo so that server can use it.
What are your thoughts?

Not able to create Dynamic sub keyPrefix while uploading Images???

Right now by default the AWS-ACL is set to "public-read".
But for my use case I want it to be configurable.
So i think we can pick this value from options and make it default to "public-read".
Please let me know if we can do this.
If you want I can raise pull request for this

Hello there,

First of all, thank you and good job.

I want to access my android gallery and choose a picture for my avatar, upload it from my phone to my bucket. At first, I used the AWSSDK.Core and AWSSDK.S3 for .NET and succeeded, only not being able to identify the real file path since .NET is my server (probably would have to get the byte64 data of the picture and then stream it before sending to the bucket).

With this solution I was able to upload some pictures and then suddenly it stopped with the 403 Error, that I assume Amazon blocked because here I am missing the , which I think it's the only difference between this package and the AWSSDK for NET.

Any thoughts?

Hello and thanks for the awesome library! Im currently trying out the library and noticed some peculiar things. It appears that the library doesnt really allow upload in the background. Maybe Im incorrect on this?

On IOS, the upload stops as soon as you actually turn off the phone (notice turn off and NOT killing the phone). If you just close down the app and derp around in your phone, the upload does not stop.

On Android, the upload acually continues when you turn off the phone and also when you close down the app.

Does any of this ring any bell or is it intended?

hai , i am happy when i saw this module, when i follow there procedure as you mentioned in repo, i am getting an error like RNS3.put is not a function, RNS3.put is undefined

In debug mode RN use V8, and don't know why throw 412 (Precondition Failed)

<?xml version="1.0" encoding="UTF-8"?>
<Error>
<Code>PreconditionFailed</Code>
<Message>At least one of the pre-conditions you specified did not hold</Message>
<Condition>Bucket POST must be of the enclosure-type multipart/form-data</Condition>
<RequestId>03124D2C211F0A65</RequestId>
<HostId>...</HostId>
</Error>

I want to know what library is incompatible with JavascriptCore

Is it possible to upload audio caf files? I've been trying to do that but the uploaded file ends up being 0 bytes..that's the code:

    let file = {
      uri: this.recording.uri,
      name: "sound-test.caf",
      type: "audio/caf",
    }
    let options = {
      keyPrefix: "uploads/" + "admin" + "/tests/",
      bucket: "xxxx-xxxx",
      region: "us-west-1",
      accessKey: "XXXXXX",
      secretKey: "XXXXXX",
      successActionStatus: 201,
    }

    RNS3.put(file, options).then(response => {
      console.log(response.status);
      if (response.status !== 201) {
        throw new Error("failed to upload audio to s3");
      }
      console.log(response.body);
      console.log(response.body.postResponse.location);
    });

"Hostname cn.wfl-ischool.app.oralv1.s3.cn-north-1.amazonaws.com.cn not verified:
certificate: sha256/7ZXQS/UDzRMV2KyFbtuVg0QKioBlbEeVNh2VJoGwHzI=
DN: CN=.s3.cn-north-1.amazonaws.com.cn,O=Amazon Connect Technology Services (Beijing) Co., Ltd.,L=Huairou District,ST=Beijing,C=CN
subjectAltNames: [.s3.cn-north-1.amazonaws.com.cn, s3.cn-north-1.amazonaws.com.cn]"

And this is my code

export const Aws3UploadApi = (file) => {
    return new Promise((resolve, reject) => {
        RNS3.put(file, AwsOptions).then(response => {
            console.log('raw response', response)
            if (response.status !== 201)
                {return reject()}
            else {
                return resolve(response)
            }    
    
        }).catch((err) => {console.log('has err', err)})
    })
   
}

         let date = new Date()
        let file_name = `${date.getTime()}.jpeg`
        let file = {
            uri: filePath,
            name: file_name,
            type: 'image/jpeg'
        }
        Aws3UploadApi(file).then((response) => {
            console.log('resp', response)
        }).catch((err) => {console.log('has error', err)})

If you upload a video from an image-URL that you get from the CameraRoll, React will mix up the streams and the S3 file will be the first frame of the video (as an image), instead of the complete video.

I have run stat (react-native-fetch-blob) and can see that URL is correct and the file size is correct. (that is why I think React messes up the streams when you do the request to S3).

I will try to run another implementation of fetch to see if that works.

Should we assume that attackers can get access to the secret keys in our code?

const RNS3 = require('react-native-aws3');
I type this in my server.js and get the following error.
Could you please tell me what happens?

Finally, I use this package in my client part and everything goes well.

Thank you for this library btw. It's been incredibly helpful.

Anyways, I'm having trouble uploading images to S3 when I am simulating on Android. On iOS, I have no troubles at all.

Note: I am using React-Native-Camera
I am currently using:

{
"react-native": "0.43.0",
"react-native-camera": "git+https://github.com/lwansbrough/react-native-camera.git",
"react-native-aws3": "0.0.8",
}

Here's my code:

    this.camera.capture()
      .then((data) => {
        this.setState({ path: data.path })
        const file = {
          uri: data.path,
          name: `${uuid.v1()}.jpg`,
          type: 'image/jpeg',
        };

        const options = {
          keyPrefix: 'photos/',
          bucket: 'accountabilibuddy-1',
          region: 'us-west-1',
          accessKey: AWSAccessKeyId,
          secretKey: AWSSecretKey,
          successActionStatus: 201
        };

        RNS3.put(file, options).then(response => {
          if (response.status !== 201) {
            throw new Error('Failed to upload image to S3', response);
          }
          this.props.pictureTaken(response.body.postResponse.location) // reduxAction here(don't mind)
        }).catch(err => console.error('Camera error not uploaded: ', err))
      })
      .catch(err => console.error(err));
  }

For the inner catch, I am getting the following error:

For the outer catch, I am getting the following error:

Has this library worked for others on Android?

can i upload audio file using this library?

Not an issue per se, I am using this for uploading to s3 from a react-native project and it works like a charm.

Was developing a react project and used some other libs for uploading to s3 which were not working properly so I tried this and voila it works perfectly on react projects as well.

Maybe change the name of the lib so that people know it is not only for react-native?

I'm getting the following error when trying to upload an image:

<Error>
<Code>PreconditionFailed</Code>
<Message>At least one of the pre-conditions you specified did not hold</Message>
<Condition>Bucket POST must be of the enclosure-type multipart/form-data</Condition>
<RequestId>A05CC8899FE783C8</RequestId>
<HostId>RNTOTXJEJtXOa3FMgyEtcKcqV3+YGedEQxUImG1PQijkPeDUeb8PgIz9D1abVmZ3fCvoIS/u8ZQ=</HostId>
</Error>

This is the file:

{uri: "file:///Users/maxmitschke/Library/Developer/CoreSi…p-picker/0411EB1E-D944-4BAD-8BCB-6916CF3D71CC.jpg", type: "image/jpeg", name: "51f76932-ad1d-4ed7-9f19-b11227a6a031.jpg"}

If tried without file:// to, but got the same result.

This is the request that was sent:

Accept:*/*
Accept-Encoding:gzip, deflate
Accept-Language:de
Connection:keep-alive
Content-Length:15
Content-Type:text/plain;charset=UTF-8
Host:my-bucket.s3.amazonaws.com
Origin:null
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_3) AppleWebKit/537.36 (KHTML, like Gecko) ReactNativeDebugger/0.5.5 Chrome/53.0.2785.143 Electron/1.4.10 Safari/537.36

Hi i would like to be able to upload images that is in base64 format.
There is a bug in another library I'm using so i cannot get the image, but I can get the base64 representation of the image. So i would like to upload that to S3 and have it become a actual image.
Any ideas on how to do this ?

My app is crashing immediately upon uploading a file to S3 with this package. The strange thing is that the request goes through fine, and the file uploads, but the UI on the app crashes with the attached screenshot.

In digging around for this error, it looks like it usually occurs when the URL supplied to the underlying networking request is null.

Has anyone else here come across this error while using this package?

I have an ARN and accessKey. I do not have a secret key. I have been give access by the owner of the account as an IAM user.

If I remove the secret key from options, I get an error saying 'The secretKey must be specified'.

How would I upload a file with the above constraints?