如何使用 javascript + 用户输入来搜索 google 图像并将其显示在 html 中？

Question

我正在尝试创建一个 javascript 函数，该函数在被调用时将从文本框中获取用户输入并使用该输入搜索 google 图像并从中获取 link出现的第一张图片，然后将其设置为图片的来源（我还没有决定图片的 id），任何关于如何做到这一点的建议都非常适用

Answer 1

您可以使用这个 Node 库轻松完成：https://www.npmjs.com/package/image-search-google 以下是 JS 代码示例：

    const imageSearch = require('image-search-google');
 
const client = new imageSearch('CSE ID', 'API KEY');
const options = {page:1};
client.search('APJ Abdul kalam', options)
    .then(images => {
        /*
        [{
            'url': item.link,
            'thumbnail':item.image.thumbnailLink,
            'snippet':item.title,
            'context': item.image.contextLink
        }]
         */
    })
    .catch(error => console.log(error););
 
// search for certain size
client.search('Mahatma Gandhi', {size: 'large'});
 
// search for certain type
client.search('Indira Gandhi', {type: 'face'});

使用属性 url，您可以使用此 URL 生成 a 标签。

如何使用 javascript + 用户输入来搜索 google 图像并将其显示在 html 中？

How to use javascript + user input to search for a google image and display it in html?

html

javascript

css

jquery

image