Vào liên kết: https://console.cloud.google.com/projectcreate
Tạo dự án mới
Vào mục: APIs and services -> OAutho consent screen
Vào tìm mục Configure Consent Screen -> External (cho người ngoài sử dụng)
Cấp quyền cho lấy thông tin email.
.../auth/userinfo.email
.../auth/userinfo.profile
Sau đó public app
Tạo 1 Create OAuth client ID
Type là App Webaplication
Authorised redirect URLs: sau khi đăng nhập thành công
Sau bước tạo Create OAuth bạn cần có thông tin:
Client ID: là 1 chuổi có dạng xxxx-xxxxxx.apps.googleusercontent.com
Nếu bạn làm bằng javascript hãy tìm ra link dưới (Bạn nên tham khảo trược tiếp nhà phát triển google vì api có thể cập nhật theo thời gian)
https://developers.google.com/identity/protocols/oauth2/javascript-implicit-flow?hl=vi
Đưa đoạn lệnh sau vào
var CLIENT_ID="603591966546-u9599alur4m8oojsrdt2voarhclm5os4.apps.googleusercontent.com";
function oauthSignIn() {
var oauth2Endpoint = 'https://accounts.google.com/o/oauth2/v2/auth';
var form = document.createElement('form');
form.setAttribute('method', 'GET');
form.setAttribute('action', oauth2Endpoint);
var params = {'client_id': CLIENT_ID,
'redirect_uri': 'https://iif.vn',
'response_type': 'token',
'scope': 'https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/userinfo.profile',
'include_granted_scopes': 'true',
'state': 'pass-through value'};
for (var p in params) {
var input = document.createElement('input');
input.setAttribute('type', 'hidden');
input.setAttribute('name', p);
input.setAttribute('value', params[p]);
form.appendChild(input);
}
document.body.appendChild(form);
form.submit();
}
const getToken= () =>{
searchParams = new URLSearchParams(window.location.search);
tk= searchParams.get("access_token");
return tk;
}
//alert("chao ${getToken}");
const getUserInfor= async() =>
{
const tk = getToken();
if(tk!=null)
{
//url="https://www.googleapis.com/oauth2/v3/tokeninfo?access_token="+tk
url="https://www.googleapis.com/oauth2/v3/userinfo?access_token="+tk
alert(url);
const respone = await fetch(url);
//alert(respone);
const data = await respone.json();
alert(data.email);
alert(data.picture);
}
}
getUserInfor();
Giải thích: Lấy thông tin email hình đại diện qua googlo api
tìm: get user info from access token google
Cấu trúc api google trả về json (chạy url có chứa token)
{
"sub": "11112222333",
"name": "PhanMemInHoaDon .COM",
"given_name": "PhanMemInHoaDon",
"family_name": ".COM",
"picture": "https://lh3.googleusercontent.com/a/ACg8ocKnTnFeg8feVIkQE9zvjUrs3lZbzaEDPX3f4LFDD67rfTg34Q\u003ds96-c",
"email": "phanmeminhoadon.com@gmail.com",
"email_verified": true
}
Đăng nhập bằng Google với javascript