-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathquickstart-modified.html
143 lines (126 loc) · 5.08 KB
/
quickstart-modified.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
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
<!-- Modify from:
https://github.com/googleworkspace/browser-samples/blob/c056755f6d559eca34368b890d8aa3c593162106/sheets/quickstart/index.html
-->
<!DOCTYPE html>
<html>
<head>
<title>Sheets API Quickstart</title>
<meta charset="utf-8" />
<script src="https://apis.google.com/js/api.js"></script>
<script src="https://accounts.google.com/gsi/client"></script>
</head>
<body>
<p>Sheets API Quickstart</p>
<div id="buttonDiv"></div>
<script type="text/javascript">
// from https://stackoverflow.com/questions/38552003/how-to-decode-jwt-token-in-javascript-without-using-a-library
function parseJwt (token) {
var base64Url = token.split('.')[1];
var base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/');
var jsonPayload = decodeURIComponent(window.atob(base64).split('').map(function(c) {
return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
}).join(''));
return JSON.parse(jsonPayload);
};
console.log(`Add buttons to initiate auth sequence and sign out.`);
const authorize_button = document.createElement('button'),
signout_button = document.createElement('button'),
refresh_button = document.createElement('button'),
content = document.createElement('pre');
authorize_button.innerHTML = 'Authorize';
signout_button.innerHTML = 'Sign Out';
refresh_button.innerHTML = 'Refresh';
content.style.whiteSpace = 'pre-wrap';
document.body.appendChild(authorize_button);
document.body.appendChild(signout_button);
document.body.appendChild(refresh_button);
document.body.appendChild(content);
console.log(`api.js is loaded.`);
gapi.load('client', async () => {
// Loads the discovery doc to initialize the API after the API client is loaded.
await gapi.client.init({
// Set to API key from the Developer Console
apiKey: 'AIzaSyCRfe3-dnm9GGMH_PFm9m5WHBMb_8U9HXY',
// Discovery doc URL for APIs used by the quickstart
discoveryDocs: ['https://sheets.googleapis.com/$discovery/rest?version=v4'],
});
});
console.log(`Google Identity Services are loaded.`);
tokenClient = google.accounts.oauth2.initTokenClient({
ux_mode: "redirect",// NOT WORKING
login_uri: "http://localhost/quickstart-modified.html",
// Set to client ID from the Developer Console
client_id: '289902636224-oro06s681gdgk1kqrv8o1oca2shocfr4.apps.googleusercontent.com',
// Authorization scopes required by the API; multiple scopes can be included, separated by spaces.
scope: 'https://www.googleapis.com/auth/spreadsheets.readonly',
callback: async resp => {
console.log(resp);
if (resp.error !== undefined) throw resp;
// https://developers.google.com/identity/gsi/web/guides/display-button
google.accounts.id.initialize({
ux_mode: "redirect",
login_uri: "http://localhost/quickstart-modified.html",
client_id: "289902636224-oro06s681gdgk1kqrv8o1oca2shocfr4.apps.googleusercontent.com",
callback: response => console.log(parseJwt(response.credential))
});
google.accounts.id.renderButton(
document.getElementById("buttonDiv"), { theme: "outline" } // customization attributes
);
google.accounts.id.prompt(); // also display the One Tap dialog
await listMajors();
}
});
console.log(`Sign in the user upon button click and page load.`);
authorize_button.onclick = onload = () => tokenClient.requestAccessToken();
console.log(`Sign out the user upon button click.`);
signout_button.onclick = () => {
const token = gapi.client.getToken();
if (token !== null) {
google.accounts.oauth2.revoke(token.access_token);
gapi.client.setToken('');
content.innerText = '';
}
}
console.log(`
Print the content of the spreadsheet:
https://docs.google.com/spreadsheets/d/1uPs6CBFz1edahBCSY8HzUTmippmlutsDuhFfvM1tsiw
`);
const listMajors = refresh_button.onclick = async () => {
let response;
try {
response = await gapi.client.sheets.spreadsheets.values.get({
spreadsheetId: '1uPs6CBFz1edahBCSY8HzUTmippmlutsDuhFfvM1tsiw',
range: '同學資料!B2:F',
});
} catch (err) {
content.innerText = err.message;
return;
}
const range = response.result, rv = range.values;
if (!range || !rv || rv.length == 0) {
content.innerText = 'No values found.';
return;
}
for(let i=-1; ++i < rv.length-1;){
const x = rv[i];
for(const y of rv.slice(i+1)) if(y[0] === x[0]){
for(let j=0; ++j < 5;){
// console.log(x,y);
if(!y[j] && x[j])
y[j] = x[j];
}
rv.splice(i--,1);
break;
}
}
// Flatten to string to display
content.innerText =
rv.reduce(
(str, row) => `${str}${row[0]}, ${row[1]}, ${row[2]}, ${row[3]}, ${row[4]}\n`,
'科系, 姓名, 學號, 電話, 座位\n'
);
console.log(rv);
}
</script>
</body>
</html>