angularfire: auth.login() Error "location.protocol" must be http or https

auth.login() has an error when attempting to authenticate with Google or Facebook on an iOS or Android device using Cordova.

Here is a code sample:

this.af.auth.login({
  provider: AuthProviders.Google,
  method: AuthMethods.Popup
}).then((value) => {
  //success
}).catch((error) => {
  console.log(error);
});

Running version 2.0.0-beta.3-0930330 of angularfire2.

When run in a Cordova app the error callback will be called with this message:

screenshot_2016-06-23-15-04-51

About this issue

Original URL
State: closed
Created 8 years ago
Reactions: 5
Comments: 55 (7 by maintainers)

Most upvoted comments

does it make sense to add some Help Wanted! or other label to raise the importance/severity? looks like this is actually a blocker for ionic/phonegap apps.

+23

ciekawy on Jul 8, 2016

I don’t know who is developing AngularFire2 but the problem is on the Firebase side.

I contact the Firebase team and this the answer: Are you using popup / redirect sign in methods in Firebase 3.x.x? If so, these methods are currently not supported in native Ionic/Cordova apps. Sorry about that. As a workaround, I recommend to use a library for OAuth such as ngCordova(in Cordova and Ionic apps) and then use auth().signInWithCredential(…) to sign your users in.

+11

cnothegger on Jul 12, 2016

@Lindstrom1989 @jgw96 This solution using ionic-native facebook plugin to get the accessToken, creates the credential and then successfully logs in using angularFire2 https://github.com/aaronksaunders/basicaf2

aaronksaunders on Jul 16, 2016

some news?

hernanbruno97 on Jan 24, 2017

https://market.ionic.io/starters/firebase-v3-auth-social-kit-2 This solved my problem completely

hernanbruno97 on Jan 24, 2017

https://javebratt.com/ionic-social-login-firebase/ Follow this guide…It worked for me

fluentwait on Jul 16, 2017

Some news?

valterh4ck3r on Jan 20, 2017

Some news?

richarddiogo on Oct 31, 2016

signInWithRedirect seems to have the same issue than signInWithPopup()

quentinchap on Jun 25, 2016

@edzillion the method signInWithPopup don’t work with cordova/ionic, you should use the signInWithRedirect method.

dpassis on Jun 24, 2017

@Chuckv01 thx for the quick reply.

I was not able to make this plugin working with ionic 2. I’ve only found examples that uses angular 1 not angular 2, so i was not able to import the right module to get the plugin to work.

If someone manage to get ionic2 working with angularfire2/firebase google auth and could post a little piece of code, i would appreciate it

mateusmcg on Jul 24, 2016

@aaronksaunders thanks for the solution, but in my project here i’m not able to use facebook auth only the google one.

So i need to use google authentication that firebase offers with ionic2. There is a workaround for that? (i’m getting that “location.protocol” must be http or https error on login)

mateusmcg on Jul 24, 2016

Yikes, seems like signInWithPopup() has the same protocol check as getRedirectResult(). https://firebase.google.com/docs/reference/js/firebase.auth.Auth#signInWithPopup

I’m a little out of my depth here on what the right way to solve this is…

jeffbcross on Jun 25, 2016

Solution: the issue was corrected in the latest Firebase JavaScript SDK release (4.1.3)

Firebase JavaScript SDK Release Notes

dpassis on Jun 24, 2017

https://market.ionic.io/starters/firebase-v3-auth-social-kit-2 This solved my problem completely

what enviroment do you use?. In the comments sections the author says it not works in ionic view.

alheranx on Feb 6, 2017

15 $? so hard ;s

I will try :" I can’t implement signInWithCredential with google, then i used the facebook auth for my app… This is my workaround."

2017-01-27 16:33 GMT-02:00 Diego Borges (diegobdev) < notifications@github.com>:

I work with Ionic 2.2, Cordova 6.5 and Firebase v3 and have same error using “let provider = new firebase.auth.GoogleAuthProvider(); firebase.auth().signInWithPopup(provider)” or “let provider = new firebase.auth.FacebookAuthProvider(); return firebase.auth().signInWithPopup(provider)” : Error: {“code”:“auth/operation-not-supported-in-this-environment”,“message”:“This operation is not supported in the environment this application is running on. “location.protocol” must be http or https and web storage must be enabled.”}

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/angular/angularfire2/issues/279#issuecomment-275738722, or mute the thread https://github.com/notifications/unsubscribe-auth/AD8sqXThRh1IyUSN_iF_vzR86x7aFZPmks5rWjhogaJpZM4I9Siw .

richarddiogo on Jan 27, 2017

I sent a email from support firebase,

They answer me with the email :

When you’re building an ionic/cordova app (or any app that is running in an environment outside of a browser), then using any of these operations: signInWithPopup(), signInWithRedirect(), linkWithPopup(), and linkWithRedirect() will not work because they do not have a real domain name. Currently the solution to this is to use an OAuth library and then use signInWithCredential(). You can view a similar example here for implementing twitter login.

Hope that helps.

Best Regards, Aye

I can’t implement signInWithCredential with google, then i used the facebook auth for my app… This is my workaround…

valterh4ck3r on Jan 24, 2017

I guess that it’s not about the cordova but about a use case of app loaded from file - there is rather no reason why it should not be supported. And also this was working with firebase 2 (togheter with i.e. https://github.com/ciekawy/angular2-firebase) so this is kind of regression for people moving to new recommended firebase 3 SDK

ciekawy on Jul 11, 2016