I have a server running on localhost:5000 on my desktop, and when I make http requests through my react-native app when running on the iOS simulation to it, it works. However, when I connect to a real device, the http requests don't work. What am I doing wrong? Is there something I have to configure?

I am struggling with sending Push Notification using the react-native-firebase.

There are somethings strange. Sometimes, the iOS app work perfectly, but sometimes, it receives the Push Notification ONLY in onMessage, which is terribly wrong.

I am using:

• React-native: 0.61.5
• React-native-firebase: 5.6.0
• Latest version of Firebase/Core and Firebase/Messaging
• Push Notification (added for both debug and release)
• Remote Notifications (added)

Please help me guys if you faced this issue before.

Below is the response message from Firebase when it come to onMessage function:

_messageListener
{"_collapseKey":"always_is_app_bundle_id","_data":{},"_from":"595939737681","_messageId":"-M26mNVZo-WhP5ev8dDN","_ttl":3600}

Many thanks!

I have been working in React Native iOS project and use cocoapods. When I do "import React" in my project, it throws error "Could not build Objective-C module 'React'". And there is error in "ArtNode.h" saying "Include of non-modular header inside framework module 'React.ARTNode'". 20 other similar Include of non-modular header errors occurring in other header file.

I do not know what is the problem and here is my pod file:

  source 'https://github.com/CocoaPods/Specs.git'

platform :ios, '8.0'
use_frameworks!

target ‘TestApp’ do
  pod 'Alamofire'
  pod 'RealmSwift'
  pod 'SwiftyJSON', '~> 4.0'
  pod 'SSZipArchive'
  pod 'Firebase/Core'
  pod 'Firebase/Messaging'
  pod 'Fabric'
  pod 'Crashlytics'

  # ReactNative
  pod 'React', :path => '../node_modules/react-native', :subspecs => [
    'Core',
    'ART',
    'CxxBridge', # Include this for RN >= 0.47
    'DevSupport', # Include this to enable In-App Devmenu if RN >= 0.43
    'RCTActionSheet',
    'RCTAnimation',
    'RCTText',
    'RCTImage',
    'RCTNetwork',
    'RCTPushNotification',
    'RCTWebSocket', # needed for debugging
    'RCTGeolocation',
    'RCTSettings',
    'RCTVibration',
    'RCTLinkingIOS',
    # Add any other subspecs you want to use in your project
  ]
  # Explicitly include Yoga if you are using RN >= 0.42.0
  pod "yoga", :path => "../node_modules/react-native/ReactCommon/yoga"
  # Third party deps podspec link
  pod 'DoubleConversion', :podspec => '../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec'
  pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/glog.podspec'
  pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'

  # Other link
  # pod 'RNI18n', :path => '../node_modules/react-native-i18n'  
  pod 'react-native-fetch-blob', :path => '../node_modules/react-native-fetch-blob'
  pod 'react-native-pdf', :path => '../node_modules/react-native-pdf'
  pod 'react-native-config', :path => '../node_modules/react-native-config'
end

def fix_unused_yoga_headers
    filepath = './Pods/Target Support Files/yoga/yoga-umbrella.h'

    contents = []

    file = File.open(filepath, 'r')
    file.each_line do | line |
        contents << line
    end
    file.close

    if contents[12].include? "Utils.h"
        contents.delete_at(15) # #import "YGNode.h"
        contents.delete_at(15) # #import "YGNodePrint.h"
        contents.delete_at(15) # #import "Yoga-internal.h"
        contents.delete_at(12) # #import "Utils.h"

        file = File.open(filepath, 'w') do |f|
            f.puts(contents)
        end
    end
end

def react_native_fix
    fix_unused_yoga_headers
end

post_install do |installer|
    react_native_fix

    # Fix react-native-config Bug: 'GeneratedDotEnv.m' file not found
    installer.pods_project.targets.each do |target|
        if target.name == 'react-native-config'
            phase = target.project.new(Xcodeproj::Project::Object::PBXShellScriptBuildPhase)
            phase.shell_script = "cd ../../"\
            "&& RNC_ROOT=./node_modules/react-native-config/"\
            "&& export SYMROOT=$RNC_ROOT/ios/ReactNativeConfig"\
            "&& export BUILD_DIR=$RNC_ROOT/ios/ReactNativeConfig"\
            "&& ruby $RNC_ROOT/ios/ReactNativeConfig/BuildDotenvConfig.ruby"

            target.build_phases << phase
            target.build_phases.move(phase,0)
        end
    end

    installer.pods_project.build_configuration_list.build_configurations.each do |configuration|
             configuration.build_settings['CLANG_ALLOW_NON_MODULAR_INCLUDES_IN_FRAMEWORK_MODULES'] = 'YES'
    end

end

I am having this error after creating a project with expo init, ejecting my project and cd into my ios folder then run pod install.

Unable to build my app suddenly. This is the error which I got

  Continuing in background.

       Error: Failed to display Xcode notification
          caused by: script error: osascript: no such component "JavaScript".

        /Users//Library/Developer/Xcode/DerivedData/App-dvcafjcjvuogulagizfflouagntd/Build/Intermediates.noindex/ArchiveIntermediates/App/IntermediateBuildFilesPath/App.build/Release-iphoneos/App.build/Script-00199139199199133.sh: line 5: debug]: command not found
Add --log-level=[info|debug] or export SENTRY_LOG_LEVEL=[info|debug] to see more output.
Please attach the full debug log to all bug reports

My name is Mattia, from Italy.

The boss of my company ask me to modify the code of Rocket.Chat.ReactNative. He wants change the Firebase linked to the application so that user data remain registered in our database.

I followed the guidelines from firebase console. I downloaded the google-services.json and replaced on android project. I have enabled the email login method.

The app works but when try to register a new user nothing appear in the list of User in Authentication.

I found this file inside the project, is named google-services.prod.json

I searched the internet to know what is it, but i haven't found anything about it.

In the part of code where is called the fuction to register with the server, there is this

and this is the js file where RocketChat is set

At this point i don't know what change.

Please help me. how do I make it work?

I am sorry for the black marks in the image.

I have seen multiple posts suggesting an answer to this problem, Lock unlocks keychain (tried it), pod Update (tried it), clear build(tried it), signing, skip install in build settings(tried it) - None of them actually worked.

I built my iOS app in react native with Expo, after which I did expo eject to create the iOS folder for Xcode build and archiving, the build is successful every time and it even runs on the simulator and in my device(iPhone 7) but it always failed to archive by throwing this error - Uncategorised - Command PhaseScriptExecution failed with a non zero exit code..

Any help to point me in which direction should I go or what can be the possible mistake that I am doing will be of great help. Do let me know if, I should provide any more detail about this. Thank you!

Xcode Version - 11.0 Mac Version - 10.15 Catalina iPhone OS - 13.1.3

Few links I tried from -

1. "${PODS_ROOT}/SwiftLint/swiftlint" causes "Command PhaseScriptExecution failed with a nonzero exit code" with Xcode 10
2. https://github.com/apollographql/apollo-ios/issues/395
3. https://www.reddit.com/r/iOSProgramming/comments/al9box/getting_an_error_command_phasescriptexecution/

I am currently trying to get my React-Native application (without Expo) running on CircleCI, but the pod install command won't resolve.

Do anyone know, how to solve the issue? Already ran the suggested command, but this won't change anything...

Error:

[13:20:40]: ▸ Resolving dependencies of `Podfile`
[13:20:40]: ▸ [!] CocoaPods could not find compatible versions for pod "RNGestureHandler":
[13:20:40]: ▸ In snapshot (Podfile.lock):
[13:20:40]: ▸ RNGestureHandler (from `../node_modules/react-native-gesture-handler/RNGestureHandler.podspec`)
[13:20:40]: ▸ In Podfile:
[13:20:40]: ▸ RNGestureHandler (from `../node_modules/react-native-gesture-handler/RNGestureHandler.podspec`)
[13:20:40]: ▸ It seems like you've changed the version of the dependency `RNGestureHandler` and it differs from the version stored in `Pods/Local Podspecs`.
[13:20:40]: ▸ You should run `pod update RNGestureHandler --no-repo-update` to apply changes made locally.

I am working on an app which have a media server and this media server provide me the URL's of different video files and these videos are in dash format or .mpd format. I go through react-native-video and it have exo-player on android which already have a support of dash, I have tested exo-player on andriod and it works but on the other hand it uses AVPlayer for IOS which don't have any support of dash. I spent some time to find some solution on IOS side which could also support React-Native android and IOS but didn't find a proper way, Found two solutions but not works for both.

dash.js - https://github.com/Dash-Industry-Forum/dash.js/wiki

Google Shaka Player - https://github.com/google/shaka-playerdash.js have only support for web and shaka-player have some embeded solution available on IOS and which i have bridge and then i can use.

I am looking for some quick work around on react-native, Is there any player available which can play dash on both platforms or any other work around that can work for me.

I'm developing an app with react native(0.61.5) and I'm trying to implement several log in using react-native-firebase/auth(6.3.4)

For the log in with apple I use react-native-apple-authentication it's working like a charm following this example : https://github.com/invertase/react-native-apple-authentication/blob/master/docs/FIREBASE.md

const _signInUserWithCredential = (credential: FirebaseAuthTypes.AuthCredential) => {
  firebase
       .auth()
       .signInWithCredential(credential)
       .then(data => {   
            //success
         })
          .catch(error => {
                console.warn(error);
         });

};

My user can logIn with several credential (Google, Apple, Facebook...). If my user is already loged with a credential I use _linkUserWithCredential to link the new credential to the existing account :

const _linkUserWithCredential = (credential: FirebaseAuthTypes.AuthCredential) => {
    if (user !== null) {
        user.linkWithCredential(credential)
            .then(data => {
              //success
            })
            .catch(error => {
                console.warn(error.code);
            });
    }
};

It works too.

I have an issue when I try to merge an Apple account with an existing one.

As explained in the doc :https://firebase.google.com/docs/auth/web/account-linking

Account linking will fail if the credentials are already linked to another user account. In this situation, you must handle merging the accounts and associated data as appropriate for your app

var prevUser = auth.currentUser;
// Sign in user with another account
auth.signInWithCredential(credential).then(function(user) {
  console.log("Sign In Success", user);
  var currentUser = user;
  // Merge prevUser and currentUser data stored in Firebase.
  // Note: How you handle this is specific to your application

  // After data is migrated delete the duplicate user
  return user.delete().then(function() {
    // Link the OAuth Credential to original account
    return prevUser.linkWithCredential(credential);
  }).then(function() {
    // Sign in with the newly linked credential
    return auth.signInWithCredential(credential);
  });
}).catch(function(error) {
  console.log("Sign In Error", error);
});

and again it's working except with Apple

Apple credential can only be use once so if linkWithCredential fails I can't merge the account as I need a new credential to perform signInWithCredential.

In the iOS firebase doc you can retrieve new credential from the error fired by linkWithCredential in the userInfo key FIRAuthErrorUserInfoUpdatedCredentialKey as explain here : https://firebase.google.com/docs/auth/ios/apple

Unfortunately I think that FIRAuthErrorUserInfoUpdatedCredentialKey is not implemented for react native.

So my questions are :

• How can I get a new apple credential without having my user to prompt again his password?
• How can I reuse an apple credential ?
• Do you have any idea to merge an apple user to an existing one?

A work around would be to use firebase admin to test if a user exists with the current credential and then merge the accounts but I'd rather not install firebase admin just for that

I'm using React Native and Firebase to send push notifications. So far the Android devices I've tested are receiving local and remote push notifications as intended. There is no iOS device that remote push notification have worked for so far. Local notifications are never an issue. Push notifications are enabled within the system settings for the app.

Before sending the message I rely on code to register the token, and that has never worked for an iOS device. I have tried three IDs, nothing has worked and I'm looking for suggestions to get the token registered properly.

Here is what I have tried:

PushNotification.configure({
  onRegister: function(token) {
    setPushConfiguration({ token: token.token, });
// two words and 66 characters e7...-c6 etc     

messaging().getToken().then(token => {
  setPushConfiguration({ token });
// 8 words and 152 characters cf-...:AP..._P9...-V6...-pq...-rZ...-9y... etc

// I have also tried the hardware ID, just for kicks. 

The error I get is: InvalidApnsCredential

Here is some version information:

PS > react-native --version
react-native-cli: 2.0.1
react-native: 0.61.4
PS > more .\package.json
"@react-native-community/push-notification-ios": "^1.0.7",
"react-native-push-notification": "^3.1.9",
"@react-native-firebase/messaging": "^6.3.4",

I have followed the iOS push notification documentation. Looking at the react-native-firebase-starter project, I'm not seeing where the iOS token is saved. Which 'token' is used to register an iOS device for push notifications with Firebase? Are there any poorly documented tricks to getting a token to register for an iOS device such as configuration options? I enabled the push notification capability in Xcode.

I would like to support only portrait view. How can I make a React Native app not to autorotate? I tried searching documentation and Github issues, but I didn't find anything helpful.

Integrated react-native-event-listeners library for emitting events in the app depending upon an action and then added listeners to listen for the same event on other screen, which is working pretty fine as expected on simulator and device during debugging(iOS & Android). But when I have generated release builds for both (iOS & Android) devices. Events are not emitted and listeners are not working at all.

Why this is not working on release builds, however working fine during debug sessions on both iOS and Android devices.

I'm using react-native 0.28.0

I'm trying to show an image on iPhone simulator according to this tutorial: http://www.appcoda.com/react-native-introduction/

var styles = StyleSheet.create({
image: {
    width: 107,
    height: 165,
    padding: 10
  }
}

var imageURI = 'http://books.google.com/books/content?id=PCDengEACAAJ&printsec=frontcover&img=1&zoom=1&source=gbs_api'

Then in the render() function, I add this:

<Image style={styles.image} source={{uri:imageURI}} />

The space allocated for the image is there, but the image is not shown.

I have changed a react-native package src component as per my requirement. How can I add that in my app?

(i.e) I have added react-native-floating-action and changed some styles in FloatingActionItem.js and FloatingAction.js file. How can I add the changes inside in my app.

Because If I remove the node module all the changes are gone after installing it again.

Building an app with RN I use the following to receive user's location :

 navigator.geolocation.getCurrentPosition(
  (position) => {
   //do stuff with location
  },
  (error) => {
    //error or locaiton not allowed
  },
  {enableHighAccuracy: true, timeout: 20000, maximumAge: 1000}
);

Which immediately invokes the inquiry for user to accept geolocation permissions. What I'm trying to achieve now is to have an explicit screen before prompting user to click on a button to accept those permissions. In order to get there, I need some way to check if he has accepted those permissions before or not. Caching it in storage would be a bad solution - it might go out of sync if user changes permissions in settings.

How can I check if user has accepted geolocation permissions without triggering the permission alert?

I have following navigation stack

const AppNavigator = createStackNavigator({
    AppSplashScreen: AppSplashScreen,
    LanguageScreen: LanguageScreen,
    WalkthroughScreen: WalkthroughScreen,
    LoginScreen: LoginScreen,
    ForgotPasswordScreen: ForgotPasswordScreen,
    ResetPasswordScreen: ResetPasswordScreen,
    RegistrationTypeScreen: RegistrationTypeScreen,
    RegistrationFormScreen: RegistrationFormScreen,
    OTPConfirmationScreen: OTPConfirmationScreen,
    BottomTabNavigator: BottomTabNavigator
}, {
    headerMode: 'none',
    cardStyle: { backgroundColor: '#000000' },
});

const AppContainer = createAppContainer(AppNavigator);

export default App;

I am displaying splash screen video when the first app opens.

Here is what my AppSplashScreen looks like

import React, { Component } from 'react';
import { View } from 'react-native';
import SplashScreen from 'react-native-splash-screen';
import Video from 'react-native-video';
import { VIDEO_SPLASH_2 } from '../assets/videos/index';

export default class AppSplashScreen extends Component {

    state = {
        displayVideoPlayer: true,
        firstLaunch: false
    }

    componentDidMount() {
        SplashScreen.hide();
    }

    componentWillUnmount() {
        this.setState({
            displayVideoPlayer: false
        });
    }

    isFirstLaunch() {
        let firstLaunch = true;
        if (true === storage.get('APP_ALREADY_LAUNCHED')) {
            firstLaunch = false;
        } else {
            storage.set('APP_ALREADY_LAUNCHED', true);
            firstLaunch = true;
        }
        return firstLaunch;
    }

    didCompleteVideoPlayback() {
        if (true === this.state.displayVideoPlayer) {
            this.setState({
                displayVideoPlayer: false
            });
        }
        const currentRouteName = this.props.navigation.state.routeName;
        if ('AppSplashScreen' !== currentRouteName) {
            return false;
        }
        if (true === global.SKIP_SPLASH_SCREEN_REDIRECT) {
            return false;
        }
        if (this.isFirstLaunch()) {
            this.props.navigation.navigate('LanguageScreen');
            return false;
        }
        this.props.navigation.navigate('HomeScreen');
    }

    render() {
        return (
            <View style={{flex: 1, backgroundColor: '#000000', alignItems: 'center', justifyContent: 'center'}}>
                {true === this.state.displayVideoPlayer &&
                    <Video
                        source={VIDEO_SPLASH_2}
                        muted={true}
                        repeat={false}
                        playInBackground={false}
                        resizeMode="contain"
                        onEnd={() => this.didCompleteVideoPlayback()}
                        style={{height: '100%', width: '100%', backgroundColor: '#000000'}}
                    />
                }
            </View>
        );
    }
}

My issue is, whenever I put the application in Background, and resume after 30 seconds, it always starts with AppSplashScreen whereas I expect it to resume from the last screen. It works correctly if I open it before 30 seconds. I assume somewhere it is killing the memory and starting the app from start when I resume after 30 second.

What could be the issue here. Or is there another workaround to resume the app in the same screen where the user left off.

Is there any way to get React Native to output all console.log calls to same place NSLog goes?

Is there a way I can see the outputs from console.log in Release mode?

If not is there an NSLog helper for react native I can use?

(note I know that in Debug mode I have a multitude of ways of getting this info, but I am having specific issue with Release mode that I need to diagnose.)

I implemented an app in react-native that send push notifications via Firebase. Most of the time, it is working well, but sometimes, the push notifications are not received by the device (mostly iOS 13 devices).

For the devices receiving my push notifications correctly, onNotification is triggered everytime (foreground and background).

For the devices not receiving my push notifications, onMessage is triggered (only on foreground).

package.json

"react-native-firebase": "^5.6.0"

Podfile

pod 'Firebase/Core', '~> 6.19.0'
pod 'Firebase/Functions', '~> 6.19.0'
pod 'Firebase/Messaging', '~> 6.19.0'
pod 'Firebase/Auth', '~> 6.19.0'

To test out my push notifications, I am sending it via POSTMAN, using the firebase API, with the current Payload:

{
"to" : "my_FCM_token",
"priority" : "high",
"notification" : {
    "body" : "Body TEST",
    "title": "TEST Notification",
    "vibrate": 1,
    "sound": 1
},
"data" : {
    "key" : "value"
}
}

Note that it always returns me a success

AppDelegate.m

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
    // FIREBASE CONFIG
    [FIRApp configure];

    // SETTING ROOT VIEW CONTROLLER
    RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions];
    RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge
                                               moduleName:@"MyModule"
                                        initialProperties:nil];
    self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
    UIViewController *rootViewController = [UIViewController new];
    rootViewController.view = rootView;
    self.window.rootViewController = rootViewController;
    [self.window makeKeyAndVisible];
    [RNSplashScreen show];
    return YES;
 }   

App.js

async componentDidMount() {

  firebase.messaging().hasPermission().then(enabled => {
    if (enabled) {
      firebase.messaging().getToken().then(token => {
        global.token = token;
      })
    } else {
      firebase.messaging().requestPermission()
        .then(() => {
          alert("Permission Accepted", error)
        })
        .catch(error => {
          alert("Permission Denied", error)
        });
     }
  });

  this.initialNotificationListener = firebase.notifications().getInitialNotification().then((notificationOpen: NotificationOpen) => {
    alert("Getting initial Notification")
  });

  this.notificationOpenedListener = firebase.notifications().onNotificationOpened((notificationOpen: NotificationOpen) => {
    alert("onNotificationOpened triggered")
  });

  this.notificationListener = firebase.notifications().onNotification((notification: Notification) => {
    alert("onNotification triggered")
  });

  this.onMessageListener = firebase.messaging().onMessage(async (remoteMessage) => {
    alert("onMessage triggered")
  });
}

componentWillUnmount() {
  this.notificationOpenedListener();
  this.notificationDisplayedListener();
  this.notificationListener();
  this.initialNotificationListener();
  this.onMessageListener();
}

Any help would be appreciated, thank you :)

I use react native gifted chat, and I want that when a user fails to send a chat to the server then the icon in the bubble changes?

Maybe if a user fails to send a message, an icon like this will appear:

Thank you, please help