The problem that I am currently unable to solve is bad response from IDP
and the cause is supposed to be the lack of mode=select
but I'm unaware now about the page where the mode=select
must be implemented
As a matter of fact I have added the code into two separated pages, the first one is index.php which does the following:
<script type="text/javascript" src="//www.gstatic.com/authtoolkit/js/gitkit.js"></script>
<script type="text/javascript">
var config = {
apiKey: 'AIzaSyAaMAfu7S2AITODrGJzVkIYBXlZR3FYhuQ',
signInSuccessUrl: 'http://www.lascuolacheverra.org/signin?mode=select', // i tried to add the `mode=select here`
signInOptions: ["google", "password"],
idps: ["Google", "AOL", "Microsoft", "Yahoo", "Facebook"],
oobActionUrl: '/',
siteName: 'La scuola che verrà A.P.S.',
// Optional - function called after sign in completes and before
// redirecting to signInSuccessUrl. Return false to disable
// redirect.
// callbacks: {
// signInSuccess: function(tokenString, accountInfo,
// opt_signInSuccessUrl) {
// return true;
// }
// },
// Optional - key for query parameter that overrides
// signInSuccessUrl value (default: 'signInSuccessUrl')
// queryParameterForSignInSuccessUrl: 'url'
// Optional - URL of site ToS (linked and req. consent for signup)
tosUrl: 'http://www.lascuolacheverra.org/privacypolicy.html',
// Optional - URL of callback page (default: current url)
// callbackUrl: 'http://example.com/callback',
// Optional - Cookie name (default: gtoken)
// NOTE: Also needs to be added to config of the ‘page with
// sign in button’. See above
// cookieName: ‘example_cookie’,
// Optional - UI configuration for accountchooser.com
acUiConfig: {
title: 'Sign in to lascuolacheverra.org',
favicon: 'http://www.lascuolacheverra.org/favicon.ico',
branding: 'http://www.lascuolacheverra.org/images/lascuolacheverra.jpg'
},
// Optional - Function to send ajax POST requests to your Recover URL
// Intended for CSRF protection, see Advanced Topics
// url - URL to send the POST request to
// data - Raw data to include as the body of the request
//completed - Function to call with the object that you parse from
// the JSON response text. {} if no response
/*ajaxSender: function(url, data, completed) {
},
*/
};
// The HTTP POST body should be escaped by the server to prevent XSS
window.google.identitytoolkit.start(
'#gitkitWidgetDiv', // accepts any CSS selector
config,
'{{ POST_BODY }}');
</script>
<!-- End modification -->
The second part of the code is in another index.php and does the following:
<!DOCTYPE html>
<html>
<head>
<!-- Copy and paste here the "Sign-in button javascript" you downloaded from Developer Console as gitkit-signin-button.html -->
<script type="text/javascript" src="//www.gstatic.com/authtoolkit/js/gitkit.js"></script>
<link type=text/css rel=stylesheet href="//www.gstatic.com/authtoolkit/css/gitkit.css" />
<script type=text/javascript>
window.google.identitytoolkit.signInButton(
'#navbar', // accepts any CSS selector
{
widgetUrl: "/widget",
signOutUrl: "/",
}
);
</script>
<!-- End configuration -->
</head>
<body>
<!-- Include the sign in button widget with the matching 'navbar' id -->
<div id="navbar"></div>
<!-- End identity toolkit widget -->
<p>
{{ CONTENT }}
</p>
</body>
</html>
I would like to know how I have to proceed in order to correctly use mode=select
since as of today Identity Toolkit is available to my homepage but I can't use it to the fullest because of this bug.
You need to create two pages. Let's say url1 and url2.
url1 where you include your sign in button by running:
window.google.identitytoolkit.signInButton()
Set widgetUrl to url2
In url2 where you render the widget by running:
window.google.identitytoolkit.start()
Set the signInSuccessUrl to url1
Do not add ?mode=select to widget url. On sign in button click, it will automatically append it to that url and redirect there.
Well, I was just encountering the same error "Error code: Bad response from IDP."
As stated in the comments above there are two possibilites:
"?mode=select"
to the url as a query parameterRedirect in your routes, for example on
The gitkit.js extracts it from the browsers
window.location.href
.This should not point to the
/signin
page. Maybe point it to/
or/signed-in
.Also, remove
I did some testing with this, and if I add signInOptions, then idps is ignored and you end up only being able to sign in with google and password.
Apparently only using signInOptions is the way to do it. I've read idps instead of signInOptions in other examples, and I'm using idps with success.
Update I misread the code a bit. I thought
\signin
was the page showing the widget, which the tutorials place under\widget
. My mistake because in my project I'm replacing\widget
with\secure-sign-in
. So, if your\signin
page is not the\widget
page then your code was already OK. And in any case you should remove the?mode=select
because this is only used for the\widget
and is added automatically by thewindow.google.identitytoolkit.signInButton
function.