Facebook Login - Object Error

@duzinxd1 wrote:

Hi everyone! I recently started developing ionic, and I’m still learning, and now I’ve faced an issue:
I’ve followed this tutorial: https://ionicframework.com/docs/native/facebook but it doesn’t seem to work, I tried to find solutions online but none of them worked… can someone help me?

My login.ts

import { Component, OnInit } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';
import { IonicPage, NavController, ToastController } from 'ionic-angular';
import { User } from '../../providers';
import { MainPage } from '../';
import { HttpClient } from '@angular/common/http';
import { Facebook, FacebookLoginResponse } from '@ionic-native/facebook/ngx';

@IonicPage()
@Component({
  selector: 'page-login',
  templateUrl: 'login.html',
})
export class LoginPage implements OnInit {
  // The account fields for the login form.
  // If you're using the username field with or without email, make
  // sure to add it to the type
  account: { usuario: string, password: string } = {
    usuario: '',
    password: ''
  };

  constructor(public navCtrl: NavController,
    public user: User,
    public toastCtrl: ToastController,
    public translateService: TranslateService,
    public http: HttpClient,
    private fb: Facebook) {}
  ngOnInit(){}

  // Attempt to login in through our User service
  doLogin() {
    this.user.login(this.account).subscribe((resp) => {
      this.navCtrl.push(MainPage);
    }, (err) => {
      this.navCtrl.push(MainPage);
    });
  }

  doFbLogin(){
    this.fb.login(['public_profile', 'user_friends', 'email'])
    .then((res: FacebookLoginResponse) => console.log('Logged into Facebook!', res))
    .catch(e => console.log('Error logging into Facebook', e));
	}

}

login.html button

<button ion-button class=“button-login-facebook” (click)=“doFbLogin()”>Facebook

and my package.json

{
  "name": "aaaaaaaaaaaaaaaaa",
  "version": "0.0.1",
  "author": "Ionic Framework",
  "homepage": "http://ionicframework.com/",
  "private": true,
  "scripts": {
    "start": "ionic-app-scripts serve",
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "lint": "ionic-app-scripts lint"
  },
  "dependencies": {
    "@angular/animations": "5.2.11",
    "@angular/common": "5.2.11",
    "@angular/compiler": "5.2.11",
    "@angular/compiler-cli": "5.2.11",
    "@angular/core": "5.2.11",
    "@angular/forms": "5.2.11",
    "@angular/http": "5.2.11",
    "@angular/platform-browser": "5.2.11",
    "@angular/platform-browser-dynamic": "5.2.11",
    "@ionic-native/camera": "4.3.3",
    "@ionic-native/core": "~4.20.0",
    "@ionic-native/facebook": "^5.17.0",
    "@ionic-native/native-storage": "^5.0.0",
    "@ionic-native/splash-screen": "~4.20.0",
    "@ionic-native/status-bar": "~4.20.0",
    "@ionic/storage": "2.2.0",
    "@ngx-translate/core": "8.0.0",
    "@ngx-translate/http-loader": "^2.0.0",
    "cordova": "^9.0.0",
    "cordova-android": "^8.1.0",
    "cordova-plugin-facebook4": "^6.2.0",
    "cordova-plugin-nativestorage": "^2.3.2",
    "es6-promise-plugin": "^4.2.2",
    "ionic-angular": "3.9.5",
    "ionic-plugin-navigation-bar-color": "^1.0.2",
    "ionicons": "^3.0.0",
    "rxjs": "5.5.11",
    "sw-toolbox": "3.6.0",
    "ts-md5": "^1.2.4",
    "zone.js": "0.8.29"
  },
  "devDependencies": {
    "@ionic/app-scripts": "3.2.2",
    "@ionic/lab": "2.0.13",
    "cordova-plugin-device": "^2.0.2",
    "cordova-plugin-ionic-keyboard": "^2.1.3",
    "cordova-plugin-ionic-webview": "^4.1.1",
    "cordova-plugin-navigationbar-color": "0.0.8",
    "cordova-plugin-splashscreen": "^5.0.2",
    "cordova-plugin-statusbar": "^2.4.2",
    "cordova-plugin-whitelist": "^1.3.3",
    "typescript": "~2.6.2"
  },
  "description": "An Ionic project",
  "cordova": {
    "plugins": {
      "cordova-plugin-whitelist": {},
      "cordova-plugin-statusbar": {},
      "cordova-plugin-device": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-ionic-webview": {
        "ANDROID_SUPPORT_ANNOTATIONS_VERSION": "27.+"
      },
      "cordova-plugin-ionic-keyboard": {},
      "cordova-plugin-navigationbar-color": {},
      "cordova-plugin-facebook4": {
        "APP_ID": "erased cause I dont know if u guys can see this haha",
        "APP_NAME": "cookcrawler",
        "FACEBOOK_HYBRID_APP_EVENTS": "false",
        "FACEBOOK_ANDROID_SDK_VERSION": "5.5.2"
      },
      "cordova-plugin-nativestorage": {}
    },
    "platforms": [
      "android"
    ]
  }
}

The error i’m getting:

ERROR TypeError: Object(...) is not a function
    at Facebook.login (index.js:62)
    at LoginPage.webpackJsonp.351.LoginPage.doFbLogin (login.ts:41)
    at Object.eval [as handleEvent] (LoginPage.html:73)
    at handleEvent (core.js:13589)
    at callWithDebugContext (core.js:15098)
    at Object.debugHandleEvent [as handleEvent] (core.js:14685)
    at dispatchEvent (core.js:10004)
    at core.js:10629
    at HTMLButtonElement.<anonymous> (platform-browser.js:2628)
    at t.invokeTask (polyfills.js:3)

Facebook configs are ok, dependencies installed with appname and appid ok too.
Is probably a version error, but I dont know, please save meeeee!!!

Posts: 1

Participants: 1

Read full topic