Javascript 入门：Chrome扩展

我从谷歌开发者的教程开始学习如何构建Chrome扩展。（）我按照说明操作，但弹出窗口不会生成任何照片。（说明、flavicon等所有负载正常。）

起初我认为Flickr API密钥无效，但即使将密钥更新为有效密钥也没有任何作用。我还尝试禁用所有其他扩展，以确保它不冲突，并在新窗口中打开它。我还通过JSFIDLE运行了代码，以查看是否存在无效的内容

有人能告诉我做这件事缺少什么吗？（据我所知，这是一个身份验证令牌问题，或者是缺少令牌问题。）

编辑：

这是popup.js文件。我没有修改代码。这是从网站下载的原始文件。我避免发布整个文件，因为它相当长。（我禁用了所有扩展，并尝试运行给定的练习扩展，但它仍然会给我一个空的弹出框。）

//版权所有（c）2012 Chromium作者。版权所有。
//此源代码的使用受BSD样式许可证的约束，该许可证可以
//在许可证文件中找到。
/**
*包含要传递给Flickr的查询的全局变量。在这个
*凯斯，小猫们！
*
*@type{string}
*/
var查询='kittens'；
无功发电机={
/**
*Flickr URL将为我们提供很多我们正在寻找的东西。
*
*看http://www.flickr.com/services/api/flickr.photos.search.html 对于
*有关此URL构造的详细信息。
*
*@type{string}
*@私人
*/
searchOnFlickr:'https://secure.flickr.com/services/rest/?' +
'method=flickr.photos.search&'+
“api_key=42cd5ea89847bd3b8f211ddbb7a6b789”+
'text='+encodeURIComponent（查询）+'&'+
“安全搜索=1&”+
“内容类型=1&”+
'排序=兴趣度描述&'+
“每页=20”，
/**
*发送一个XHR GET请求以获取大量小猫的照片
*XHR的“onload”事件与“showPhotos”方法挂钩。
*
*@公众
*/
requestKittens:function（）{
var req=新的XMLHttpRequest（）；
请求打开（“GET”，this.searchOnFlickr_，true）；
req.onload=this.showPhotos\uuuz.bind（this）；
请求发送（空）；
},
/**
*处理kitten XHR请求的“onload”事件，该请求在
*通过生成“img”元素并将其填充到
*要显示的文档。
*
*@param{ProgressEvent}是XHR ProgressEvent。
*@私人
*/
展示照片：功能（e）{
var kittens=e.target.responseXML.queryselectoral（'photo'）；
对于（变量i=0；i

我想我可能找到了答案，这是来自flickr.com的消息：

已禁用无参数搜索。请改用flickr.photos.getRecent

---

只需使用flickr.photos.getRecent，并删除不必要的参数即可。

如果您向我们展示了一些内容，我们可以看一看，并说出遗漏的内容，但是您目前没有向我们展示任何内容。您对源代码做过任何更改吗。下载源代码，启动developerss模式，单击LoadUnpacketExtension。它应该可以工作。我刚刚替换了

kittenGenerator.requestKittens（）带有
var div=document.createElement（'div'）；div.innerText='someText'；文件.正文.附件（div）-因此，框中包含“someText”。我想这意味着扩展“功能”是可以的。昨天查看时，我在扩展页面上看不到日期，但现在在
popup.js
中看到它有一个2012年的版权声明，所以我猜Flickr方面的一些事情已经改变了。和你一样，我也不知道是什么，但是搜索Flickr的文档应该可以发现问题。我从Flickr获得了一个新的api密钥，修补了它，它开始工作。
// Copyright (c) 2012 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.

/**
* Global variable containing the query we'd like to pass to Flickr. In this
* case, kittens!
*
* @type {string}
*/
var QUERY = 'kittens';

var kittenGenerator = {
/**
* Flickr URL that will give us lots and lots of whatever we're looking for.
*
* See http://www.flickr.com/services/api/flickr.photos.search.html for
* details about the construction of this URL.
*
* @type {string}
* @private
*/
searchOnFlickr_: 'https://secure.flickr.com/services/rest/?' +
  'method=flickr.photos.search&' +
  'api_key=42cd5ea89847bd3b8f211ddbb7a6b789' +
  'text=' + encodeURIComponent(QUERY) + '&' +
  'safe_search=1&' +
  'content_type=1&' +
  'sort=interestingness-desc&' +
  'per_page=20',

 /**
 * Sends an XHR GET request to grab photos of lots and lots of kittens. The
 * XHR's 'onload' event is hooks up to the 'showPhotos_' method.
*
* @public
*/
requestKittens: function() {
var req = new XMLHttpRequest();
req.open("GET", this.searchOnFlickr_, true);
req.onload = this.showPhotos_.bind(this);
req.send(null);
 },

/**
* Handle the 'onload' event of our kitten XHR request, generated in
* 'requestKittens', by generating 'img' elements, and stuffing them into
* the document for display.
*
* @param {ProgressEvent} e The XHR ProgressEvent.
* @private
*/
showPhotos_: function (e) {
var kittens = e.target.responseXML.querySelectorAll('photo');
for (var i = 0; i < kittens.length; i++) {
  var img = document.createElement('img');
  img.src = this.constructKittenURL_(kittens[i]);
  img.setAttribute('alt', kittens[i].getAttribute('title'));
  document.body.appendChild(img);
 }
 },

/**
 * Given a photo, construct a URL using the method outlined at
 * http://www.flickr.com/services/api/misc.urlKittenl
 *
 * @param {DOMElement} A kitten.
 * @return {string} The kitten's URL.
 * @private
 */
constructKittenURL_: function (photo) {
return "http://farm" + photo.getAttribute("farm") +
    ".static.flickr.com/" + photo.getAttribute("server") +
    "/" + photo.getAttribute("id") +
    "_" + photo.getAttribute("secret") +
    "_s.jpg";
 }
};

// Run our kitten generation script as soon as the document's DOM is ready.
document.addEventListener('DOMContentLoaded', function () {
kittenGenerator.requestKittens();
});