javascript — создание страницы входа в Google для доступа к сервисам

Мне нужно создать небольшое веб-приложение, которое подключается к Google Calendars и выбирает указанный набор событий. Я прочитал документация, и я понимаю, что мне нужно аутентифицировать пользователя в моем приложении, которое я создал на консоли разработчика Google.

Я пытаюсь реализовать аутентификацию с помощью всплывающего окна (я использую FancyBox за это). Это <div> в котором данные для входа идут: <div id="login-popup" style="display:none"></div>

Это код JS, который я использую для вызова файла auth.php:

    $.get("/auth.php", function(result) {
$('#login-popup').append(result);
$.fancybox({
href: "#login-popup",
autoSize: true,
width: "60%",
fitToView: true
});
});

И, наконец, это код PHP, который отправляет запрос GET в API Google:

$ch = curl_init();
if($ch) {
curl_setopt($ch, CURLOPT_HTTPHEADER, array('Content-Type: text/plain'));
curl_setopt($ch, CURLOPT_HTTPGET, true);
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, true);
curl_setopt($ch, CURLOPT_URL, $query);
$result = curl_exec($ch);

curl_close($ch);
}
else {
throw new RuntimeException("Hiba történt a távoli adatok elérése közben!");
}
echo json_encode($result);

Итак, это всплывающее окно появляется после этого, как и должно быть:

введите описание изображения здесь

Однако после того, как я ввел свои учетные данные, он перенаправляет меня на веб-сайт входа в систему Google (https://accounts.google.com/ServiceLoginAuth).

Моя проблема:

Мне нужно иметь возможность вернуть данные из этого всплывающего окна, чтобы получить токен доступа, который я смогу позже использовать в своем вызове Calendar API. Что мне нужно сделать, чтобы добиться этого?

1

Решение

Причина, по которой вас перенаправляют, заключается в том, что вы загружаете страницу Google в iframe. Все, что обычно вызывается на их странице входа при отправке, вызывается при вводе. Таким образом, вы просто открываете окно для Google на вашем сайте.

Правильный способ реализовать это будет использовать oauth API Google. (https://developers.google.com/accounts/docs/OAuth2 или, более конкретно, https://developers.google.com/accounts/docs/OAuth2Login)

Вам нужно будет зарегистрировать проект и получить ключ разработчика / API.

Документы Google очень полны, так что вы легко сможете следить за ними!

5

Другие решения

Других решений пока нет …

По вопросам рекламы [email protected]