客户端检索Google联系人图片

Question

我正在使用Google JavaScript API在网络应用中获取谷歌联系人,我想要检索他们的图片.

我正在做这样的事情(大大简化):

var token; // let's admit this is available already

function getPhotoUrl(entry, cb) {
  var link = entry.link.filter(function(link) {
    return link.type.indexOf("image") === 0;
  }).shift();
  if (!link)
    return cb(null);
  var request = new XMLHttpRequest();
  request.open("GET", link.href + "?v=3.0&access_token=" + token, true);
  request.responseType = "blob";
  request.onload = cb;
  request.send();
}

function onContactsLoad(responseText) {
  var data = JSON.parse(responseText);
  (data.feed.entry || []).forEach(function(entry) {
    getPhotoUrl(e, function(a, b, c) {
      console.log("pic", a, b, c);
    });
  });
}

但是我在Chrome和Firefox中都遇到了这个错误:

跨源请求封锁:同源策略不允许读取远程资源在https://www.google.com/m8/feeds/photos/media/<user_email？>/<some_contact_id> V = 3.0&的access_token = <混淆> .这可以通过将资源移动到同一域或启用CORS来解决.

当查看来自feed/photos端点的响应头时,我可以看到它Access-Control-Allow-Origin: *没有被发送,因此我得到了CORS错误.

请注意,Access-Control-Allow-Origin: *在到达feeds/contacts端点时发送,因此允许跨域请求.

这是一个错误,还是我错过了他们的文档？

Answer 1

假设您只需要“个人资料图片”，请尝试通过将完整 URL 设置为标签src的元素<img>（使用?access_token=<youknowit>（末尾

例如使用 Angular.js

<img ng-src="{{contact.link[1].href + tokenForImages}}" alt="photo" />

总体而言，就 CORS 而言，从 JS 访问 API 似乎有不少地方无法按预期工作。

希望这可以帮助。