Ionic 2 Facebook Login – 'App Not Setup' & 'Not Logged in' & 'Given URL is not allowed' Errors – Facebook api

I am trying to implement the Facebook Login API from the Ionic Native library, and have a button in my application that opens up the Facebook login window. However, when that window opens on my iOS device, the following error first appeared.

Then, I began receiving a new error after executing the following commands in terminal:

$ ionic plugin add cordova-plugin-facebook4 --variable APP_ID="123456789" --variable APP_NAME="myApplication"
$ npm install --save @ionic-native/facebook

This issue finally resolved itself after 1 day of inactivity, and then I made my app public by clicking on this in the App Review tab of the Facebook Developers site.

Now, I am receiving yet another error, which should have been fixed by making the app public. Here is the error:

App Not Setup: The developers of this app have not set up this app properly for Facebook Login.

Here is the relevant code for this implementation. I have made sure to include the correct APP ID in all relevant variables, and the code, itself, is not causing any errors. It is simply the case that the login is not communicating with my app.

In package.json:

 {
  "name": "twine-app",
  "author": "Anthony Krivonos",
  "homepage": "http://ionicframework.com/",
  "private": true,
  "scripts": {
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve"
  },
  "dependencies": {
    "@angular/animations": "^4.0.1",
    "@angular/common": "^4.0.1",
    "@angular/compiler": "^4.0.1",
    "@angular/compiler-cli": "^4.0.1",
    "@angular/core": "^4.0.1",
    "@angular/forms": "^4.0.1",
    "@angular/http": "^4.0.1",
    "@angular/platform-browser": "^4.0.1",
    "@angular/platform-browser-dynamic": "^4.0.1",
    "@angular/platform-server": "^4.0.1",
    "@angular/router": "^4.0.1",
    "@ionic-native/core": "^3.4.4",
    "@ionic-native/facebook": "^3.4.4",
    "@ionic/cloud-angular": "^0.11.0",
    "@ionic/storage": "1.1.7",
    "angular2-elastic": "^0.13.0",
    "firebase": "^3.7.5",
    "ionic-angular": "2.2.0",
    "ionic-native": "^2.9.0",
    "ionicons": "3.0.0",
    "reflect-metadata": "^0.1.10",
    "rxjs": "^5.2.0",
    "sw-toolbox": "3.4.0",
    "typescript": "^2.2.2",
    "zone.js": "0.7.2"
  },
  "devDependencies": {
    "@ionic/app-scripts": "1.1.4",
    "typescript": "2.0.9"
  },
  "cordovaPlugins": [
    "cordova-plugin-whitelist",
    "cordova-plugin-statusbar",
    "cordova-plugin-console",
    "cordova-plugin-device",
    "cordova-plugin-splashscreen",
    "ionic-plugin-keyboard"
  ],
  "cordovaPlatforms": [],
  "description": "Twine: An Ionic project",
  "version": "0.0.1",
  "main": "index.js",
  "repository": {
    "type": "git",
    "url": "git+https://[email protected]/twine-app/twine-app.git"
  },
  "license": "ISC"
}

In app.component.ts:

platform.ready().then(() => {
        let env = this;
        NativeStorage.getItem('user')
        .then(function (data) {
              env.nav.push(FeedPage);
              Splashscreen.hide();
        }, function (error) {
              env.nav.push(OnboardingPage);
              Splashscreen.hide();
        });
              StatusBar.styleDefault();
              StatusBar.overlaysWebView(false);
              Splashscreen.hide();
  });

In onboarding.ts (Code by Sampath):

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { Facebook, FacebookLoginResponse } from '@ionic-native/facebook';


@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  constructor(public fb: Facebook) {

  }

  fbLogin(): void {
    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));
  }

}

I have scoured several different websites and forums for solutions, and seemed to have come up with no way of fixing this error. Most answers suggest to add a new platform in the Facebook developer portal with the app’s Site URL, but my app runs off localhost. Additionally, I have installed all necessary plugins. Does anyone understand what may be causing this issue? Thank you so much in advance.

Edit: DO NOT suggest that I should make the app public via the Facebook Developer portal, because my question clearly outlines that I have done so already. Thanks.

Edit 2: I have tried Sampath‘s solution, and login works perfectly. This reaffirms that there is an issue with the above code. However, I cannot seem to pinpoint it after days of work. Here’s a screenshot.