Integrating Facebook login with Cordova using the cordovaOauth plugin

Encountering issues while setting up FB login for my cordova mobile app.

A tutorial followed: http://www.codeproject.com/Tips/1031475/How-to-Integrate-Facebook-Login-into-a-Cordova-App#_comments

<script src="js/angular.js"></script>
<script src="js/ng-cordova.js"></script>
<script src="cordova.js"></script>

ng-cordova and angular added via bower. JavaScript files placed in www folder, this code appended to index.html:

Snippet from app.js :

var app = angular.module('myApp', ['ngCordova']);

app.controller("OAuthCtrl", function($scope, $cordovaOauth){
   $scope.facebookLogin = function() {

    alert("Click");
    
    $cordovaOauth.facebook("1232456", 
    ["email"]).then(function(result) {
        alert(result.access_token);
        
    }, function(error) {
        alert("error");
        alert(error);
        
    });
}
})

In index.html :

<body data-ng-app="myApp">
<div ng-controller="OAuthCtrl">
   <label >
       <button class="button button-block button-positive" 
       ng-click="facebookLogin()">
           Login with Facebook
       </button>
   </label>
</div>
</body>

Program compiles and executes without errors. However, the button is unresponsive. Assistance needed. Double checked installation of AngularJS using:

Answer №1

Your code is missing the installation of the ng-cordova-oauth plugin. To fix this, you need to install ng-cordova-oauth using bower, which will also install all necessary dependencies.

Next, include the following in your index.html file:

<script src="lib/ngCordova/dist/ng-cordova.min.js"></script>
<script src="lib/ng-cordova-oauth/dist/ng-cordova-oauth.js"></script>
<script src="cordova.js"></script>

Add the dependencies like so:

var app = angular.module('myApp', ['ngCordova','ngCordovaOauth']);

For a detailed guide on complete installation, refer to Adding Google Plus Login to Ionic App

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Implementing jQuery and JavaScript validation for email addresses and usernames

Are the online validations being used incorrectly or is there a serious issue with them? I came across an example of a site using jQuery validation, but when I entered "44" for a name and ##@yahoo.com for an email address, no warning appeared. I haven&apo ...

Progression from Angular2-rc1 to Angular2-rc2 encounters TypeScript error: anticipating ',' (TS1005)

Encountering an issue with upgrading Angular2 from RC1 to RC2, following exception is being thrown: Here's my main.ts file, I haven't made any changes to it during the upgrade process. Line 13 is where the bootstrap method is called. import {pr ...

If a condition is present, the checkbox in the list needs to be unchecked

I have a query that relates to my previous question: Checkbox and ng-change. Need to uncheck if condition exists The previous solution worked for a single checkbox, but now I am dealing with a list of checkboxes: <tr ng-repeat="part in partstoorder"& ...

Position divs to be perfectly aligned and centered

I'm in the process of creating a webpage and facing challenges with aligning my divs properly, specifically the animated company logos. I want them to be positioned side by side rather than on top of each other, with space in between to fit the layou ...

Adjust the alignment and floating of text within an iframe on the same domain

Is it possible to align text on the right side of an iframe that contains a width and text inside? The iframe's src is from the same domain. If so, how can this be achieved through JavaScript? ...

What is the best way to strip out a changing segment of text from a string?

let: string str = "a=<random text> a=pattern:<random text (may be fixed length)> a=<random text>"; In the given string above, let's assume that a= and pattern are constants. It is possible that there may or may not be a ...

Using AngularJS to send a request to Devise (backend) for resetting a password

I need assistance implementing password reset functionality from AngularJS (front end) to Rails (back end). Currently, the JSON I am sending does not match the hash structure that would typically be sent from a pure rails application, and I have been stru ...

What could be causing the Lock Screen audio controls to vanish once I pause the AVAudioPlayer?

I have implemented the use of an instance of AVAudioPlayer to play an audio file in my application. The setup includes playing audio in the background and ensuring the appropriate audio session is configured. Additionally, I am successfully receiving remot ...

Deactivate the ability to hold a button, but still permit clicking in HTML for mobile

I am currently developing a progressive web app for mobile devices. One feature I have implemented is the ability for users to long-press a button with their finger, triggering a popup menu that includes options like "copy link address," "copy text," and " ...

Step-by-Step Guide: Running Multiple Yo Angular-Fullstack Applications on the Same Server and Port

On my development server, I have been experimenting with various applications. Currently, I am interested in running multiple yo angular-fullstack applications simultaneously on the same server, each having their own sub-directory. For instance, navigati ...

A computer program designed to determine a series of numbers needed to complete a square grid

Given the numbers 1, 2, 3, 4, 5, 6, 7, 8, I am seeking to replace the x's in such a way that each side adds up to the number in the center. *-*---*-* |x| x |x| *-*---*-* |x| 12|x| *-*---*-* |x| x |x| *-*---*-* Initially, I have iterated over the num ...

Angularjs is struggling to connect data to the user interface

It seems that the array is not binding properly in the UI. In the HTML code, I am using dataTables. The variable $scope.successMessage is also not binding to the UI. I have tried multiple approaches but none seem to be working. Here is a snippet of th ...

What is the process of displaying JSON response data in AngularJS?

I am attempting to retrieve URL information using get_meta_tags in Laravel and then display it in my AngularJS application. However, the issue is that the response is returned in the following format: Array ( [title] => Mercy Badshah Full HD [d ...

Transferring a DOM element to a different window while preserving event listeners in Internet Explorer 11

I am tasked with creating a webpage feature that allows users to detach a section of the page and move it to a new window on a second monitor, then reattach it back to the main page. The detached section must retain its state and event listeners during the ...

Enhancing Bootstrap with VueJS for better component ordering

I've been struggling with Vue components in Bootstrap lately. I am attempting to create collapsible Bootstrap content in Vue, and here is the current code: HTML <div class="col-sm main-content" id="main-content"> <p&g ...

The filter functionality is not functioning properly in AngularJS

Currently, I am working on an AngularJS extension and encountering an issue with the filter functionality. In the popup page of my extension, there is a button. Upon clicking this button, the ancestor node of the button gets blocked, and its relevant info ...

The Angular Node server is responding with the error message "You have entered 'undefined' instead of a stream."

Using angular 9 + universal has been smooth sailing until I encountered an issue after building the app with npm run build:ssr and attempting to run it using node: node dist/app/server/main.js. The error message that popped up in the terminal was: Node ...

Utilize ng-repeat to display a series of images, with the first image being placed within a unique div

My challenge lies in displaying product images using ng-repeat, where one image is located in a separate div. Let me share my code and explain what is happening. The API response provides product details and images [{"id_product":"1000","name":"Nikolaus ...

What is the best way to refresh a page after rotating the web page?

Struggling with a challenge in Next JS - can't seem to figure out how to automatically refresh the page when it rotates const app () => { useEffect(()=>{ window.addEventListener("orientationchange", function() { window.locati ...

What is the method for setting the content-type in an AJAX request for Android browsers?

I am facing an issue with my ajax call to the Rails server. The response from the server varies between HTML and JSON based on the content type. Surprisingly, this works smoothly on iPhone and desktop browsers like Chrome, but I am encountering a problem o ...