Google API in Javascript



我正在尝试在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's origin ('null').'

所以我坚持使用"gapi.auth.authorize"。 之后什么都不起作用

根据您收到的错误,我的猜测是,您要么没有在获取客户端ID的Google API控制台上正确配置Javascript Origin,和/或您正在尝试从文件系统而不是通过Web服务器运行脚本,即使是在localhost上运行的服务器。 据我所知,Google API 客户端不接受来自文件系统或任何未配置为在提供的客户端 ID 下请求授权的域的授权请求。

Google API 控制台参考:

在 Web 应用程序的客户端 ID 中:

Javascript 起源 : http://localhost:3000/


浏览器应用程序的密钥:

推荐人 : http://localhost:3000/

本地主机将 100% 工作

我得到了同样的错误,并且按照您的喜好,在我的本地Web服务器中运行HTML文件后,问题解决了。

我为 Web 应用程序创建了凭据,并使用"http://localhost:5000"字符串将以下值设置为我的本地

"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

有些 API 在从本地文件查询时可以正常工作,但有些则不能。为了响应像您这样的错误,请尝试从 Web 服务器提供您的文件。 如果您需要运行快速的Web服务器,请使用Python的内置HTTP服务器(Mac OSX和Linux系统预装了Python)。此 HTTP 服务器可以将系统中的任何目录转换为 Web 服务器目录。 cd到项目目录中并运行以下命令: python -m SimpleHTTPServer 3000 末尾的数字是 http 服务器将启动的端口号,您可以更改该端口号。在我们的示例中,您的目录将从以下位置提供:http://localhost:3000

相关内容

  • 没有找到相关文章

最新更新