Hello friends ajj me apko btaunga ki kis parkar ham javascript ka use karke google login kar sakte hai.
Steps1- create a javascript file love.js
love.js
function Success() {
gapi.client.load('plus', 'v1', function () {
var request = gapi.client.plus.people.get({'userId': 'me'});
//for display user detail
request.execute(function (resp) {
var profileHTML = '<a href="javascript:void(0);" onclick="signOut();"><h3>Sign out</h3></a>';
profileHTML += ''+resp.emails[0].value+'';
$('.userContent').html(profileHTML);
alert("welcome here You are Login with Javascript!");
});
});
}
//this is for rendering after success
function renderButton() {
gapi.signin2.render('gSignIn', {'onsuccess': Success});
}
//this function is used for signout
function signOut() {
var auth2 = gapi.auth2.getAuthInstance();
auth2.signOut().then(function () {
$('.userContent').html('<font color="red">You are Logged Out Successfully</font>');
alert("your are redirect to logout if u want logout then click on ok!");
});
}
Step2- create a login.html file
Login.html
<!DOCTYPE html>
<html lang="en">
<head>
<script src="jquery.min.js"></script>
<meta name="google-signin-client_id" content="690553206748-snb29kb4s9rfnejbrgv0nfjfmbd805lq.apps.googleusercontent.com">
<script src="love.js"></script>
<script src="https://apis.google.com/js/client:platform.js?onload=renderButton" async defer></script>
</head>
<body>
<div id="gSignIn"></div>
<div class="userContent"></div>
</body>
</html>
Yanha apko sirf
<meta name="google-signin-client_id" content="690553206748-snb29kb4s9rfnejbrgv0nfjfmbd805lq.apps.googleusercontent.com">
Me apke dwara create kiye gye google app ki client id enter karke code save kar dena hai
Is parkar aap easily 2 minutes me login with google (javascript) ka option apne website me add kar sakte ho.
Aap image,gendr etc be display karwa sakte ho niche diye gye code ka use kerke-
profileHTML += '<img src="'+resp.image.url+'"/><div class="proDetails"><p>'+resp.displayName+'</p><p>'+resp.emails[0].value+'</p><p>'+resp.gender+'</p><p>'+resp.id+'</p><p><a href="'+resp.url+'">View Google+ Profile</a></p></div></div>';
aap code me diye gye profileHTML ka code remove karke upper diya gya code wanha paste kar de .esa karke aap user ki other information,email,name,gender,id etc display karwa sakte ho ,
agar apko koi problem a rhe hai to aap comment me puch sakte ho.
Thank You
Team Gajabwap Web In Hindi
Comments
Post a Comment