中文文档的搜索结果会同时包括英文和中文结果

heheda123123 commented 1 month ago

Xmake 版本

v2.9.4+dev.216192e56

操作系统版本和架构

windows 11

描述问题

切换文档到中文版本，搜索，会发现结果同时会出现中文和英文，混在一起很难受我也不懂docsify，问了下ai 加上这行应该就可以？ pathNamespaces: ['/zh-cn'],

当前api站点使用docsify搭建，包含了中文和英文版本，英文版本的内容在根目录下，中文版本在url中包含前缀/zh-cn，
使用搜索功能时，搜索的结果总是从根目录开始，同时包含了中文和英文的内容，
如何设置，使得在英文页面时搜索的结果只包含英文，在中文页面搜索的时候只包含中文

这是一个常见的多语言网站搜索问题。我们可以通过配置 docsify 的搜索插件来实现这个功能。具体来说，我们可以使用 pathNamespaces 选项来限制搜索范围。以下是实现这一功能的步骤：

首先，确保你的 docsify 配置文件中已经包含了搜索插件。

然后，我们需要修改搜索插件的配置。在你的 docsify 配置中（通常在 index.html 文件中），添加或修改搜索插件的配置如下：

<JAVASCRIPT>
window.$docsify = {
  // ... 其他配置项 ...
  search: {
    paths: 'auto',
    placeholder: {
      '/zh-cn/': '搜索',
      '/': 'Type to search'
    },
    noData: {
      '/zh-cn/': '没有结果',
      '/': 'No Results'
    },
    pathNamespaces: ['/zh-cn'],
    hideOtherSidebarContent: true
  }
};
这个配置做了以下几件事：

paths: 'auto': 自动检测所有可搜索的路径。
placeholder: 为不同语言设置搜索框的占位符文本。
noData: 为不同语言设置没有搜索结果时显示的文本。
pathNamespaces: ['/zh-cn']: 这是关键配置，它告诉 docsify 将 '/zh-cn' 视为一个独立的命名空间。
hideOtherSidebarContent: true: 在搜索时隐藏其他侧边栏内容，使搜索结果更清晰。
为了更好地控制搜索行为，你可能还需要在你的 HTML 文件中添加一些自定义 JavaScript 代码。在 <script> 标签中添加以下代码：
<JAVASCRIPT>
// 自定义搜索函数
function customSearch(query) {
  var currentPath = window.location.hash.substring(1);
  var isChinesePage = currentPath.startsWith('/zh-cn');

  // 输出调试信息
  console.log("Current path:", currentPath);
  console.log("Is Chinese page:", isChinesePage);

  return function(matchedContent) {
    // 对于中文页面，只返回中文结果
    if (isChinesePage && !matchedContent.file.path.startsWith('/zh-cn')) {
      console.log("Filtered out non-Chinese result:", matchedContent.file.path);
      return false;
    }
    // 对于英文页面，只返回非中文结果
    if (!isChinesePage && matchedContent.file.path.startsWith('/zh-cn')) {
      console.log("Filtered out Chinese result:", matchedContent.file.path);
      return false;
    }
    console.log("Included result:", matchedContent.file.path);
    return true;
  }
}

// 将自定义搜索函数添加到 docsify 配置中
window.$docsify.search.handleSearch = customSearch;
这段代码定义了一个自定义搜索函数，它根据当前页面的路径来决定是否包含搜索结果。如果当前是中文页面（路径以 '/zh-cn' 开头），它只会返回中文结果；如果是英文页面，它只会返回英文结果。

通过这些配置和代码，你应该能够实现在英文页面只搜索英文内容，在中文页面只搜索中文内容的功能。记得在浏览器控制台中查看输出的调试信息，以确保一切工作正常。

这个修改的方法是否有效呢？

期待的结果

切换页面到中文之后，搜索的结果应该只包含中文内容

工程配置

不需要

附加信息和错误日志

不需要

waruqi commented 1 month ago

你可以拉下文档源码，然后执行

docsify serve

来测试验证下

heheda123123 commented 1 month ago

你可以拉下文档源码，然后执行
docsify serve
来测试验证下

打算测试来着，但是最近几天都在外面，电脑node啥的都没装，用的热点，流量有限，等过几天回家再测

heheda123123 commented 1 month ago

解决了，我本地测试成功，修改了两个地方，一是search字段下，85行加了

pathNamespaces: ['/zh-cn'],

二是修改了下面导入的search插件，原来assets下面的search.min.js可能有bug，设置了上面的也不生效，改为下面的就可以了

<!-- <script src="/assets/npm/docsify/search.min.js"></script> -->
  <script src="//cdn.jsdelivr.net/npm/docsify/lib/plugins/search.min.js"></script>

修改之后的效果分别进入下面的url使用搜索功能，搜索的结果都不会混淆了

http://localhost:3000/#/zh-cn/getting_started
http://localhost:3000/#/getting_started

现在的问题是，分别打开下面的url，搜索的结果都会混在一起

https://xmake.io/#/getting_started
https://xmake.io/#/zh-cn/getting_started

waruqi commented 1 month ago

谢谢，已经更新了。

xmake-io / xmake-docs