The index.html file should have the following contents:
Start defining the HTML file with a DOCTYPE declaration and the <html> tag:
<!DOCTYPE html>
<html>
The <head> section of the HTML file should have contents as follows:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>QNA Time</title>
<script src="https://apis.google.com/js/platform.js" async defer></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/aws-sdk/2.390.0/aws-sdk.min.js"></script>
<meta
name="google-signin-client_id"
content="1056864857699-i6ami0u5oevpn9bro2k3r095jtqohdi7.apps.googleusercontent.com"
/>
</head>
Start defining a <script> section with the following variables:
<script type="text/javascript">
var id_token;
var identity;
var cognitoidentity = new AWS.CognitoIdentity({ region: "us-east-1" });
Define the getCredentials method to get the access token from Cognito:
function getCredentials() {
var params1 = {
IdentityId: identity,
Logins: {
"accounts.google.com": id_token
}
};
cognitoidentity.getCredentialsForIdentity(params1, function(err, data) {
if (err) console.log(err, err.stack);
else {
console.log(data);
console.log(data.Credentials.AccessKeyId);
}
});
}
Add an onSignIn method that will be invoked on the success of Google authentication. This method is specified within the HTML body:
function onSignIn(googleUser) {
id_token = googleUser.getAuthResponse().id_token;
console.log("google_id_token:" + id_token);
var params = {
IdentityPoolId:
"us-east-1:f36a0555-fd35-43d6-bafa-187ecdef0f04" /* required */,
Logins: {
"accounts.google.com": id_token
}
};
cognitoidentity.getId(params, function(err, data) {
if (err) console.log(err, err.stack);
// an error occurred
else {
console.log(data);
identity = data.IdentityId;
getCredentials();
}
});
}
</script>
Add the HTML body:
<body>
<span style="text-align:center;"><h1>Welcome to QNA TIME</h1></span>
<form>
<div
style="width:200px;"
class="g-signin2"
data-onsuccess="onSignIn"
></div>
</form>
</body>