Get OAuth client ID and Config app.json to use login with Google

To use Wiloke Gmail Login (Premium Plugin), you will need to create a project on the Google Developer Console and create an OAuth 2.0 client ID. 

Get an app set up on the Google Developer Console

1, Go to the Credentials Page

2, Create an app for your project if you haven’t already.

3, Once that’s done, click “Create Credentials” and then “OAuth client ID.” You will be prompted to set the product name on the consent screen, go ahead and do that.

Deploying to a standalone app on Android

If you want to use Google Sign In for a standalone app, you can follow these steps. These steps assume that you already have it working on the Expo client app. If you have already created an API key for Google Maps, you skip steps 3 through 8, inclusive.

Note: In app.json If your Package name contains any uppercase please change to lower case all.

Get a Google API Key for your app : 

skip this if you already have one, eg: for Google Maps

  1. Build a standalone app and download the apk, or find one that you have already built.
  2. Go to the Google Developer Credentials
  3. Click Create credentials, then API Key, and finally click RESTRICT KEY in the modal that pops up.
  4. Click the Android apps radio button under Key restriction, then click + Add package name and fingerprint.
  5. Add your android.package from app.json (eg: ca.brentvatne.growlerprowler) to the Package name field.
  6. Run expo fetch:android:hashes.
  7. Take Google Certificate Fingerprint from previous step and insert it in the SHA-1 certificate fingerprint field.
  8. Press Save.

Get an OAuth client ID for your app

  1. Build a standalone app and download the apk, or find one that you have already built.
  2. Go to the Google Developer Credentials.
  3. Click Create credentials, then OAuth client ID, then select the Android radio button.
  4. Run expo fetch:android:hashes.
  5. Take Google Certificate Fingerprint from previous step and insert it in the Signing-certificate fingerprint field.
  6. Add your android.package from app.json (eg: ca.brentvatne.growlerprowler) to the Package name field.
  7. Press Create.

Add the configuration to your app

  1. Build a standalone app and download the apk, or find one that you have already built.
  2. Go to the Google Developer Credentials and find your API key.
  3. Open app.json and add your Google API Key to android.config.googleSignIn.apiKey.
  4. Run expo fetch:android:hashes.
  5. Take Google Certificate Hash from the previous step to app.json under android.config.googleSignIn.certificateHash.
  6. When you use Google.logInAsync(..), pass in the OAuth client ID as the androidStandaloneAppClientId option.
  7. Add your OAuth client ID, follow to link ,Rebuild your standalone app.

Note that if you’ve enabled Google Play’s app signing service, you will need to grab their app signing certificate in production rather than the upload certificate returned by expo fetch:android:hashes. You can do this by grabbing the signature from Play Console -> Your App -> Release management -> App signing, and then going to the API Dashboard -> Credentials and adding the signature to your existing credential.

Deploying to a standalone app on iOS

If you want to use native sign in for a standalone app, you can follow these steps. These steps assume that you already have it working on the Expo client app.

  1. Add a bundleIdentifier to your app.json if you don’t already have one.
  2. Open your browser to Google Developer Credentials
  3. Click Create credentials and then OAuth client ID, then choose iOS.
  4. Provide your bundleIdentifier from app.json (eg: ca.brentvatne.growlerprowler) in the Bundle ID field, then press Create.
  5. Add the given iOS URL scheme to your app.json under ios.config.googleSignIn.reservedClientId.
  6. Wherever you use Google.logInAsync, provide the OAuth client ID as the iosStandaloneAppClientId option.
  7. Add your OAuth client ID, follow to link ,Rebuild your standalone app.

Add OAuth client ID to configureApp.json

please add this code:

    "googleLogin": {
        "usesGoogleSignIn": true,
        "iosStandaloneAppClientId": "your ios clientID",
        "androidStandaloneAppClientId": "your android clientID"
    }

into the configure App.json, like this:

{
    "api": {
        "baseUrl": "https://demo.wilcityapp.com/",
        "timeout": 30000
    },
    "colorPrimary": "#d81340",
    "appleColor": "white",
    "loginScreenStartApp": {
        "enable": true,
        "skipButtonText": "Skip",
        "title": "WilCity Application",
        "text": "Build any type of directory with the fastest and easiest for WordPress"
    },
    "googleLogin": {
        "usesGoogleSignIn": true,
        "iosStandaloneAppClientId": "your ios clientID",
        "androidStandaloneAppClientId": "your android clientID"
    }
}

If you want to disable the Google login in app, please change the “usesGoogleSignIn” to false

Leave A Comment?