使用谷歌图片搜索API [英] Using google image search API
本文介绍了使用谷歌图片搜索API的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在尝试使用谷歌图片搜索API为我的网站项目，在我实际使用它之前，我试图测试谷歌图像搜索的Hello World是否有效。这是代码（我直接从谷歌网站复制）
I'm trying to use google image search API for my website project, and before i actually use it, I tried to test if the Hello World of google image search work. Here is the code(which i copied directly from the google site)
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Search API Sample</title>
<script src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load('search', '1');
var imageSearch;
function addPaginationLinks() {
// To paginate search results, use the cursor function.
var cursor = imageSearch.cursor;
var curPage = cursor.currentPageIndex; // check what page the app is on
var pagesDiv = document.createElement('div');
for (var i = 0; i < cursor.pages.length; i++) {
var page = cursor.pages[i];
if (curPage == i) {
// If we are on the current page, then don't make a link.
var label = document.createTextNode(' ' + page.label + ' ');
pagesDiv.appendChild(label);
} else {
// Create links to other pages using gotoPage() on the searcher.
var link = document.createElement('a');
link.href="/image-search/v1/javascript:imageSearch.gotoPage("+i+');';
link.innerHTML = page.label;
link.style.marginRight = '2px';
pagesDiv.appendChild(link);
}
}
var contentDiv = document.getElementById('content');
contentDiv.appendChild(pagesDiv);
}
function searchComplete() {
// Check that we got results
if (imageSearch.results && imageSearch.results.length > 0) {
// Grab our content div, clear it.
var contentDiv = document.getElementById('content');
contentDiv.innerHTML = '';
// Loop through our results, printing them to the page.
var results = imageSearch.results;
for (var i = 0; i < results.length; i++) {
// For each result write it's title and image to the screen
var result = results[i];
var imgContainer = document.createElement('div');
var title = document.createElement('div');
// We use titleNoFormatting so that no HTML tags are left in the
// title
title.innerHTML = result.titleNoFormatting;
var newImg = document.createElement('img');
// There is also a result.url property which has the escaped version
newImg.src="/image-search/v1/result.tbUrl;"
imgContainer.appendChild(title);
imgContainer.appendChild(newImg);
// Put our title + image in the content
contentDiv.appendChild(imgContainer);
}
// Now add links to additional pages of search results.
addPaginationLinks(imageSearch);
}
}
function OnLoad() {
// Create an Image Search instance.
imageSearch = new google.search.ImageSearch();
// Set searchComplete as the callback function when a search is
// complete. The imageSearch object will have results in it.
imageSearch.setSearchCompleteCallback(this, searchComplete, null);
// Find me a beautiful car.
imageSearch.execute("Subaru STI");
// Include the required Google branding
google.search.Search.getBranding('branding');
}
google.setOnLoadCallback(OnLoad);
</script>
</head>
<body style="font-family: Arial;border: 0 none;">
<div id="branding" style="float: left;"></div><br />
<div id="content">Loading...</div>
</body>
</html>
However, when i actually open this code in firefox or chrome, images are all broken.
Can anyone help me with this?
However, when i actually open this code in firefox or chrome, images are all broken.
Can anyone help me with this?
推荐答案
The sample has two errors...
1. Change this line
The sample has two errors...
1. Change this line
link.href="/image-search/v1/javascript:imageSearch.gotoPage("+i+');';to this
to this
link.href="javascript:imageSearch.gotoPage("+i+');';
2. Change this line
2. Change this line
newImg.src="/image-search/v1/result.tbUrl;"to this
to this
newImg.src=result.tbUrl;这篇关于使用谷歌图片搜索API的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
