使用Ajax打造属于自己的搜索引擎

使用Ajax打造属于自己的搜索引擎
1.建立Yahoo!网关,将XMLHttpRequest请求转发到Yahoo!提供API的Web服务;
2.Yahoo!做出响应时,网关将响应转发到客户端;
3.客户端接收到响应,显示搜索结果;



search.html:
程序代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Search</title>
<script src="js/search.js"></script>
</head>
<body>
<h1>Magci Search</h1>
Search String:<input id="key" type="text" />
Max number of Results: <input id="top" type="text" size="2" />
<input type="button" value="Search" onClick="doSearch();" />
<h1><span id="title"></span></h1>
<div id="result"></div>
</body>
</html>


js/search.js:
程序代码

var xmlHttp;

function createXMLHttpRequest() {
if (window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} else if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
}

function createQueryString() {
var queryString;
var key = document.getElementById("key").value;
var top = document.getElementById("top").value;
var timeStamp = new Date().getTime();
queryString = "query=" + escape(key) + "&results=" + top + "×temp=" + timeStamp;
return queryString;
}

function doSearch() {
createXMLHttpRequest();
xmlHttp.onreadystatechange = callback;
var url = "search.mgc?" + createQueryString();
xmlHttp.open("GET", url, true);
xmlHttp.send(null);
}

function callback() {
if (xmlHttp.readyState == 4) {
if (xmlHttp.status == 200) {
parseResult();
}
}
}

function parseResult() {
clearResult();
var title = document.getElementById("title");
title.innerHTML = "Result:";
var xmlDoc = xmlHttp.responseXML;
var results = xmlDoc.getElementsByTagName("Result");
for (var i = 0; i < results.length; i++) {
createResult(results[i]);
}

}

function clearResult() {
var title = document.getElementById("title");
if (title.hasChildNodes()) {
title.removeChild(title.firstChild);
}
var result = document.getElementById("result");
while (result.hasChildNodes()) {
result.removeChild(result.firstChild);
}
}

function createResult(result) {
var div = document.getElementById("result");
var rsTitle = result.getElementsByTagName("Title")[0].firstChild.nodeValue;
var rsSummary = result.getElementsByTagName("Summary")[0].firstChild.nodeValue;
var rsUrl = result.getElementsByTagName("Url")[0].firstChild.nodeValue;
var rsClickUrl = result.getElementsByTagName("ClickUrl")[0].firstChild.nodeValue;
var titleWord = document.createElement("h3");
titleWord.appendChild(document.createTextNode(rsTitle));
var title = document.createElement("a");
title.appendChild(titleWord);
title.setAttribute("href", rsClickUrl);
title.setAttribute("target", "_blank");
var summary = document.createTextNode(rsSummary);
var url = document.createElement("div");
url.appendChild(document.createTextNode(rsUrl));
url.style.color = "#00BB33";
div.appendChild(title);
div.appendChild(summary);
div.appendChild(url);
}


Search.java:
程序代码

package cn.edu.ahau.mgc.ajax.search;

import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStreamReader;
import java.io.OutputStream;
import java.net.HttpURLConnection;
import java.net.URL;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class Search extends HttpServlet {

public static final String YAHOOURL = "http://api.search.yahoo.com/WebSearchService/V1/webSearch?appid=Y0nppIbV34FKY.Murp29GVLpnWE4Jjcbe2iv0BVA5zas4up547_KtEjh80UtAg--&type=all";

public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doPost(request, response);
}

public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String url = YAHOOURL + "&" + request.getQueryString();
HttpURLConnection conn = (HttpURLConnection) new URL(url).openConnection();
conn.setDoInput(true);
conn.setDoOutput(true);
conn.setRequestMethod("GET");
response.setStatus(conn.getResponseCode());
response.setContentType("text/xml");
BufferedReader br = new BufferedReader(new InputStreamReader(conn.getInputStream()));
String input = null;
OutputStream os = response.getOutputStream();
while ((input = br.readLine()) != null) {
os.write(input.getBytes());
os.flush();

}
os.close();
br.close();
}

}


web.xml:
程序代码

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.4"
xmlns="http://java.sun.com/xml/ns/j2ee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee
http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
<servlet>
<description>This is the description of my J2EE component</description>
<display-name>This is the display name of my J2EE component</display-name>
<servlet-name>Search</servlet-name>
<servlet-class>cn.edu.ahau.mgc.ajax.search.Search</servlet-class>
</servlet>


<servlet-mapping>
<servlet-name>Search</servlet-name>
<url-pattern>/search.mgc</url-pattern>
</servlet-mapping>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值