Facebook登錄不支持hello.js

Question

我已經使用create-react-app npm模塊創建了一個示例反應應用程序。然後我將hello.js添加到應用程序中，以便能夠使用此api編寫快速應用程序。我已經正確地配置了我的應用程序ID，並在facebook開發人員網站（我已經測試了這與另一個示例應用程序沒有使用hello.js，它工作正常）。

當我點擊登錄按鈕時，它會被重定向到FB登錄頁面，我輸入正確的憑證並被重定向到本地主機，但沒有成功響應。出於某種原因，這是行不通的。我無法弄清楚發生了什麼問題。

下面的代碼，如果任何人對我在做什麼錯誤的想法：

import React, { Component } from 'react'; 
import * as hello from 'hellojs'; 
import logo from './logo.svg'; 
import './App.css'; 

class App extends Component { 
    constructor() { 
    super(); 
    this.state = { 
     askForLogin: true 
    }; 

    hello.init({ 
     facebook: "XXXXXXXXXXXXXXXX" //correct api is provided here 
    }); 

    hello.api("me").then(function(r){ 
     console.log("Successful login: ", r); 
     this.setState({askForLogin: false}); 
    }, function(e) { 
     console.log("Not successful yet"); 
     this.setState({askForLogin: true}); 
    }); 
    } 

    login() { 
    const options = { display: "page" }; 
    const cb =() => { console.log("Login callback");} 
    hello.login("facebook", options, cb); 
    } 

    render() { 
    return (
     <div className="App"> 
     <div className="App-header"> 
      <img src={logo} className="App-logo" alt="logo" /> 
      <h2>Welcome to React</h2> 
     </div> 
     <p className="App-intro"> 
      To get started, edit <code>src/App.js</code> and save to reload. 
     </p> 
     { 
      this.state.askForLogin ? 
      <div> 
      <button onClick={this.login}>Login to Facebook</button> 
      </div> : <div></div> 
     } 
     </div> 
    ); 
    } 
} 

export default App; 

Answer 1

我能夠明確地告訴hello.js使用的Facebook「，解決它，它馬上工作。發佈答案，以便如果其他人面臨問題，它可能會幫助他們：

import React, { Component } from 'react'; 
import * as hello from 'hellojs'; 
import logo from './logo.svg'; 
import './App.css'; 

class App extends Component { 
    constructor() { 
    super(); 
    this.state = { 
     askForLogin: true 
    }; 

    hello.init({ 
     facebook: "XXXXXXXXXXXXXXX" 
    }); 

    const facebook = hello.use("facebook"); //This is the new line 

    facebook.api("me").then(function(r){ 
     console.log("Successful login: ", r); 
     this.setState({askForLogin: false}); 
    }.bind(this), function(e) { 
     console.log("Not successful yet"); 
     this.setState({askForLogin: true}); 
    }.bind(this)); 
    } 

    login() { 
    const options = { display: "page"}; 
    const cb =() => { console.log("Login callback");} 
    hello.login("facebook", options, cb); 
    } 

    render() { 

    return (
     <div className="App"> 
     <div className="App-header"> 
      <img src={logo} className="App-logo" alt="logo" /> 
      <h2>Welcome to React</h2> 
     </div> 
     <p className="App-intro"> 
      To get started, edit <code>src/App.js</code> and save to reload. 
     </p> 
     { 
      this.state.askForLogin ? 
      <div> 
      <button onClick={this.login}>Login to Facebook</button> 
      </div> : <div></div> 
     } 
     </div> 
    ); 
    } 
} 

export default App;