Expo React Native Simulator 错误：Facebook SDK 尚未初始化

Posted 2023-03-15

【中文标题】Expo React Native Simulator 错误：Facebook SDK 尚未初始化

【英文标题】：Expo React Native Simulator Error: Facebook SDK has not been initialized yet

【发布时间】：2020-03-02 23:18:42

【问题描述】：

我收到这个“错误：Facebook SDK 尚未初始化”，我下面的代码是...

我的package.json文件配置信息：

    
      "main": "node_modules/expo/AppEntry.js",
       "scripts": 
        "start": "expo start",
        "android": "expo start --android",
        "ios": "expo start --ios",
        "web": "expo start --web",
       "eject": "expo eject"
        ,
       "dependencies": 
       "expo": "^36.0.0",
       "firebase": "^7.8.2",
       "react": "16.9.0",
       "react-dom": "16.9.0",
       "react-native": "https://github.com/expo/react native/archive/sdk-36.0.1.tar.gz",
       "react-native-web": "^0.11.7",
       "expo-facebook": "~8.0.0"
       ,
    "devDependencies": 
    "babel-preset-expo": "^8.0.0",
    "@babel/core": "^7.0.0"
    ,
   "private": true
    

我的代码：

   import React from 'react';
   import  StyleSheet, 
   Text, 
   View, 
   TouchableHighlight, 
   TextInput from 'react-native';
   import  f, auth, database  from './config/config';
   import * as Facebook from 'expo-facebook';


   export default class App extends React.Component 

   constructor(props)
   

   super(props);
   this.state = 
   loggedin: false
   ;
   //this.registerUser('[e-mail]',                                                                              
       'fakepassword');var that = this;
   f.auth().onAuthStateChanged(function(user) 
   if(user) 
   //Logged in
  that.setState(
  loggedin: true
 );
 console.log('Logged in', user);
 else
//Logged out
that.setState(
loggedin: false
);
 console.log('Logged out');

 );


loginUser = async(email, pass) => 
 if(email != '' && pass != '') 
 //
   try
   let user = await auth.signInWithEmailAndPassword(email,          
    pass); console.log(user);
 catch(error) 
   console.log(error);
 
 else
 //if they are empty
 alert('Missing email or password');
 

async loginWithFacebook ()

const type, token  = await Facebook.logInWithReadPermissionsAsync(
'APP_ID',
 permissions: ['public_profile'] 
 );

  if(type === 'success')
  const credentials =      f.auth.FacebookAuthProvider.credential(token);
   f.auth().signInWithCredential(credentials).catch((error) => 
     console.log('Error...', error);

   );

   
  


  registerUser = (email, password) => 

console.log(email, password);
auth.createUserWithEmailAndPassword(email, password)
.then((userObj) => console.log(email,password, userObj))
.catch((error) => console.log('error logging in', error));

   

 signUserOut = () => 
auth.signOut()
.then(() => 
 console.log('Logged out...');
).catch((error) => 
console.log('Error', error);
  );
 

  render() 
    return (
    <View style=styles.container>
     <Text>Open up App.js to start working on your app!</Text>
    <Text>---------</Text>
     this.state.loggedin == true ? (
    <View>
    <TouchableHighlight
    onPress= () => this.signUserOut()
    style=backgroundColor: 'red'>
      <Text> Log Out</Text>
    </TouchableHighlight>
    <Text> Logged in...</Text>
    </View>
  ) : (
    <View>

     this.state.emailloginView == true ? (


      <View>
        <Text>Email:</Text>
        <TextInput
        onChangeText=(text) => this.setState(email: text)
        value=this.state.email />

      <Text>Password:</Text>
        <TextInput
        onChangeText=(text) => this.setState(pass: text)
        secureTextEntry=true
        value=this.state.pass
         />

    <TouchableHighlight
    onPress= () =>  this.loginUser(this.state.email,this.state.pass)
    style=backgroundColor: 'red'>
      <Text> Login</Text>
    </TouchableHighlight>

      </View>

    ) : (
      <View></View>
    )

  <TouchableHighlight 
  onPress=() => this.setState(emailloginView: true)
  style=backgroundColor: 'green'>
  <Text style=color:'white'> Login With Email</Text>
  </TouchableHighlight>

  <TouchableHighlight 
  onPress=() => this.loginWithFacebook()
  style=backgroundColor: 'green'>
  <Text style=color:'white'> Login With Facebook</Text>
  </TouchableHighlight>
  </View>
  )
</View>
  );
    
    
  const styles = StyleSheet.create(
  container: 
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
  ,
);

我正在使用内置的 IOS 模拟器和物理 iPhone 7 plus 来运行我的 expo React Native 应用程序。从昨天开始，我一直在处理这个错误。有人可以帮帮我吗？

错误截图：

【参考方案1】：

在调用 logInWitReadPermissions 之前需要添加

Facebook.initializeAsync(appId, appName);

如Expo documentation中所述

Facebook.initializeAsync(appId: string | undefined, appName: string | undefined): Promise 调用这个方法可以确保 SDK 是 初始化。您必须在调用之前调用此方法 logInWithReadPermissionsAsync 以确保 Facebook 支持 正确初始化。您可能会也可能不会提供可选的 appId： 字符串参数。如果您不提供，Facebook SDK 将尝试使用 appId 来自本机应用程序资源（在独立应用程序中，您可以 在 app.json 中定义，在 Expo 客户端中不可用并且在裸露的你 根据 iOS 的 Facebook 设置文档配置自己 和安卓）。如果找不到，则 promise 将被拒绝。 如果您提供显式 appId，它将覆盖任何其他来源。 相同的解析机制适用于 appName。