3

我有以下代码,它应该是使用 google api javascript 客户端的简单示例,并且只是显示硬编码缩短 URL 的长格式 URL:

<script>
  function appendResults(text) {
    var results = document.getElementById('results');
    results.appendChild(document.createElement('P'));
    results.appendChild(document.createTextNode(text));
  }

  function makeRequest() {

    console.log('Inside makeRequest');

    var request = gapi.client.urlshortener.url.get({
      'shortUrl': 'http://goo.gl/fbsS'
    });

    request.execute(function(response) {
      appendResults(response.longUrl);
    });
  }

  function load() {

    gapi.client.setApiKey('API_KEY');
    console.log('After attempting to set API key');
    gapi.client.load('urlshortener', 'v1', makeRequest);
    console.log('After attempting to load urlshortener');
  }
</script>
<script src="https://apis.google.com/js/client.js?onload=load"></script>

除了使用实际的 API 密钥而不是文本“API_KEY”。

控制台输出很简单:

尝试设置 API 密钥后

尝试加载 urlshortener 后

但我从来没有看到'Inside makeRequest',它位于makeRequest函数内部,它是调用gapi.client.load的回调函数,让我相信该函数不起作用(或未能完成)。

任何人都可以解释为什么会这样以及如何解决它?

提前致谢。

4

2 回答 2

11

花了几个小时搜索问题后,我发现问题是因为我在本地机器上而不是在服务器上运行这个文件。

当您在 chrome 上运行上述代码时,您会在开发人员控制台中收到此错误“无法将消息发布到 file://。收件人的来源为空。”

由于某种原因,javascript 仅在实际服务器或 XAMPP 或 WAMP 之类的东西上运行时才会加载。

如果有任何专家可以解释为什么会发生这种情况,那么学习真的很棒。

希望这可以帮助像我这样的其他菜鸟:D

于 2012-07-12T09:03:56.840 回答
5

简短回答(http://code.google.com/p/google-api-javascript-client/issues/detail?id=46):

The JS Client does not currently support making requests from a file:// origin.

长答案(http://en.wikipedia.org/wiki/Same_origin_policy):

The behavior of same-origin checks and related mechanisms is not well-defined
in a number of corner cases, such as for protocols that do not have a clearly 
defined host name or port associated with their URLs (file:, data:, etc.). 

This historically caused a fair number of security problems, such as the 
generally undesirable ability of any locally stored HTML file to access all 
other files on the disk, or communicate with any site on the Internet.
于 2013-02-26T03:23:03.070 回答