Skip to content
This repository has been archived by the owner on Oct 12, 2018. It is now read-only.

detail step-by-step guide #35

Open
chunghe opened this issue Jan 12, 2017 · 21 comments
Open

detail step-by-step guide #35

chunghe opened this issue Jan 12, 2017 · 21 comments

Comments

@chunghe
Copy link

chunghe commented Jan 12, 2017

The official document of aws-sdk-react-native is too sparse and not easy to follow. I've been trying to set up the aws-sdk-react-native for two days. Finally it works! Here's the step-by-step guide for your reference.

I'm a web developer just step into native app development world. If there's anything wrong with following steps, please let me know. Thanks!

The guide should be able to fix #33, #24, #18, and #20.

build aws-sdk-react-native

you could skip this step and go ahead download form here.

  1. download AWS Mobile SDK for iOS here
  2. git clone https://github.com/awslabs/aws-sdk-react-native.git
  3. copy AWSCore.framework file to aws-sdk-react-native/Core/ios/Frameworks
  4. to fix Syntax error in AWSCognitoCredentials #20, edit aws-sdk-react-native/Core/src/AWSCognitoCredentials.js, change line 48 from
    listener.addListener("LoginsRequestedEvent", async {callbackId} => {
    to
    listener.addListener("LoginsRequestedEvent", async ({callbackId}) => {
  5. cd aws-sdk-react-native/Core
  6. npm pack

install aws-sdk-react-native

  1. yarn add ../../path/to/aws-sdk-react-native-core-0.0.2.tgz
  2. react-native link aws-sdk-react-native-core

Then follow step2/step3/step4 of the official aws ios sdk guide.

  1. With your project open in Xcode, select your Target. Under General tab, find Embedded Binaries and then click the + button.

  2. Click the Add Other... button, navigate to the project_folder/node_modules/aws-sdk-react-native-core/ios/Frameworks/AWSCore.framework and select them. ( DO NOT check the Destination: Copy items if needed checkbox when prompted. it's already in the node_modules)

2017-01-12 10 08 15

  1. Under the Build Phases tab in your Target, click the + button on the top left and then select New Run Script Phase. Then setup the build phase as follows. Make sure this phase is below the Embed Frameworks phase.

     Shell /bin/sh
     
     bash "${BUILT_PRODUCTS_DIR}/${FRAMEWORKS_FOLDER_PATH}/AWSCore.framework/strip-frameworks.sh"
     
     Show environment variables in build log: Checked
     Run script only when installing: Not checked
     
     Input Files: Empty
     Output Files: Empty
    
  2. Click on your main project file, select Build Settings, click 'Framework Search Paths', add $(SRCROOT)/../node_modules/aws-sdk-react-native-core/ios/Frameworks.

2017-01-12 13 15 35

  1. Build and run, that's it.
@chunghe chunghe changed the title correct step-by-step guide detail step-by-step guide Jan 12, 2017
@alexmngn
Copy link

alexmngn commented Jan 12, 2017

@chunghe Awesome I was able to build for iOS!

Now I have some issue about how to use Cognito. I am trying to use the regular Cognito Provider to login a user. I use the method initWithOptions first with the region and pool id:

import { AWSCognitoCredentials } from 'aws-sdk-react-native-core';

AWSCognitoCredentials.initWithOptions({
      region: 'us-east-1',
      identity_pool_id: 'yyy',
});

This code above throw an error (for some reason the double quotes are weird but that's the way I get it):

Exception 'Invalid region type.' was thrown while invoking initWithOptions on target AWSRNCognitoCredentials with params (
{
"identity_pool_id" = us-east-1;
region = "yyy";
}
)

I cannot find any documentation about how to use the Cognito Provider unfortunately.

@chunghe
Copy link
Author

chunghe commented Jan 12, 2017

@alexmngn

identity_pool_id and region should look like this:

let identity_pool_id = 'ap-northeast-1:b5d7410a-113e-4dcd-ace5-fc5be54771f9'
let region = 'ap-northeast-1';

there will be an error message if identity_pool_id format not correct

identityPoolId' failed to satisfy constraint: Member must satisfy regular expression pattern: [\w-]+:[0-9a-f-]+}

@proProbe
Copy link

@chunghe Great job with the tutorial!
Quick question, I havent been able to see anything about the library being able to upload while being in the background. Do you know if this works? Should of course work with both iOS and Android

@khelil
Copy link

khelil commented Jan 14, 2017

@chunghe Bravo and thanks for sharing ;)

@philberg
Copy link

philberg commented Jan 21, 2017

For anyone who comes here and wonders how to make it work on android, I finally got the example working on android, using react-native 0.40.

I followed the instructions from @chunghe and had to add one step to get the TransferUtility to work. The step by step is copied here to avoid confusion.

Core

Build aws-sdk-react-native-core

  1. git clone https://github.com/awslabs/aws-sdk-react-native.git
  2. To fix Syntax error in AWSCognitoCredentials #20, edit aws-sdk-react-native/Core/src/AWSCognitoCredentials.js, change line 48 from
    listener.addListener("LoginsRequestedEvent", async {callbackId} => {
    to
    listener.addListener("LoginsRequestedEvent", async ({callbackId}) => {
  3. cd aws-sdk-react-native/Core
  4. npm pack

Install aws-sdk-react-native-core

  1. Install yarn if you don't already have it
  2. yarn add ../../path/to/aws-sdk-react-native-core-0.0.2.tgz
  3. react-native link aws-sdk-react-native-core

At this point, you should be able to use the core utility on android just fine.

TransferUtility

Build aws-sdk-react-native-transfer-utility

  1. Assuming you have already cloned aws-sdk-react-native
  2. cd aws-sdk-react-native/TransferUtility
  3. npm pack

Install aws-sdk-react-native-transfer-utility

  1. Assuming you still have yarn installed
  2. yarn add ../../path/to/aws-sdk-react-native-transfer-utility-0.0.1.tgz
  3. react-native link aws-sdk-react-native-transfer-utility
  4. Add the required service to the main/AndroidManifest.xml file (this does not happen automatically. Thanks @fabriciovergal)
    Remember, this goes inside of the application like so:
    <application
        ...

        <service
            android:name="com.amazonaws.mobileconnectors.s3.transferutility.TransferService"
            android:enabled="true" />

       ...
    </application>

Now you should be able to run the example on android!

@ghost
Copy link

ghost commented Jan 25, 2017

@philberg - I couldn't get it to work past yarn add aws-sdk-react-native-core-0.0.2.tgz for android

It fails at react-native link aws-sdk-react-native-core. I am using react-native-cli@2.0.1

@philberg
Copy link

@nkhinchi what error message are you seeing?

@xavicolomer
Copy link

initWithOptions(options) is failing because cognitoClient is undefined. Is anyone else having this problem?

AWSCognitoCredentials.initWithOptions({'region':AWS_REGION,'identity_pool_id':COGNITO_IDENTITY_POOL_ID})

And inside this function:

cognitoClient.initWithOptions(options)

@philberg
Copy link

philberg commented Feb 3, 2017

@xavicolomer ios or android?

Did you re-compile the project after doing all the install steps? That is the only way I have seen that happen

@BerndWessels
Copy link

@chunghe I followed the guide here, it works fine on Android, but on IOS I get the following error in XCode property 'exception' not found on object of type 'AWSTask *'

In both places the error is in task.exception

The error is here

RCT_EXPORT_METHOD(getCredentialsAsync:(RCTPromiseResolveBlock)resolve rejecter:(RCTPromiseRejectBlock)reject){

    //start a separate thread for this to avoid blocking the component queue, since
    //it will have to comunicate with the javascript in the mean time while trying to get the list of logins

    NSString* queueName = [NSString stringWithFormat:@"%@.getCredentialsAsyncQueue",
                           [NSString stringWithUTF8String:dispatch_queue_get_label(self.methodQueue)]
                           ];
    dispatch_queue_t concurrentQueue = dispatch_queue_create([queueName UTF8String], DISPATCH_QUEUE_CONCURRENT);

    dispatch_async(concurrentQueue, ^{

        [[credentialProvider credentials] continueWithBlock:^id(AWSTask *task) {
            if (task.exception){
                dispatch_async(dispatch_get_main_queue(), ^{
                    @throw [NSException exceptionWithName:task.exception.name reason:task.exception.reason userInfo:task.exception.userInfo];
                });
            }

and here

RCT_EXPORT_METHOD(getIdentityIDAsync:(RCTPromiseResolveBlock)resolve rejecter:(RCTPromiseRejectBlock)reject){
    [[credentialProvider getIdentityId] continueWithBlock:^id(AWSTask *task) {
        if (task.exception){
            dispatch_async(dispatch_get_main_queue(), ^{
                @throw [NSException exceptionWithName:task.exception.name reason:task.exception.reason userInfo:task.exception.userInfo];
            });
        }

Any ideas what might be wrong?

@brentmitchell25
Copy link

@BerndWessels You need to use an older version of the SDK. I got your error with 2.5+ version. http://sdk-for-ios.amazonwebservices.com/aws-ios-sdk-2.4.16.zip

@girish989
Copy link

girish989 commented Apr 14, 2017

I followed all the steps you mentioned times but I still got the bellow error:

apps/reactnative/TestAppRu /node_modules/aws-sdk-react-native-transfer-utility/ios/AWSTransferUtility/AWSRNS3TransferUtility.m:127:23: No visible @interface for 'AWSS3TransferUtility' declares the selector 'downloadToURL:bucket:key:expression:completionHander:'

Any help is greatly appreciated. Tna k you very much in advance

@vulcanoidlogic
Copy link

@chunghe - thank you very much for this guide!

@jcollum
Copy link

jcollum commented May 19, 2017

Small change:

Then follow step2/step3/step4 of the official aws ios sdk guide.

to:

Then follow step2/step3/step4 of the official aws ios sdk guide as duplicated here:

I thought I had to go do steps 2, 3 and 4 then do the steps in your guide.

@jcollum
Copy link

jcollum commented May 19, 2017

Anyone know how to fix a permission denied error during the build phase?

/Users/jcollum/Library/Developer/Xcode/DerivedData/roughJupiter-cplaignyznpytfanokwksqskgjrb/Build/Products/Debug-iphonesimulator/roughJupiter.app/Frameworks/AWSCore.framework/strip-frameworks.sh: Permission denied

I used chmod on the file (and it built) but I feel like it will probably just break again -- feels like a band-aid.

@ChristophRob
Copy link

ChristophRob commented May 27, 2017

@chunghe I couldn't get it to work past "yarn add ../../aws-sdk-react-native/Core/aws-sdk-react-native-core-0.0.2.tgz"
It fails at:
Core Username$ react-native link aws-sdk-react-native-core.
Command link unrecognized. Make sure that you have run npm install and that you are inside a react-native project.

@jcollum
Copy link

jcollum commented May 29, 2017

react-native link should be running regardless of what this library is doing. What happens if you call react-native link with no args?

@ChristophRob
Copy link

@jcollum thanks for your response. It's the same. react-native link also not works in the folder "Core". Maybe because it is not a react-native project? run-ios also not works

@jcollum
Copy link

jcollum commented May 29, 2017

you are in the wrong folder I bet; try running it from the folder that contains your package.json file

@ChristophRob
Copy link

@jcollum Ok thanks, so i should start "install aws-sdk-react-native " in the react folder where i want to install it. well that makes sense

@sibelius
Copy link

we should have a react-native link command that helps us

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests