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

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



search.html:
程序代码





Search



Magci Search


Search String:
Max number of Results:







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:
程序代码


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">

This is the description of my J2EE component
This is the display name of my J2EE component
Search
cn.edu.ahau.mgc.ajax.search.Search




Search
/search.mgc


index.jsp

你可能感兴趣的:(AJAX)