Google API в Javascript

Я пытаюсь получить информацию о календарях из google в javascript. Я читал инструкции "как". Они не помогли. Даже этот "полезный" код с копией (для авторизации) этого не сделал. Кто-нибудь будет так добр, чтобы научить меня, как использовать google api? Может быть, у кого-то есть образцы для обмена

И этот красивый код js:

<html>
<button id="authorize-button" onclick='handleAuthClick()'>Authorize</button>

<script type="text/javascript">
    var clientId = '***';
    var apiKey = '***';
    var scopes = 'https://www.googleapis.com/auth/plus.me';

    function handleClientLoad() {
        gapi.client.setApiKey(apiKey);
        window.setTimeout(checkAuth,1);
    }

    function checkAuth() {
        gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: true}, handleAuthResult);
    }

    function handleAuthResult(authResult) {
        var authorizeButton = document.getElementById('authorize-button');
        if (authResult && !authResult.error) {
            authorizeButton.style.visibility = 'hidden';
            makeApiCall();
        } else {
            authorizeButton.style.visibility = '';
            authorizeButton.onclick = handleAuthClick;
        }
    }

    function handleAuthClick(event) {
        // Step 3: get authorization to use private data
        gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: false}, handleAuthResult);
        return false;
    }

    // Load the API and make an API call.  Display the results on the screen.
    function makeApiCall() {
        // Step 4: Load the Google+ API
        gapi.client.load('plus', 'v1', function() {
            // Step 5: Assemble the API request
            var request = gapi.client.plus.people.get({
            'userId': 'me'
            });
            // Step 6: Execute the API request
            request.execute(function(resp) {
            var heading = document.createElement('h4');
            var image = document.createElement('img');
            image.src = resp.image.url;
            heading.appendChild(image);
            heading.appendChild(document.createTextNode(resp.displayName));

            document.getElementById('content').appendChild(heading);
            });
        });
    }
</script>

Сообщение об ошибке (из консоли):

 'Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('file://') does not match the recipient window origin ('null').'

поэтому я застрял на "gapi.auth.authorize". ничего не работает после

Ответы

Ответ 1

Основываясь на полученной ошибке, я полагаю, что у вас либо нет надлежащего Javascript Origin на консоли Google API, у вас есть свой идентификатор клиента от и/или вы пытаетесь запустить script из файловой системы, а не через веб-сервер, даже один из которых работает на localhost. Клиент Google API, как я уже мог сказать, не принимает запросы авторизации из файловой системы или любого домена, который не настроен на запрос авторизации в соответствии с предоставленным идентификатором клиента.

Ответ 2

Ссылка на консоль Google API:

В идентификаторе клиента для веб-приложения:

Javascript Origins: http://localhost:3000/

Ключ для приложений браузера:

Отправляющие: http://localhost:3000/

localhost будет работать на 100%

Ответ 3

Я получил ту же ошибку и, как вам было угодно, после запуска html файла в решении локального веб-сервера.

i создал учетные данные для веб-приложения и установил следующие значения как для моего локального, так и для http://localhost:5000" string

"Authorized JavaScript origins" 
"Authorized redirect URIs

я также проверил json файл. В результате я получил следующий json файл.

{"web":
 {
    "client_id":"myClientID",
    "project_id":"my-project",
    "auth_uri":"https://accounts.google.com/o/oauth2/auth",
    "token_uri":"https://accounts.google.com/o/oauth2/token",
    "auth_provider_x509_cert_url":"https://www.googleapis.com/oauth2/v1/certs",
    "client_secret":"XqXmgQGrst4xkZ2pgJh3Omxg",
    "redirect_uris":["http://localhost:5000"],
    "javascript_origins":["http://localhost:5000"]
 }

}

https://developers.google.com/drive/v2/web/auth/web-client

Ответ 4

Некоторые API будут отлично работать при запросе из локальных файлов, но некоторые из них не будут работать. В ответ на такую ​​ошибку, как ваша, попробуйте обслуживать ваши файлы с веб-сервера. Если вам нужен быстрый веб-сервер, используйте встроенный HTTP-сервер Python (в системах Mac OSX и Linux предустановлен Python). Этот HTTP-сервер может превратить любой каталог в вашу систему в ваш каталог веб-сервера. cd в каталог проекта и выполните следующую команду: python -m SimpleHTTPServer 3000 Номер в конце - это номер порта, на котором будет запущен ваш http-сервер, и вы можете изменить этот номер порта. В нашем примере ваш каталог будет обслуживаться из: http://localhost:3000.