Я много чего пытался перевести так:
<code> <!DOCTYPE html>
<html>
<head>
<title>Gmail API Quickstart</title>
<meta charset='utf-8' />
</head>
<body>
<p>Gmail API Quickstart</p>
<!--Add buttons to initiate auth sequence and sign out-->
<button id="authorize-button" style="display: none;">Authorize</button>
<button id="signout-button" style="display: none;">Sign Out</button>
<pre id="content">
// Идентификатор клиента и ключ API из консоли разработчика
var CLIENT_ID = '';
// Массив URL-адресов документов для обнаружения API для API, используемых при быстром запуске
var DISCOVERY_DOCS = ["
https://www.googleapis.com/discovery/v1/apis/gmail/v1/rest"];
// Области авторизации, требуемые API; несколько областей могут быть
// включено, разделено пробелами.
var SCOPES = '
https://www.googleapis.com/auth/gmail.readonly';
var authorizeButton = document.getElementById ('кнопка авторизации');
var signoutButton = document.getElementById ('кнопка для выхода');
/ **
* При загрузке вызывается для загрузки библиотеки auth2 и клиентской библиотеки API.
* /
function handleClientLoad () {
gapi.load ('client: auth2', initClient);
}
/ **
* Инициализирует клиентскую библиотеку API и устанавливает состояние входа
* слушатели.
* /
function initClient () {
gapi.client.init ({
discoveryDocs: DISCOVERY_DOCS,
clientId: CLIENT_ID,
область применения: ОБЛАСТИ ПРИМЕНЕНИЯ
}). then (function () {
// Прослушивание изменений состояния входа.
. Gapi.auth2.getAuthInstance () isSignedIn.listen (updateSigninStatus);
// Обработка начального состояния входа.
updateSigninStatus (gapi.auth2.getAuthInstance () isSignedIn.get ().);
authorizeButton.onclick = handleAuthClick;
signoutButton.onclick = handleSignoutClick;
});
}
/ **
* Вызывается при изменении статуса входа в систему для обновления пользовательского интерфейса.
* соответственно. После входа вызывается API.
* /
function updateSigninStatus (isSignedIn) {
if (isSignedIn) {
authorizeButton.style.display = 'none';
signoutButton.style.display = 'block';
listLabels ();
} еще {
authorizeButton.style.display = 'block';
signoutButton.style.display = 'none';
}
}
/ **
* Войдите в систему после нажатия кнопки.
* /
function handleAuthClick (event) {
. Gapi.auth2.getAuthInstance () зарегистрировались ();
}
/ **
* Выход пользователя после нажатия кнопки.
* /
function handleSignoutClick (event) {
. Gapi.auth2.getAuthInstance () SignOut ();
}
/ **
* Добавить элемент pre к телу, содержащему данное сообщение
* как его текстовый узел. Используется для отображения результатов вызова API.
*
* @param {string} message Текст для размещения в предварительном элементе.
* /
function appendPre (message) {
var pre = document.getElementById ('content');
var textContent = document.createTextNode (message + '\ n');
pre.appendChild (TextContent);
}
/ **
* Распечатайте все ярлыки в почтовом ящике авторизованного пользователя. Если нет ярлыков
* найдено соответствующее сообщение.
* /
function listLabels () {
gapi.client.gmail.users.labels.list ({
'userId': 'me'
}). then (function (response) {
var tags = response.result.labels;
appendPre ( 'Ярлыки:');
if (tags && tags.length> 0) {
для (я = 0; я <метки.длина; я ++) {
переменная метка = метки [я];
appendPre (label.name)
}
} еще {
appendPre ('Метки не найдены.');
}
});
}
</script>
В угловой компонент, который работает, и позвольте мне вызвать API Gmail для получения информации.
Каждый раз, когда это не удалось.
Последний пример, который у меня есть, это: gmail.component.ts
import {Component, OnInit,} from '@angular/core';
declare const gapi: any;
@Component({
selector: 'gmail-component',
templateUrl: './gmail.template.html'
})
export class GmailComponent implements OnInit{
clientid = "xxxxx.apps.googleusercontent.com";
discovery = ["https://www.googleapis.com/discovery/v1/apis/gmail/v1/rest"];
scope= 'https://mail.google.com/';
authorizeButton = document.getElementById('authorize-button');
signoutButton = document.getElementById('signout-button');
ngOnInit() {
this.handleClientLoad();
}
handleClientLoad() {
gapi.load('client:auth2', this.initClient());
}
initClient() {
gapi.client.init({
discoveryDocs: this.discovery,
clientId: this.clientid,
scope: this.scope
}).then(function () {
// Listen for sign-in state changes.
gapi.auth2.getAuthInstance().isSignedIn.listen();
// Handle the initial sign-in state.
this.updateSigninStatus(gapi.auth2.getAuthInstance().isSignedIn.get());
this.authorizeButton.onclick = this.handleAuthClick;
this.signoutButton.onclick = this.handleSignoutClick;
});
}
updateSigninStatus(isSignedIn) {
if (isSignedIn) {
this.authorizeButton.style.display = 'none';
this.signoutButton.style.display = 'block';
this.listLabels();
} else {
this.authorizeButton.style.display = 'block';
this.signoutButton.style.display = 'none';
}
}
handleAuthClick(event) {
gapi.auth2.getAuthInstance().signIn();
}
/**
* Sign out the user upon button click.
*/
handleSignoutClick(event) {
gapi.auth2.getAuthInstance().signOut();
}
appendPre(message) {
const pre = document.getElementById('content');
const textContent = document.createTextNode(message + '\n');
pre.appendChild(textContent);
}
listMessages(userId, query, callback) {
const getPageOfMessages = function (request, result) {
request.execute(function (resp) {
result = result.concat(resp.messages);
const nextPageToken = resp.nextPageToken;
if (nextPageToken) {
request = gapi.client.gmail.users.messages.list({
'userId': 'me',
'pageToken': nextPageToken,
'q': query
});
getPageOfMessages(request, result);
} else {
callback(result);
}
});
};
const initialRequest = gapi.client.gmail.users.messages.list({
'userId': 'me',
'q': query
});
getPageOfMessages(initialRequest, []);
}
listLabels() {
gapi.client.gmail.users.labels.list({
'userId': 'me'
}).then(function (response) {
const labels = response.result.labels;
this.appendPre('Labels:');
if (labels && labels.length > 0) {
for (let i = 0; i < labels.length; i++) {
const label = labels[i];
this.appendPre(label.name)
}
} else {
this.appendPre('No Labels found.');
}
});
}
}
и gmail.template.html:
<code><div id="authorize-div">
<span>Authorize access to Gmail API</span>
<!--Button for the user to click to initiate auth sequence -->
<button id="authorize-button" (click)="handleAuthClick(event)">
Authorize
</button>
</div>
<pre id="output">
Результат:
Кто-то уже сделал это? или есть представление о том, что здесь не работает?
Спасибо.