react-native-firebase icon indicating copy to clipboard operation
react-native-firebase copied to clipboard

[🐛] Firebase Phone Auth Not Working - (React Native 0.76.8) RNFirebase Version 18.6.1

Open Alreadywinner opened this issue 1 year ago • 24 comments

Issue

So previously I set up my react native app using Firebase Auth with Email/Password enabled. Later on when I turned on Phone provider as well and deleted Email/Password I am stuck in the same error again and again. The error is :

[Error: [auth/app-not-authorized] This app is not authorized to use Firebase Authentication. Please verify that the correct package name, SHA-1, and SHA-256 are configured in the Firebase Console. [ Invalid app info in play_integrity_token ]]

So as the error says that maybe I entered wrong package name, SHA-1 and SHA-256 keys. Which I am sure I have entered correct. I picked my package name from build.gradle file and SHA-1 and SHA-256 keys were picker from Task :app:signingReportwhose variant was debug. Well all of my variants have the same keys. The command I use was : cd android && ./gradlew signingReport Both keys are entered in the project settings carefully.

At last I have also enabled Play Integrity API from going to google cloud console select my current project that I am working on and then enabled it. Clean the build folder re-run the app and still getting the same error again and again why is that ?

If I change my mobile phone and move from samsung to pixel I get [auth/unknown] error Although the re-captcha open-up and in between it closes and bring me back to the app and shows me the error.

Someone please help me there's something minor I'm missing

Help would be appreciated and stop me from killing myself thanks in advance !!

This is the version I'm using :

"@react-native-firebase/app": "^18.6.1",
"@react-native-firebase/app-check": "^18.6.1",
"@react-native-firebase/auth": "^18.6.1",

I have also enabled firebase Auth Check and created a debug token from firebase console and then encluded it in my command like this :

"android": "FIREBASE_APP_CHECK_DEBUG_TOKEN=MY_FIREBASE_DEBUG_TOKEN_FROM_CONSOLE && react-native run-android",

I have made sure that spellings are correct and moving on forward I have changed the name or package name of my app in the description for security purposes


Project Files

Javascript

Click To Expand

package.json:

# N/A

firebase.json for react-native-firebase v6:

# N/A

iOS

Click To Expand

ios/Podfile:

  • [ ] I'm not using Pods
  • [x] I'm using Pods and my Podfile looks like:
# Resolve react_native_pods.rb with node to allow for hoisting
require Pod::Executable.execute_command('node', ['-p',
  'require.resolve(
    "react-native/scripts/react_native_pods.rb",
    {paths: [process.argv[1]]},
  )', __dir__]).strip

platform :ios, min_ios_version_supported
use_modular_headers!
prepare_react_native_project!

# If you are using a `react-native-flipper` your iOS build will fail when `NO_FLIPPER=1` is set.
# because `react-native-flipper` depends on (FlipperKit,...) that will be excluded
#
# To fix this you can also exclude `react-native-flipper` using a `react-native.config.js`
# ```js
# module.exports = {
#   dependencies: {
#     ...(process.env.NO_FLIPPER ? { 'react-native-flipper': { platforms: { ios: null } } } : {}),
# ```
# flipper_config = ENV['NO_FLIPPER'] == "1" ? FlipperConfiguration.disabled : FlipperConfiguration.enabled

# linkage = ENV['USE_FRAMEWORKS']
# if linkage != nil
#   Pod::UI.puts "Configuring Pod with #{linkage}ally linked Frameworks".green
#   use_frameworks! :linkage => linkage.to_sym
# end

use_frameworks! :linkage => :static

$RNMapboxMapsImpl = 'mapbox'

target 'MY APP NAME' do
  config = use_native_modules!

  # Flags change depending on the env values.
  flags = get_default_flags()
    #pod 'RNFBFirestore', :path => '../node_modules/@react-native-firebase/firestore'
    pod 'RNFS', :path => '../node_modules/react-native-fs'

  use_react_native!(
    :path => config[:reactNativePath],
    # Hermes is now enabled by default. Disable by setting this flag to false.
    # :hermes_enabled => flags[:hermes_enabled],
    :hermes_enabled => false,
    :fabric_enabled => flags[:fabric_enabled],
    # Enables Flipper.
    #
    # Note that if you have use_frameworks! enabled, Flipper will not work and
    # you should disable the next line.
    #:flipper_configuration => flipper_config,
    # An absolute path to your application root.
    :app_path => "#{Pod::Config.instance.installation_root}/.."
  )

  target 'AppTests' do
    inherit! :complete
    # Pods for testing
  end

  pre_install do |installer|
    $RNMapboxMaps.pre_install(installer)
  end

  post_install do |installer|
    # https://github.com/facebook/react-native/blob/main/packages/react-native/scripts/react_native_pods.rb#L197-L202
    react_native_post_install(
      installer,
      config[:reactNativePath],
      :mac_catalyst_enabled => false
      )
      $RNMapboxMaps.post_install(installer)
    __apply_Xcode_12_5_M1_post_install_workaround(installer)
  end
end

AppDelegate.m:

#import "AppDelegate.h"
#import <Firebase.h>
#import <React/RCTBundleURLProvider.h>

@implementation AppDelegate

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  self.moduleName = @"PhoneNumber";
  // You can add your custom initial props in the dictionary below.
  // They will be passed down to the ViewController used by React Native.
  self.initialProps = @{};

  return [super application:application didFinishLaunchingWithOptions:launchOptions];
}

- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
{
  return [self getBundleURL];
}

- (NSURL *)getBundleURL
{
#if DEBUG
  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index"];
#else
  return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
#endif
}

@end


Android

Click To Expand

Have you converted to AndroidX?

  • [ ] my application is an AndroidX application?
  • [ ] I am using android/gradle.settings jetifier=true for Android compatibility?
  • [ ] I am using the NPM package jetifier for react-native compatibility?

android/build.gradle:

buildscript {
    ext {
        buildToolsVersion = "34.0.0"
        minSdkVersion = 21
        compileSdkVersion = 34
        targetSdkVersion = 34
        ndkVersion = "25.1.8937393"
        kotlinVersion = "1.8.0"
    }
    repositories {
        google()
        mavenCentral()
    }
    dependencies {
        classpath("com.android.tools.build:gradle")
        classpath("com.facebook.react:react-native-gradle-plugin")
        classpath("org.jetbrains.kotlin:kotlin-gradle-plugin")
        classpath('com.google.gms:google-services:4.4.0')
    }
}

apply plugin: "com.facebook.react.rootproject"

android/app/build.gradle:

apply plugin: "com.android.application"
apply plugin: 'com.google.gms.google-services'
apply plugin: "org.jetbrains.kotlin.android"
apply plugin: "com.facebook.react"

/**
 * This is the configuration block to customize your React Native Android app.
 * By default you don't need to apply any configuration, just uncomment the lines you need.
 */
react {
    /* Folders */
    //   The root of your project, i.e. where "package.json" lives. Default is '..'
    // root = file("../")
    //   The folder where the react-native NPM package is. Default is ../node_modules/react-native
    // reactNativeDir = file("../node_modules/react-native")
    //   The folder where the react-native Codegen package is. Default is ../node_modules/@react-native/codegen
    // codegenDir = file("../node_modules/@react-native/codegen")
    //   The cli.js file which is the React Native CLI entrypoint. Default is ../node_modules/react-native/cli.js
    // cliFile = file("../node_modules/react-native/cli.js")

    /* Variants */
    //   The list of variants to that are debuggable. For those we're going to
    //   skip the bundling of the JS bundle and the assets. By default is just 'debug'.
    //   If you add flavors like lite, prod, etc. you'll have to list your debuggableVariants.
    // debuggableVariants = ["liteDebug", "prodDebug"]

    /* Bundling */
    //   A list containing the node command and its flags. Default is just 'node'.
    // nodeExecutableAndArgs = ["node"]
    //
    //   The command to run when bundling. By default is 'bundle'
    // bundleCommand = "ram-bundle"
    //
    //   The path to the CLI configuration file. Default is empty.
    // bundleConfig = file(../rn-cli.config.js)
    //
    //   The name of the generated asset file containing your JS bundle
    // bundleAssetName = "MyApplication.android.bundle"
    //
    //   The entry file for bundle generation. Default is 'index.android.js' or 'index.js'
    // entryFile = file("../js/MyApplication.android.js")
    //
    //   A list of extra flags to pass to the 'bundle' commands.
    //   See https://github.com/react-native-community/cli/blob/main/docs/commands.md#bundle
    // extraPackagerArgs = []

    /* Hermes Commands */
    //   The hermes compiler command to run. By default it is 'hermesc'
    // hermesCommand = "$rootDir/my-custom-hermesc/bin/hermesc"
    //
    //   The list of flags to pass to the Hermes compiler. By default is "-O", "-output-source-map"
    // hermesFlags = ["-O", "-output-source-map"]
}

/**
 * Set this to true to Run Proguard on Release builds to minify the Java bytecode.
 */
def enableProguardInReleaseBuilds = false

/**
 * The preferred build flavor of JavaScriptCore (JSC)
 *
 * For example, to use the international variant, you can use:
 * `def jscFlavor = 'org.webkit:android-jsc-intl:+'`
 *
 * The international variant includes ICU i18n library and necessary data
 * allowing to use e.g. `Date.toLocaleString` and `String.localeCompare` that
 * give correct results when using with locales other than en-US. Note that
 * this variant is about 6MiB larger per architecture than default.
 */
def jscFlavor = 'org.webkit:android-jsc:+'

android {
    ndkVersion rootProject.ext.ndkVersion
    buildToolsVersion rootProject.ext.buildToolsVersion
    compileSdk rootProject.ext.compileSdkVersion

    namespace "com.scartastephonenumber"
    defaultConfig {
        applicationId "com.scartastephonenumber"
        minSdkVersion rootProject.ext.minSdkVersion
        targetSdkVersion rootProject.ext.targetSdkVersion
        versionCode 1
        versionName "1.0"
    }
    signingConfigs {
        debug {
            storeFile file('debug.keystore')
            storePassword 'android'
            keyAlias 'androiddebugkey'
            keyPassword 'android'
        }
    }
    buildTypes {
        debug {
            signingConfig signingConfigs.debug
        }
        release {
            // Caution! In production, you need to generate your own keystore file.
            // see https://reactnative.dev/docs/signed-apk-android.
            signingConfig signingConfigs.debug
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
        }
    }
}

dependencies {
    // The version of react-native is set by the React Native Gradle Plugin
    implementation("com.facebook.react:react-android")
    implementation("com.facebook.react:flipper-integration")

    if (hermesEnabled.toBoolean()) {
        implementation("com.facebook.react:hermes-android")
    } else {
        implementation jscFlavor
    }
}

apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)

android/settings.gradle:

rootProject.name = 'ScartastePhoneNumber'
apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
include ':app'
includeBuild('../node_modules/@react-native/gradle-plugin')

MainApplication.java:

// N/A

AndroidManifest.xml:

<!-- N/A -->

Environment

Click To Expand

react-native info output:

 OUTPUT GOES HERE
  • Platform that you're experiencing the issue on:
    • [ ] iOS
    • [ ] Android
    • [ ] iOS but have not tested behavior on Android
    • [ ] Android but have not tested behavior on iOS
    • [ ] Both
  • react-native-firebase version you're using that has this issue:
    • e.g. 5.4.3
  • Firebase module(s) you're using that has the issue:
    • e.g. Instance ID
  • Are you using TypeScript?
    • Y/N & VERSION

Alreadywinner avatar Mar 05 '24 13:03 Alreadywinner

@mikehardy I've also encountered this after upgrading to 19, many users complaining that they cannot receive the SMS OTP on Androids.

Probably unrelated with rn-firebase, this must be an upstream issue.

efstathiosntonas avatar Mar 05 '24 16:03 efstathiosntonas

@efstathiosntonas I also tried to create a new project but still nothing is working. Even the re-captcha is failing as well

Alreadywinner avatar Mar 05 '24 17:03 Alreadywinner

@Alreadywinner you might want to look into this: https://github.com/firebase/firebase-android-sdk/issues/4973

You should use test phone numbers provided by firebase authentication and not real numbers in debug mode.

more info about test numbers here: https://firebase.google.com/docs/auth/web/phone-auth#test-with-fictional-phone-numbers

efstathiosntonas avatar Mar 05 '24 17:03 efstathiosntonas

But what to do with the captcha I mean that should work right ? . And I have tried creating release apk of my app and then tried on real numbers the error was same

Alreadywinner avatar Mar 05 '24 17:03 Alreadywinner

Partially related to https://github.com/invertase/react-native-firebase/discussions/7643

iM-GeeKy avatar Mar 05 '24 19:03 iM-GeeKy

Partially related to #7643

Yeah Looks like you facing the same error with expo CLI and I am using React Native CLI same error is in there. Cherry on top is allowing App intergrity is giving an error on Flutter Fire as well I just checked it out so there's something minor that we are missing or this clearly have something to do with Firebase itself

Alreadywinner avatar Mar 05 '24 19:03 Alreadywinner

Hey does someone have something ?

Alreadywinner avatar Mar 08 '24 21:03 Alreadywinner

Did you check if the sha fingerprints, you provided in Firebase Console, are in google-services.json? I'm randomly having this issue too, but my SHA is not in google-services.json and I think this might be the main issue. I'm on 18.3 of rn-firebase.

maciekstosio avatar Mar 13 '24 09:03 maciekstosio

Hello 👋, to help manage issues we automatically close stale issues.

This issue has been automatically marked as stale because it has not had activity for quite some time.Has this issue been fixed, or does it still require attention?

This issue will be closed in 15 days if no further activity occurs.

Thank you for your contributions.

github-actions[bot] avatar Apr 10 '24 09:04 github-actions[bot]

Has anyone fixed this yet? I have upgraded and started getting this issue. SMS is not being sent on iOS and Android either

ceafive avatar Apr 17 '24 06:04 ceafive

Has anyone fixed this yet? I have upgraded and started getting this issue. SMS is not being sent on iOS and Android either

Nope nothing came up yet

Alreadywinner avatar Apr 18 '24 19:04 Alreadywinner

Did you check if the sha fingerprints, you provided in Firebase Console, are in google-services.json? I'm randomly having this issue too, but my SHA is not in google-services.json and I think this might be the main issue. I'm on 18.3 of rn-firebase.

I have validated mmy SHA fingerprints a billion time and yes they are present in google-services.json but still I have no luck. If you were able to solve it then is it possible for you to share your example google-services.json so that I get idea what I'm missing @maciekstosio

Alreadywinner avatar Apr 18 '24 19:04 Alreadywinner

you should downgrade your firebase as well firebase/auth version to something like 16.0.0 it will now worki fine

This is terrible advice, as you will then have a firebase-ios-sdk that does not have privacy manifests and you will not be able to deploy builds to Apple's App Store

mikehardy avatar May 02 '24 15:05 mikehardy

The same problem here, but I'm sure that there is something about the lib, I downgraded and worked, but I want to use it in the last version of course, but there is something in the actual version that is breaking the flow.

brunosp-49 avatar May 25 '24 06:05 brunosp-49

Hi! Was struggling with this issue as well. I'm using Expo and using expo-notifications. It seemed to resolve after migrating to FCMv1 which you'll have to do as outlined in this article. Part of the process involves creating a new google-services.json with the generated credentials you make in Firebase and once that was put in, authentication started working. Hope that works for you!

LordofMankid avatar Jul 11 '24 18:07 LordofMankid

I was facing the same issue. I got it to work by fixing the phone number format. I was sending "+1 (123)-456-7890" and reformatting it to +11234567890 fixed the issue. The error message had nothing to do with what was the actual issue.

let phoneNumber = `+1${userPrefs.phoneNumber}`;
phoneNumber = phoneNumber.replace(/[ \-\(\)]/g, '');

const phoneInfoOptions: PhoneMultiFactorEnrollInfoOptions = {
          phoneNumber: phoneNumber,
          session: multiFactorSession,
};

Vinkko avatar Aug 05 '24 20:08 Vinkko

@Alreadywinner - there's a couple of suggestions above if those help.

russellwheatley avatar Aug 12 '24 13:08 russellwheatley