Как отменить доступ без выхода из Google API JavaScript?
У меня есть домен, скажем, test.com. У меня есть два приложения, test.com/app1 и test.com/app2. У меня есть два client_id для обоих приложений из консоли разработчика Google. Они были разработаны на основе демонстрационного приложения от Google. Мой код точно такой же, но отличаются только идентификаторы клиентов. Я сталкиваюсь со следующей проблемой,
Когда я подключаюсь / вхожу в одно приложение, в него также входит другое приложение, хотя у них разные идентификаторы клиентов. Когда я выхожу из одного приложения, другое приложение также выходит из системы. Моя идея состояла в том, чтобы отозвать доступ, и во время копания я обнаружил, что есть способ отозвать доступ с помощью вызова разъединения. Но это делает то же самое. Он выходит из системы и отменяет доступ. Могу ли я проигнорировать выход и просто отозвать доступ? Как я подозреваю, потому что я использую gapi.client.init, клиент Google такой же, и он выходит из всех приложений за один раз. Или есть способ справиться с этим без использования gapi.client.init? Что-то вроде gapi.auth2.authorize?
Проблема может быть воспроизведена, если следующий код скопирован с правильными идентификаторами клиента.
Мой код
app1
<div id="loading-spinner" style="display: none;">
<img src="<% static_url('/backend_static/common/img/leave/spinner.gif')%>" width="40px" height="40px">
Syncing your calendar with Google! <br/>
</div>
<span id="google-calendar-success" style="display: none;">✔ Successfully synced with Google calendar!</span>
<button id="create-google-events" style="display: none;" onclick="handleAndCreateEvents('2017-11-25', '2017-11-26', '')">Create Event</button>
<button id="google-login" style="display: none;" onclick="login()">Add to Google Calendar</button>
<script async defer src="https://apis.google.com/js/api.js"
onload="this.onload=function(){};handleClientLoad()"
onreadystatechange="if (this.readyState === 'complete') this.onload()">
</script>
<script type="text/javascript">
var CLIENT_ID = 'xxxxxxxxx.apps.googleusercontent.com';
var DISCOVERY_DOCS = ["https://www.googleapis.com/discovery/v1/apis/calendar/v3/rest"];
var SCOPES = "https://www.googleapis.com/auth/calendar";
var BUTTON_ADD_TO_GOOGLE_CALENDAR = document.getElementById("create-google-events");
var BUTTON_GOOGLE_LOGIN = document.getElementById('google-login');
var DIV_LOADING_SPINNER = document.getElementById("loading-spinner");
var DIV_CALENDAR_UPDATE_SUCCESS = document.getElementById('google-calendar-success');
function handleClientLoad() {
gapi.load('client:auth2', initClient);
}
function initClient() {
gapi.client.init({
discoveryDocs: DISCOVERY_DOCS,
clientId: CLIENT_ID,
scope: SCOPES
}).then(function () {
// Listen for sign-in state changes.
gapi.auth2.getAuthInstance().isSignedIn.listen(createGoogleCalendarEvent);
// Handle the initial sign-in state.
createGoogleCalendarEvent(gapi.auth2.getAuthInstance().isSignedIn.get());
});
}
function login() {
gapi.auth2.getAuthInstance().signIn();
}
function createGoogleCalendarEvent(isSignedIn) {
if (isSignedIn) {
BUTTON_GOOGLE_LOGIN.style.display = 'none';
BUTTON_ADD_TO_GOOGLE_CALENDAR.click();
} else {
BUTTON_GOOGLE_LOGIN.style.display = 'block';
}
}
function handleAndCreateEvents(start_date, end_date, comment){
if(gapi.auth2.getAuthInstance().isSignedIn.get()) {
DIV_LOADING_SPINNER.style.display = 'block';
setTimeout(function(){
googleCalendarPushRequest(start_date, end_date, comment);
DIV_LOADING_SPINNER.style.display = 'none';
DIV_CALENDAR_UPDATE_SUCCESS.style.display = 'block';
}, 3000);
}
}
function googleCalendarPushRequest(start_date,end_date, comment) {
var start = start_date + "T8:00:00.000";
var end = start_date + "T18:00:00.000";
//format of until : 20170809T170000Z
var until = end_date.replace(/\-/g, '');
until += "T170000Z";
comment = (typeof comment === 'undefined' || comment == "") ? "Leave Plan" : comment;
var timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
timezone = (typeof timezone === 'undefined' || timezone == "") ? "Europe/Berlin" : timezone;
var event = {
'summary': comment,
'location': 'On Leave',
'description': 'Generated by Lassie',
"start": {
"dateTime": start,
"timeZone": timezone
},
"end": {
"dateTime": end,
"timeZone": timezone
},
"recurrence": [
"RRULE:FREQ=DAILY;UNTIL=" + until,
]
};
var request = gapi.client.calendar.events.insert({
'calendarId': 'primary',
'resource': event
});
request.execute();
}
</script>
app2
<div id="authorize-button" style="display: none;">
<button class="wbso-btn">Connect Google Calendar</button>
<span class="tooltip" original-title="Imports events from your Google Calendar. Feedback? Wiki: go/:m1"><i class="tooltip-icon">i</i></span>
</div>
<div id="signout-button" style="display: none;">
<button class="wbso-btn">Disconnect Google Calendar</button>
<span class="tooltip" original-title="Sign out to stop importing events. If events are not loaded, refresh the page. Still facing issues? Wiki: go/:m1"><i class="tooltip-icon">i</i></span>
</div>
<div class="loader" id="loading" style="display: none;"></div>
<script async defer src="https://apis.google.com/js/api.js"
onload="this.onload=function(){};handleClientLoad()"
onreadystatechange="if (this.readyState === 'complete') this.onload()">
</script>
<script type="text/javascript">
var CLIENT_ID = 'yyyyyyyyyy.apps.googleusercontent.com';
//var CLIENT_ID = 'yyyyyyyyyy.apps.googleusercontent.com'
var DISCOVERY_DOCS = ["https://www.googleapis.com/discovery/v1/apis/calendar/v3/rest"];
var SCOPES = "https://www.googleapis.com/auth/calendar";
var authorizeButton = document.getElementById('authorize-button');
var signoutButton = document.getElementById('signout-button');
function handleClientLoad() {
gapi.load('client:auth2', initClient);
}
function initClient() {
gapi.client.init({
discoveryDocs: DISCOVERY_DOCS,
clientId: CLIENT_ID,
scope: SCOPES
}).then(function () {
// Listen for sign-in state changes.
gapi.auth2.getAuthInstance().isSignedIn.listen(updateSigninStatus);
// Handle the initial sign-in state.
updateSigninStatus(gapi.auth2.getAuthInstance().isSignedIn.get());
authorizeButton.onclick = handleAuthClick;
signoutButton.onclick = handleSignoutClick;
});
}
function updateSigninStatus(isSignedIn) {
if (isSignedIn) {
authorizeButton.style.display = 'none';
signoutButton.style.display = 'block';
listRelevantEvents();
} else {
authorizeButton.style.display = 'block';
signoutButton.style.display = 'none';
}
}
/**
* Sign in the user upon button click.
*/
function handleAuthClick(event) {
gapi.auth2.getAuthInstance().signIn();
}
/**
* Sign out the user upon button click.
*/
function handleSignoutClick(event) {
gapi.auth2.getAuthInstance().disconnect();
}
function substractdays(str, days) {
var myDate = new Date(str);
myDate.setDate(myDate.getDate() - parseInt(days));
return myDate;
}
/**
* Get events for last 10 days
*/
function listRelevantEvents() {
$("#loading").show();
gapi.client.calendar.events.list({
'calendarId': 'primary',
'timeMax': new Date().toISOString(),
'timeMin': (substractdays(new Date().toISOString(),10)).toISOString(),
'showDeleted': false,
'singleEvents': true,
'orderBy': 'startTime'
}).then(function(response) {
var events = response.result.items;
var events_data = [];
if (events.length > 0) {
for (i = 0; i < (events.length); i++) {
var event = events[i];
var startTime = event.start.dateTime;
var id = event.id, date = startTime, description = event.summary, duration;
if (!startTime) {
// if its an all-day event
// Currently, not adding all day events.
/**
startTime = event.start.date;
date = startTime;
duration = 480;
events_data.push({"event_id": id, "date": date, "description": description, "duration": duration});
**/
}
else{
duration = (new Date(event.end.dateTime) - new Date(startTime))/60000;
events_data.push({"event_id": id, "date": date, "description": description, "duration": duration});
}
}
events_data = JSON.stringify(events_data);
saveData({"calendar_events_json_obj":events_data});
}
});
}
var statusCodes = {
204: function() { alert("204 No Content"); },
400: function() { alert("400 Bad Request"); },
403: function() { alert("403 Forbidden"); },
418: function() { alert("418 I'm a teapot (RFC 2324)"); },
500: function() { alert("500 Internal Server Error"); },
503: function() { alert("503 Service Unavailable"); }
};
function saveData(formData) {
var request = $.ajax({
url: "save_calendar_events.html",
dataType: "json",
cache: false,
data: formData,
statusCode: statusCodes,
type: "POST",
complete: function(data) {
//check for navigation time API support
if (window.performance) {
if (performance.navigation.type == 1) {
$("#loading").hide();
} else {
window.location.reload(); }
}
},
success: function (data) {
hideAllErrorsWarnings();
if("error" in data) { processError(data); }
else {
if("warning" in data) {
processWarning(data);
}
processData(data);
}
}
});
return true;
}
</script>