Recently I added login/register screen in my app but whenever I try to login then google re-captcha pop-up comes up. I want to hide this and login directly without verify google re-captcha.
Below is my code for this:
<FirebaseRecaptchaVerifierModal
ref={recaptchaVerifier}
firebaseConfig={firebaseConfig}
attemptInvisibleVerification={attemptInvisibleVerification}
/>
Using expo firebase recaptcha module:
import { FirebaseRecaptchaVerifierModal } from 'expo-firebase-recaptcha';
captcha verification by setting the attemptInvisibleVerification to true
const attemptInvisibleVerification = true
or put directly true in the attemptInvisibleVerification attribut
<FirebaseRecaptchaVerifierModal
ref={recaptchaVerifier}
firebaseConfig={firebaseConfig}
attemptInvisibleVerification={true}
/>
Related
As in new version of Cypress they have fixed the issue related to cy.origin and user is able to handle with google signin process. But on pressing next button after providing password, google display this error show in image link https://ibb.co/zxQnXYb. It could be google is not recognising this session or any thing esle. how we can handle this scenario?
here is my code
cy.visit("http://accounts.lambdatest.com/dashboard")
cy.get("[href='/login/google']").click()
cy.origin("https://accounts.google.com/", ()=>{
cy.get("#identifierId").type("myusername")
cy.get("span").contains("Next").click()
cy.wait(3000)
Cypress.on('uncaught:exception', (err) => !err.message.includes('ResizeObserver loop limit exceeded'))
cy.get("[name='password']").type("mypassword")
cy.get("span").contains("Next").click()
I am developing a React Native app. It is a very simple app. I just have to load a website on a webview, which is perfectly done. but my client wants something which I am not sure how to do.
There are some social media buttons on the website. like facebook, twitter etc. so my client wants me to open social media app while user tap on them. suppose user tapped on facebook button then the facebook app will load.
I badly need to know the solution. please help me. thanks in advance.
Make use of onMessage.
Code is untested but you should get the gist of what it's trying to achieve.
Webpage:
function facebookClick() {
window.postMessage("Facebook button done got clicked");
}
var _fb_button = document.getElementById("your-facebook-button");
_fb_button.addEventListener("click", facebookClick, false);
WebView:
[...]
import { Linking } from 'react-native';
[...]
<WebView
onMessage={(event) => {
let message = event.nativeEvent.data;
if(message.includes("Facebook button done got clicked"))
Linking.openURL('fb://page/PAGE_ID');
}}
[...]
You'll have to check out the current protocol's details of each of the social apps you're trying to open via deeplink. Once you've done that, you can further improve your code with Linking.canOpenURL
My app needs a login page from external url.
The login logic that I thought is :
Steps
Open external url when ionic is launched
Once user logged in, move back to internal app using deep link (ex : myapp://main)
I tested step 2 which is deep link. Works well.
So, I have to make step 1 now.
First, I tested with iframe.
And got Refused to display 'https:....' in a frame because it set 'X-Frame-Options' to 'deny'. error. Seems this needs a server-side configuration. But anyway we don't want to use this way. iframe feels like a hack.
Second, I tried location.href = this.loginUrl;.
Worked well in chrome browser but when I built in iOS simulator, I see address bar, tool bar, and close button.
I don't like this because I don't want user to close login page or to change url address.
Third, tried window.open(this.loginUrl, '_self', 'location=no').
Same result as second.
Fourth, tried to use ionic version of in-app-browserplugin.
But the result is same as second and third.
It still opens a browser with address bar, tool bar even it shows 'back to myApp'. So user would feel this is out of app.
Check here, people are looking for the solution still.
After spending a day, I don't even know if there is option I can try.
I could resolve by doing this. But in real device.
Xcode iPhone emulators don't have open in-app-browser but built-in browser.
browser:any;
this.platform.ready().then(() => {
this.browser = this.iab.create(this.loginUrl, '_blank', 'location=no,toolbar=no');
});
You can solve this by installing a cordova plugin called cordova-plugin-inappbrowser. Execute the following commands:
ionic plugin add cordova-plugin-inappbrowser
npm install --save #ionic-native/in-app-browser
On your app.module.ts add
import { InAppBrowser } from '#ionic-native/in-app-browser';
and also add the following to your providers in app.module.ts
providers: [
StatusBar,
SplashScreen,
InAppBrowser,
{provide: ErrorHandler, useClass: IonicErrorHandler}
]
Then on your home.ts add
import { InAppBrowser } from '#ionic-native/in-app-browser';
and inject it into the constructor like this
constructor(public navCtrl: NavController, private iab: InAppBrowser) {
}
then add the following method
ionViewDidLoad(){
this.iab.create('url', '_self', { location: 'no' }); }
Check the different options you have for this plugin here
For removing the address bar just use the option:
location: Set to yes or no to turn the InAppBrowser's location bar on or off.
I am trying to upgrade my firebase GAS webapp, and previously I had a popup which would log the user in with Google. I'm not sure what I'm doing wrong, but I have upgraded to the new firebase, and am now trying to get the same login working with the new code format.
What is happening, is that the popup comes up and immediately disappears. Can anyone see what I am doing wrong here?
Thanks for you help.
<html lang="en">
<head>
<script src="https://www.gstatic.com/firebasejs/3.1.0/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/3.1.0/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/3.1.0/firebase-database.js"></script>
<script>
var config = {
apiKey: "",
authDomain: "",
databaseURL: "",
storageBucket: ""
};
firebase.initializeApp(config);
</script>
</head>
<body>
<label id="name">First Name</label>
<script>
var provider = new firebase.auth.GoogleAuthProvider();
firebase.auth().signInWithPopup(provider).then(function(result) {
var user = result.user;
document.getElementById("name").value = user;
}).catch(function(error) {
console.log(error);
});
</script>
</body>
</html>
The problem is solved. I got onto the wonderful people at Firebase, and Dane and I worked through it all till it worked. My code was fine, the issue was in the credentials. If you have the same issue, are all the steps we went through:
Google Configuration
Go to this link google developers console
Go to the credentials option on the left hand side of the screen
Click Browser API Key and copy it
Ensure the API key you copied is the same as the API key in your web app configuration. If it doesn't match, replace the api key in your code with the API key that you copied
Under 'OAuth 2.0 client IDs', click 'Web client (auto created by Google Service)'
Navigate to 'Authorised JavaScript origins' section
Add the full URL you're accessing when you're testing the page, or to be sure, a more general one like https://script.google.com/*
Click on the oAuth web application
For authorized javascript origins please add .firebaseapp.com
For authorized redirect URIs please add .firebaseapp.com/__/auth/handler
Click 'Web client (auto created by Google Service)'
Copy the Client ID and Client Secret
Go to the sign In method page of Firebase Console
Click Google
Click Web SDK configuration
Update the Client ID and Secret with the values you obtained
Click save
Firebase Configuration
Go to this firebase console
Select your project, click on the Auth option on the left hand side of the screen, then select sign in method at the top of the screen
Scroll down to the OAuth redirect domains and see if your custom domain is listed
If not, click Add domain, input your custom domain and click Add
Open Google Chrome and go to the page where your app is deployed.
Right click the page and select 'Inspect'
You will see a Console tab and a down arrow (looks like an inverted triangle). - Click the down arrow and select 'userHtmlFrame (...)'
In the terminal (blue arrow pointing to the right), paste 'window.location.hostname' and click enter
A string will be displayed. Copy it and add it to the authorized domains from your Firebase console (Auth > Sign-in Method> OAuth redirect domains).
I got the same problem , it worked fine while debugging in localhost, but when trying to login from "https://www.example.com" the popup disappear imediately, I fixed it by adding "mydomain.com" in firebase console -> Authentication ->SIGN-IN METHOD tab: scroll down to "OAuth redirect domains"
and click "ADD DOMAIN"
Here is the bare minimum I found needed to get client side auth working in Apps Script. I created a new firebase project. I enabled Google sign-in provider. I added the webapp's origin to the OAuth redirect domain list. I get this by launching the webapp and looking in dev tools inspector. Under the elements tab it will be the src of the top level iframe. It will look something like: n-rn4a4ioahvqauYhvzh2nktp3vxnuap6y7htmacq-0lu-script.googleusercontent.com
code.gs
function doGet() {
return HtmlService.createHtmlOutputFromFile('index')
}
index.html
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
</body>
<script src="https://www.gstatic.com/firebasejs/3.2.0/firebase.js"></script>
<script>
// Initialize Firebase
var config = {
apiKey: "AIzaSyADzG0boXmVUJb07K5NbCC0c6SrP8x3Msk",
authDomain: "testclientauth-57c09.firebaseapp.com",
databaseURL: "https://testclientauth-57c09.firebaseio.com",
storageBucket: "testclientauth-57c09.appspot.com",
};
firebase.initializeApp(config);
</script>
<script>
var provider = new firebase.auth.GoogleAuthProvider();
provider.addScope('https://www.googleapis.com/auth/plus.login');
firebase.auth().signInWithPopup(provider).then(function(result) {
var token = result.credential.accessToken;
var user = result.user;
console.log(user)
}).catch(function(error) {
var errorCode = error.code;
var errorMessage = error.message;
var email = error.email;
var credential = error.credential;
});
</script>
</html>
I was just struggling, try to debug around the code and find if there is any wrong in javascript but could find nothing. Then base on answer from Kat, I thought it could not be that complicated, and it might come from some configuration mistakes in firebase website. So go into firebase configuration for your app, in the tab Authentication, there is Sign-in method and there it is, all log-in methods to my app was disabled.
I enabled google authentication and boom, it works as expected. It is also amazed how easy it is for setup authentication system for my app using firebase. Thanks guys from firebase :-)
I've built a captive portal for some routers I've configured with a Radius server, so when a customer tries to login, they're faced with a login screen (think McDonalds situation)... Facebook being one of the options to login with.
This all works on Google Chrome, the problem is with Safari.
Safari on Mac or iPhone I've learnt tries to reach http://www.apple.com/library/test/success.html and if it doesn't return the word "success" Apple/Safari then knows it's a captive portal situation so tries to help out by popping up a (Safari) window where you can login.
My problem is that Facebook has some popup's of it's own, and these aren't working in Safari's popup window (they work through Safari's main browser):
If you're not logged in, Facebook will popup a login to Facebook window.
If you are logged in with Facebook, but the App is not authorised, a pop up will show asking you to click OK and check permissions to authorise.
I've overcome point 1, by instead redirecting the user to the Facebook login window that can return back to my website, but I've not overcome point 2.
Here's how I've overcome point 1.
FB.getLoginStatus(function(response) {
//statusChangeCallback(response);
var uri = encodeURI('MY WEBSITE');
if (response.status === 'connected') {
location.reload();
} else if(response.status === 'unknown') {
window.location = encodeURI("https://www.facebook.com/dialog/oauth?client_id=1543071895971445&redirect_uri="+uri+"&response_type=token");
} else {
//can't avoid the Facebook 'authorise app' popup that doesn't work on Apple captive portal popup.
FBSignup();
}
In the else statement above, FBSignup() calls the FB.login function that brings up the authorise popup.
Is there a way I can overcome point 2 by presenting the user with a method to authorise the app without a popup? I'm also using the Facebook PHP SDK if something there can help?
Alternatively accepted answer would be to help me resolve why I the Facebook popups don't work in the captive portal assistant that apple brings up.
I solved this by using the PHP v5.0 SDK to instead generate a Facebook URL to redirect the user to, which doesn't bring any popups, so is Apple captive-portal friendly. You can also request permissions through this redirect, here's how.
$fb = new Facebook\Facebook([
'app_id' => fbappid,
'app_secret' => fbappsecret,
'default_graph_version' => 'v2.2',
]);
$helper = $fb->getRedirectLoginHelper();
$permissions = ['email', 'user_birthday', 'user_location', 'user_hometown', 'user_relationships']; // Optional permissions
$loginUrl = $helper->getLoginUrl('http://localhost/urbanportal/wifilogin.php?origlink='.$_SESSION['origlink'].'&routerlink='.$_SESSION['routerlink'].'&siteid='.$_SESSION['siteid'], $permissions);