Javascript 使用Java脚本在客户端机器上进行基于全文的搜索

我正在尝试在客户端计算机上实现基于全文的搜索功能

我发现它部分地满足了我的需求，但它必须加载到像Apache这样的服务器上，然后才能完美地工作

在我的情况下，客户机不会安装任何服务器或数据库。一个目录中只有一堆静态HTML文件，一个索引文件接受用户从搜索框中输入的内容，搜索框在这些静态HTML文件中搜索该字符串

谷歌搜索揭示了我的项目中可能需要的一些有趣的词：

innerHtml

、

DOM

、

iframes

和

RegExp

---

请阐述我对你答案的疑问。提前感谢

我可以想到一种方法来实现这一点——您可以使用XMLHttpRequest获取本地文件。默认情况下不允许这样做，但例如，可以使用以下参数启动chromium：

--allow-file-access-from-files

您必须浏览所有要查看的文件，并通过执行regex手动实现搜索，这应该不难

我在chromium中测试了以下代码：

var xmlhttp = new XMLHttpRequest();
var url = "file:///your-file.html";

xmlhttp.open('GET', url, true);
xmlhttp.onerror = function(e) { console.log('Problems' + e); };

xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState === 4 && xmlhttp.status === 0) {
        console.log("Fetched: ");
        console.log(xmlhttp.responseText);

    }
    if (xmlhttp.readyState === 4 && xmlhttp.status === 200) {
        // ....
    }
    else if (xmlhttp.readyState==4 && xmlhttp.status != 200) {
        // ....
    }
}

xmlhttp.send();

---

虽然我没有尝试过这样使用它，但你可以看看（）

jIO可用于跨多个存储（浏览器localstorage、webDav、xWiki、S3…）管理和同步JSON文档。存储可以被索引，jIO自带了自己的查询模块，称为complexQueries，也可以单独使用

如果您通过Ajax请求页面并提取页面的全文/HTML，只需将其作为文档转储到jIO中即可

三种方法（所有示例都来自于）：

1）使用普通本地存储和复杂查询 在jIO中为您想要搜索的每个文档创建一个文档。因此，在设置jIO之后：

var mySearchFiles = JIO.newJio({
    "type" : "local",
    "username" : "whatever",
    "application_name" : "fulltextsearch"
 });

将完整HTML/提取文本（localstorage大小限制…）添加为文档，如下所示：

mySearchFiles.put({
    "_id": "your_id",
    "search_result_string": "page_title/page_filename",
    "searchable_text": "your_text_to_be_searched_goes_here",
    function (err, response) {
        // console.log(response) =
        // {
        //  "ok": true,
        //  "id": "your_id",
        // }
    }

))

使用

\u id

或其他自定义键作为搜索时希望从jIO返回的键

然后使用allDocs方法在jIO上运行复杂查询（这是一个处理复杂查询的示例页面）：

这将返回所需的

search\u result\u字符串。我不知道搜索大文本的速度有多快，但是如果你愿意的话，你可以使用

2。仅使用复杂查询

您可以使用ComplexQueries中使用的
parse
、
serialize
和
query
方法。查看有关其工作原理的示例页面

基本上，您需要将要搜索的数据作为对象列表提供，并且您的查询必须序列化。然后打电话：

var result = jIO.ComplexQueries.query(query, object_list);

当然，您需要一些地方来保存可搜索的数据，所以我可能会选择localStorage

3。在本地存储上添加索引存储

您可以在localStorage上添加索引，如下所示：

 mySearchFiles = JIO.newJio({
    "type": "indexed",
    "indices": [
        {"name":"index_name", "fields":["field_to_be_indexed_1"]},
        {"name":"index_name2", "fields":["field_to_be_indexed_1","field_to_be_indexed_2"]}
    ],
    "field_types": {
      "field_to_be_indexed_1": "string",
      "field_to_be_indexed_2": "string"
    },
    "sub_storage": {
      "type": "local",
      "username": "whatever",
      "application_name": "fulltextsearch"
    }
});

这将为您添加到本地存储的所有文档创建索引，这将允许您在使用complexQueries（例如）挖掘所有文件之前对文件进行关键字搜索。因此：

mySearchFiles.put({
    "_id": "your_id",
    "search_result_string": "page_title/page_filename",
    "index_field": "keyword",
    "index_field2": "another_keyword",
    "searchable_text": "your_text_to_be_searched_goes_here",
    function (err, response) {
        // console.log(response) =
        // {
        //  "ok": true,
        //  "id": "your_id",
        // }
    }
  );

您可以调用相同的方法，但JIO总是会首先尝试查询索引以生成结果。实际上，这更多的是用于远程存储位置（在HTTP请求文件之前搜索索引，比如从S3），但是，可能是可用的

如果您有任何问题，请告诉我。
听起来您的html文件是静态的，如果是这种情况，您实际上也可以有一个json文件，其中包含每个html文件中的文本

例如，如果您有两个html页面，foo.html和bar.html，则可以从每个页面中提取相关内容，并创建包含以下内容的json文件：

[{
    "id": "foo.html",
    "text": "whatever text is in foo.html"
},{
    "id": "bar.html",
    "text": "whatever text is in bar.html"
}]

这将存在于html所在的目录中，例如

- project_dir
-- foo.html
-- bar.html
-- index.json

然后可以将索引文件与lunr.js一起使用

实际构建index.json文件的方式取决于可用的工具，尽管类似于或可读性。此处讨论了更多选项
您想在文件中搜索吗？很确定你不能在客户端进行搜索。在客户端sise中搜索文件会有点过头。您必须使用javascript将所有文件传输到客户端，这是一个非常糟糕的主意。每个页面都提供了有限的资源，以及一些使用低速连接的用户。只有当您有少量文本时，该选项才可用。@sania_Zol不传输文件。所有HTML文件都存在于客户端的本地计算机上。当用户搜索单词时，只需搜索所有这些HTML文件…@highlander141您不能这样做（因为本地页面安全上下文只有一个页面），至少不能直接搜索。但您可以：使用（但这需要将所有数据嵌入/转换为一个文件）或使用搜索软件（可以是（注意hta文件扩展名）以及@sania_Zol+1来提及HTML应用程序。这种搜索是否像文件中的字符串/短语一样？？
- project_dir
-- foo.html
-- bar.html
-- index.json