跳到主要内容

技术|给博客加上AI搜索功能

阅读需 2 分钟

博客本来用的是主题自带的本地搜索,但是本地搜索有一个问题:文章数量多了,搜索速度会很慢,甚至导致浏览器崩溃,于是我想找一个替代方案。

尝试了在线搜索平台Algolia、Pagefind,发现它们免费额度很少,而且更新频率低,如果购入收费计划的话,价格不菲(图源:Algolia官网)。

08220007.webp

几番搜索之下,我看到了这篇文章(https://upxuu.com/posts/xuai-implementation/),用Cloudflare 免费AI额度实现AI搜索功能。免费额度是每月调用 10 万次,个人使用完全够用。

Cloudflare设置

打开Cloudflare控制台,找到AI-AI搜索——创建实例。

图片

ID名随便填写一个,数据源选择「Web抓取」。

08220010.webp

填写你的站点的url地址,如果你的站点有Sitemap的话,解析类型选择Sitemap,否则选择“自动发现”。

08220011.webp

如果选择的是Sitemap的话,在下方的“特定站点地图”中填写自己的sitemap链接。

08220012.webp

可以选择AI的模型,建议选择图中所示模型,速度比较快。

部署完成之后,在“公共端点”中把搜索端点打开,如果担心被盗用,也可以填写下方的“授权主机”,修改为自己的博客地址。

前端部署

Cloudflare为站点提供了多种搜索组件,点击此处即可查看。

08220013.webp

可直接复制样式代码到博客页,由于国内访问Cloudflare的代码速度较慢,也可以把js文件下载到自己的服务器上使用。还可以自定义其他的搜索样式。

本博客右上角的搜索框已经集成了AI搜索功能,点击即可使用。