搜索栏模仿者答案

【问题标题】：Search bar mimicker搜索栏模仿者
【发布时间】：2017-09-01 14:30:18
【问题描述】：

我不完全确定如何从不同的搜索引擎收集搜索结果，例如：amazon、target、Walmart 等。

我的目标是创建一个搜索栏，它通常会收集来自许多网站的全局搜索结果。

如果您使用该网站：http://www.kayak.com/，但对于亚马逊、沃尔玛等。

我已经设置了搜索栏，但我将如何继续创建检索数据部分。

body{
  padding-top: 75px;
}

.search-container{
  width: 490px;
  display: block;
  margin: 0 auto;
}

input#search-bar{
  margin: 0 auto;
  width: 100%;
  height: 45px;
  padding: 0 20px;
  font-size: 1rem;
  border: 1px solid #D0CFCE;
  outline: none;
  &:focus{
    border: 1px solid #008ABF;
    transition: 0.35s ease;
    color: #008ABF;
    &::-webkit-input-placeholder{
      transition: opacity 0.45s ease; 
  	  opacity: 0;
     }
    &::-moz-placeholder {
      transition: opacity 0.45s ease; 
  	  opacity: 0;
     }
    &:-ms-placeholder {
     transition: opacity 0.45s ease; 
  	 opacity: 0;
     }    
   }
 }

.search-icon{
  position: relative;
  float: right;
  width: 75px;
  height: 75px;
  top: -62px;
  right: -45px;
}

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Search</title>
<link rel="stylesheet" href="bar.css">
</head>
<body>
  <form class="search-container">
    <input type="text" id="search-bar" placeholder="What can I help you with today?">
    <a href="#"><img class="search-icon" src="http://www.endlessicons.com/wp-content/uploads/2012/12/search-icon.png"></a>
  </form>
</body>
</html>

在您搜索 like blue shoes 后，结果应该会以我正在尝试处理的价格和费率（如 trivago 的风格）显示 blue shoes。再次，我被困在如何从亚马逊、沃尔玛等实际网站检索实际信息。

因此，我有什么方法可以通过此搜索栏搜索所有这些网站，并将信息检索回我的网站？或者类似的想法？

【问题讨论】：

你可能想看看这些网站提供的 API，它只是在正确的端口上的一个 http 请求，你可以选择，你会得到一个结果列表，然后你用所有的网站有一个大面板。所以你可能想要一个 php 页面（我假设是 php 部分）向你发送一个特定搜索的结果，或者一个调用 API 的 javascript ajax 函数（我认为对用户不太友好）

标签： javascript html web-services

【解决方案1】：

您需要将 API 用于您提到的其他服务。一些 API 将提供“包装器”，即以特定语言编写的 API 的某种可用形式。例如，Amazon API 可能有一个 PHP 包装器（我不确定），它会给你一些类和/或函数来为你调用 API。

当您设置处理搜索表单的代码时，您必须将该搜索查询提供给您要搜索的每个 API。它们很可能会以 JSON 或 XML 格式返回数据，因此您可以对其进行解析以生成搜索结果。

【讨论】：