-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
77 lines (75 loc) · 3.61 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Index page</title>
</head>
<body>
<div id="user_token"></div>
<div id="user_info" style="margin-top:20px;"></div>
<script src="js/crypto.js"></script>
<script src="js/stringvalue.js"></script>
<script>
///// Authentication Process /////
if (location.hostname === "localhost" || location.hostname === "127.0.0.1") {
document.body.innerHTML = '<h1>Please use a domain.</h1>';
} else {
if (!localStorage.getItem("zalo_access_token")) {
let state = generate_state_param(); // for CSRF prevention
// Generate the code verifier and code challenge
let codes = generate_pkce_codes();
// Store the request state to be checked in auth.html
localStorage.setItem("zalo_auth_state", state);
// Store the code verifier to be used in auth.html
localStorage.setItem("zalo_code_verifier", codes.verifier);
let auth_uri = ZALO_PERMISSION_URL + "?" + new URLSearchParams({
app_id: APP_ID,
redirect_uri: APP_AUTH_URL,
code_challenge: codes.challenge,
state: state, // <- prevent CSRF
}).toString();
window.location.replace(auth_uri);
} else {
// Store the INITIAL access token in a JavaScript constant.
const initialToken = localStorage.getItem("zalo_access_token");
alert(initialToken);
const user_access_token = JSON.parse(initialToken).access_token;
document.getElementById("user_token").innerHTML = "access_token = " + user_access_token;
// Display information of user
fetch("https://graph.zalo.me/v2.0/me?fields=id,name,picture",
{
headers: {
access_token: user_access_token
}
}).then(response => response.json())
.then(data => {
let user_info = "";
if (data.message.toLowerCase() === "success") {
user_info = `<table style="border:none;border-top:1px solid black;">
<tr>
<td>id:</td>
<td>${data.id}<td>
</tr>
<tr>
<td>name:</td>
<td>${data.name}</td>
</tr>
<tr>
<td>picture:</td>
<td><img src="${data.picture.data.url}" alt="avatar" width="120" height="120"></td>
</tr>
</table>`;
} else {
user_info = "Cannot get user info";
}
document.getElementById("user_info").innerHTML = user_info;
});
// Remove the access token in localStorage
localStorage.removeItem("zalo_access_token");
}
}
</script>
<!-- START THE MAIN APP -->
</body>
</html>