Facebook Login Example

How-to Discussions
1

I am trying the facebook login example but I am getting a weird error while previewing on ios

LOG: Error: JavaScript call error in MainView.js line 39: Name: ReferenceError
Error message: Can’t find variable: fetch
File name: MainView.js
Line number: 39
JS stack trace: Funone@MainView.js:39:6
getMe@MainView.js:71:9
pageLoaded@MainView.js:29:8
in Fuse.Reactive.EventBinding.CallClosure</Users/mostafa/Library/Application Support/Fusetools/Packages/Fuse.Reactive/0.42.4/$.uno:786>

2

Ive had this before.

Try uno clean in your root project directory.
Update to the latest FuseTools.

If this does not work then create a new Fuse project and copy your code over to it file by file.
These are a few simple things you can try to determine if the problem exists in your code.

3

You could try with the native facebook module. I think it’s easier to implement.

<App>
  <JavaScript>
    var FacebookLogin = require("FacebookLogin");

    function login() {
      FacebookLogin.login().then(function(user) {
        console.log(JSON.stringify(user));
        // {"id":"XXXXXXXXX","email":"XXXCX@hotmail.com","name":"Jesús Martínez"}
      }, function(err) {
        console.log("Login failed: " + err);
      });
    }

    module.exports = {
      login: login,
    };
  </JavaScript>
  <DockPanel>
    <StatusBarBackground Dock="Top" />
    <StackPanel>
      <Button Text="Login with Facebook" Clicked="{login}" />
    </StackPanel>
  </DockPanel>
</App>
4

@jesusmartinoza: I have tried the native facebook login but the thing is when I try your code console.log(JSON.stringify(user)); it returns empty array and before that an error says can’t save access token to NSUserDefaults so any thoughts about that?

also about the facebook login example by webview seems like fetch function isn’t working on ios as in safari doesn’t recognize fetch as ecmascript function and it consider that as a variable.

5

Well wow its not working as well on android and gives the same error, fetch is not defined =/

6

Here is my repo for this app https://github.com/heavenchains/FacebookLoginWeb
and this is the error I get : “Can’t find variable: fetch”

7

Please provide as much information as possible, i.e. complete output from the console/monitor.

8

Here is what I get from the monitor:

LOG: Final URI: https://www.facebook.com/connect/login_success.html#access_token=EAAC2ScHN4mMBACbRgZCBZCc77GliH45HHBLZBYd0ZA9yKbZAZBCTEOu1rIkZBWmvZAWsrLrif1IyZBR4t96JIsng2RYJ5zK7HwPAM59HSkuiuh53TpoxyE1hubAWg8e6yfKjM9LzHdZBRpzGbmkmcTNr3PUzyRT3pDebMZD&expires_in=5168374
LOG: Error: JavaScript call error in MainView.js line 39: Name: ReferenceError
Error message: Can’t find variable: fetch
File name: MainView.js
Line number: 39
JS stack trace: Funone@MainView.js:39:6
getMe@MainView.js:71:9
pageLoaded@MainView.js:29:8
in Fuse.Reactive.EventBinding.CallClosure</Users/mostafa/Library/Application Support/Fusetools/Packages/Fuse.Reactive/0.42.4/$.uno:786>

9

@Heavenchains You are using code that is deprecated, this is not how you include other JavaScript files https://github.com/heavenchains/FacebookLoginWeb/blob/master/MainView.ux#L4
Read this on how to use Bundle and require https://www.fusetools.com/docs/fusejs/fusejs#importing-modules

10

@Anders Bondehagen yeah I modified it and its not working so yeah, it’s not the problem because I have downloaded your facebooklogin from examples and tried to put my appID into it and it gives me the same error and this error is on iOS and Android thats for one.

for two: the NativeFacebookLogin it works fine I login and it redirects but it returns empty values I dunno how,

  function login() {
      FacebookLogin.login().then(function(user) {
         console.log(JSON.stringify(user));
       // {"id":"XXXXXXXXX","email":"XXXCX@hotmail.com","name":"Jesús Martínez"}
  }, function(err) {
    console.log("Login failed: " + err);
  });
}

it returns login success but when I console.log(JSON.stringify(user)); it returns {} and that is really weird.

11

I’ve implemented NativeFacebookLogin several ways in Android. The empty object sounds weird, would you mind send me your API key through fusecommunity.slack.com?

12

I have the same issue as @Heavenchains above, e.g. a “{ }” result of JSON.stringify(user)

Wondering if it has to do with settings for the specific Facebook account trying to login…

13

This works: https://github.com/jesusmartinoza/fuse-samples/tree/feature-NativeFacebookLogin/Samples/NativeFacebookLogin

This doesn’t: https://github.com/fusetools/fuse-samples/tree/feature-NativeFacebookLogin/Samples/NativeFacebookLogin