AngularFire Google OAuth failing to retrieve the user's email address

I am trying to retrieve the email address from Google OAuth using AngularFire, but the popup is not requesting permission for the email.

This code snippet is from the Firebase Google authentication documentation

var ref = new Firebase("https://<your-firebase>.firebaseio.com");
ref.authWithOAuthPopup("google", function(error, authData) { /* Your Code */ }, {
  scope: "email"
});

While this works in my Angular application, I'm looking for a way to modify my angular code to achieve the same result.

var ref = new Firebase("https://<your-firebase>.firebaseio.com");
var auth = $firebaseAuth(ref);
auth.$authWithOAuthPopup("google").then(function(authData) {
   /* Implement your logic here */
}).catch(function(error) {
   console.error("Authentication failed:", error);
});

You can refer to this link for a similar issue with an answer, although it didn't provide a clear solution on how to fix it.

Answer №1

Have you attempted to pass in the options?

var database = new Firebase("https://<your-firebase>.firebaseio.com");
var authentication = $firebaseAuth(database);
authentication.$authWithOAuthPopup("google", { scope: 'email' }).then(function(authData) {
   /* Your code here */
}).catch(function(error) {
   console.error("Authentication failed:", error);
});

Kato also mentioned that this information is available in the documentation: link

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

What is the best way to update setState when triggering an onChange event?

Here is the code snippet for a React component that handles cryptocurrency selection: import React, { Component } from 'react'; import { Select } from 'antd'; import { connect } from "react-redux"; class SelecionarCrypto extends Compo ...

The AngularJS dropdown will automatically close once any changes are made to the $location.search parameters

I am currently working on an online store project. Within this project, there is a directive titled "horizontalShoppingByCategoriesLayout" which keeps track of the filter criteria that users apply to search for products. As users modify these filter option ...

AngularJS: Show the value of a key in a textarea when hovering over it

My AngularJS code includes a dictionary, structured like this: $scope.examples = [ {name: 'Key 1', value: "1"}, {name: 'Key 2', value: "2"}, {name: 'Key 3', value: "3"} ]; To display all three keys in the documen ...

"Threads snap as soon as they begin to be put to use

Encountering an issue with the command yarn run serve, the error log states: $ vue-cli-service serve INFO Starting development server... 10% building 2/2 modules 0 activeevents.js:173 throw er; // Unhandled 'err ...

Implementing a dynamic autosuggest feature using jQuery and AJAX

I'm currently working on implementing an auto-suggest feature for dynamically added input boxes. While everything functions smoothly with static input types, I encounter issues when attempting to achieve the same functionality with dynamic inputs. Bel ...

"Maximizing User Experience with Single Page Applications and RESTful APIs

Utilizing hypermedia is crucial for a truly RESTful API, as it allows clients to navigate through the application using dynamic hyperlinks provided by the server (also known as HATEOAS). While this concept works well for web applications, how can it be ap ...

The index "is_ajax" has not been defined

I attempted to create a simple login functionality using Ajax. Following a tutorial that didn't use classes and functions in PHP, I tried restructuring the code with classes and functions. However, I encountered the error: Undefined index: is_ajax He ...

The formControl value is not being shown on the display

I am facing an issue with a form that has multiple fields created using formGroup and formControlName. The challenge arises when I launch the application and need to retrieve data from the back end to display it on the view. The specific problem I'm ...

I am puzzled by the issue with my logic - the button only changes once and then the onclick function ceases to work

I am having an issue with a button that should switch between displaying temperatures in Fahrenheit and Celsius when clicked. It works for the first two clicks, but on the third click, it stops working even though I've set the class back to .temp. $( ...

Optimizing HTML/CSS performance: Comparing flexbox and tables for handling extensive datasets

Creating a React table component with hundreds of lines and variable cell widths can be complex. Would it be better to implement this using flexbox or a traditional table structure in HTML/CSS? ...

The state redirection feature in Ionic allows for nesting within a tab component,

Is there a way to ensure that the button in the contact tab redirects to “tabs.facts” properly? The following scenarios exist: .state('tabs.home', { url: "/home", views: { 'home-tab': { templateUrl: "templates/home.h ...

Utilize the key-value pair from ng-repeat to expand the scope of the expression

In an attempt to utilize the key value from ng-repeat as an extension of another scope.arrayResult, I aim to achieve arrayResult.q1/q2/q3 etc... <ul ng-repeat="(key,x) in data"> <li><h4>Question: {{x}}</h4> <p>{{ ar ...

Loading screen featuring symbol percentage

https://i.sstatic.net/Ksogp.jpg How can I create a loading panel that includes a percentage symbol? I have searched for solutions but most of them suggest using a spinner. However, I specifically need a panel with the % symbol included. Is it possible to ...

ways to deliver a message from server to client's body

Here is the Java server code I am using: private Response createError(int code, String error) { logger.error(error); return Response.status(code).entity("{ \"errorMsg\": \""+error+"\"}").build(); } And this is the client code: ...

Error Encountered When Trying to Import BrowserAnimationsModule in Angular 5: Unexpected Token "<"

As I try to integrate the BrowserAnimationModule into my Angular 5 project, a rather foolish error keeps popping up. Error: (SystemJS) Unexpected token < SyntaxError: Unexpected token < at eval (<anonymous>) at Object.eval ...

Oops! The state ' ' is having trouble resolving the 'app.history' - let's try to find a solution for this error

I am in the process of writing a unit test that utilizes $stateProvider. The code snippet below shows both the code and its corresponding test file. However, when I try to execute it, an error occurs stating "Error: Could not resolve 'app.history&apos ...

Using AngularJS ng-repeat within a modal pop-up

Can someone help me with an issue I'm having? I want to display the details of a single person in a modal when a button is clicked on the table. However, my code currently displays the details of everyone. Here's what I have: <div id="myModal ...

When using the `Node fs.readstream()` function, the output includes `<Buffer 3c 3f 78 6d 6c ...>`, which is not in a readable

Handling a large XML file (~1.5gb) in Node Js by streaming it to process data in chunks has proven challenging due to the complexity of the documentation. A simple code snippet I am currently using is: var fs = require('fs'); var stream = fs.c ...

Error encountered while trying to implement sleep function in script

Good evening. I've been attempting to implement the sleep function from the system-sleep library, but my script keeps crashing. This is the code snippet I'm working with: page.html <html lang="en"> <head> <meta charset= ...

Can you explain how this particular web service uses JSON to display slide images?

{ "gallery_images": [ {"img":"http://www.jcwholesale.co.uk/slider_img/big/1_1433518577.jpg"}, {"img":"http://www.jcwholesale.co.uk/slider_img/big/1_1433519494.jpg"}, {"img":"http://www.jcwholesale.co.uk/slider_img ...