From 38c549606edbb072341a10087684703220e394ed Mon Sep 17 00:00:00 2001 From: mayx Date: Fri, 4 Oct 2024 07:13:10 +0000 Subject: Update 4 files - /_layouts/default.html - /_layouts/post.html - /_posts/2024-10-01-suggest.md - /js/main.js--- _layouts/default.html | 1 + _layouts/post.html | 10 ++++----- _posts/2024-10-01-suggest.md | 48 +++++++++++++++++++++++++++++--------------- js/main.js | 1 - 4 files changed, 38 insertions(+), 22 deletions(-) diff --git a/_layouts/default.html b/_layouts/default.html index 20595ac..f15881c 100644 --- a/_layouts/default.html +++ b/_layouts/default.html @@ -27,6 +27,7 @@ gtag('config', '{{ site.google_analytics }}'); var lastUpdated = new Date("{{ site.time | date: "%FT%T%z" }}"); + var BlogAPI = "https://summary.mayx.eu.org"; function getSearchJSON(callback) { var searchData = JSON.parse(localStorage.getItem("blog_" + lastUpdated.valueOf())); if (!searchData) { diff --git a/_layouts/post.html b/_layouts/post.html index 2ad1fdd..6d353f2 100644 --- a/_layouts/post.html +++ b/_layouts/post.html @@ -44,15 +44,15 @@ layout: default var postContent = "文章标题：" + {{ page.title | jsonify }} + "；文章内容：" + {{ page.content | strip_html | strip_newlines | jsonify }}; var postContentSign = await sha(postContent); var outputContainer = document.getElementById("ai-output"); - $.get("https://summary.mayx.eu.org/is_uploaded?id={{ page.url }}&sign=" + postContentSign, function (data) { + $.get(BlogAPI + "/is_uploaded?id={{ page.url }}&sign=" + postContentSign, function (data) { if (data == "yes") { - $.get("https://summary.mayx.eu.org/get_summary?id={{ page.url }}&sign=" + postContentSign, function (data2) { + $.get(BlogAPI + "/get_summary?id={{ page.url }}&sign=" + postContentSign, function (data2) { outputContainer.textContent = data2; }); } else { - $.post("https://summary.mayx.eu.org/upload_blog?id={{ page.url }}", postContent, function (data) { - $.get("https://summary.mayx.eu.org/get_summary?id={{ page.url }}&sign=" + postContentSign); - const evSource = new EventSource("https://summary.mayx.eu.org/summary?id={{ page.url }}"); + $.post(BlogAPI + "/upload_blog?id={{ page.url }}", postContent, function (data) { + $.get(BlogAPI + "/get_summary?id={{ page.url }}&sign=" + postContentSign); + const evSource = new EventSource(BlogAPI + "/summary?id={{ page.url }}"); outputContainer.textContent = ""; evSource.onmessage = (event) => { if (event.data == "[DONE]") { diff --git a/_posts/2024-10-01-suggest.md b/_posts/2024-10-01-suggest.md index 927cebe..67f2289 100644 --- a/_posts/2024-10-01-suggest.md +++ b/_posts/2024-10-01-suggest.md @@ -11,22 +11,38 @@ tags: [Cloudflare, Workers, Vectorize, 博客] # 制作过程 ## 后端部分 - 其实流程很简单，就是把对应ID的向量查出来之后拿着这个向量再去查询就好了，唯一需要注意的就是它查出来的第一条肯定是自己，所以只要把第一条删掉就行，代码也非常简单： + 其实流程很简单，就是把对应ID的向量查出来之后拿着这个向量再去查询就好了，唯一需要注意的就是它查出来的第一条肯定是自己，所以只要把第一条删掉就行， ~~代码也非常简单~~ （后来又加了缓存稍微变的复杂了😂）： ```javascript if (url.pathname.startsWith("/suggest")) { let resp = []; - let result = await env.mayx_index.getByIds([ - query - ]); - if (result.length) { - resp = await env.mayx_index.query(result[0].values, { topK: 6 }); - resp = resp.matches; - resp.splice(0, 1); + let update_time = url.searchParams.get('update'); + if (update_time) { + let result = await env.mayx_index.getByIds([ + query + ]); + if (result.length) { + let cache = await db.prepare("SELECT `id`, `suggest`, `suggest_update` FROM `blog_summary` WHERE `id` = ?1") + .bind(query).first(); + if (!cache.id) { + return Response.json(resp, { + headers: commonHeader + }); + } + if (update_time != cache.suggest_update) { + resp = await env.mayx_index.query(result[0].values, { topK: 6 }); + resp = resp.matches; + resp.splice(0, 1); + await db.prepare("UPDATE `blog_summary` SET `suggest_update` = ?1, `suggest` = ?2 WHERE `id` = ?3") + .bind(update_time, JSON.stringify(resp), query).run(); + } else { + resp = JSON.parse(cache.suggest); + } + } + resp = resp.map(respObj => { + respObj.id = encodeURI(respObj.id); + return respObj; + }); } - resp = resp.map(respObj => { - respObj.id = encodeURI(respObj.id); - return respObj; - }); return Response.json(resp, { headers: commonHeader }); @@ -37,11 +53,11 @@ if (url.pathname.startsWith("/suggest")) { 我还想到一个办法，我之前[给博客做过全文搜索的功能](/2021/07/23/search.html)，用这个JS关联查询就能查到标题，而且查不到的内容也显示不出来，这样就能避免有人故意乱上传导致显示奇怪的内容了，不过之前的设计是每次查询都要加载一次包含我文章内容的JSON文件，感觉不太合理，虽然那个文件不算特别大，但是也挺影响速度的，所以我想了一下还是用localStorage缓存一下比较好，所以增加了一个能缓存获取搜索JSON的函数： ```javascript function getSearchJSON(callback) { - var searchData = JSON.parse(localStorage.getItem(lastUpdated)); + var searchData = JSON.parse(localStorage.getItem("blog_" + lastUpdated.valueOf())); if (!searchData) { localStorage.clear(); $.getJSON("/search.json", function (data) { - localStorage.setItem(lastUpdated, JSON.stringify(data)); + localStorage.setItem("blog_" + lastUpdated.valueOf(), JSON.stringify(data)); callback(data); }); } else { @@ -49,12 +65,12 @@ function getSearchJSON(callback) { } } ``` - 做好这个之后就可以做文章推荐的功能了，不过文章推荐应不应该加载完页面就加载呢？其实我测了一下Vectorize数据库的查询速度，不算很慢，但还是需要时间，另外免费版我看了下额度是每月3000万个查询的向量维度，这个其实我没看太懂😂。另外Cloudflare不知道为什么没有展示免费版剩余的额度，而且它是按月计算的，导致我不敢乱用这个查询。 ~~所以我想了一下还是给个按钮来调用吧~~ （后来想了一下干脆直接调用然后加个缓存吧，毕竟我文章不变推荐也不会变）。最终调用的函数如下： + 做好这个之后就可以做文章推荐的功能了，不过文章推荐应不应该加载完页面就加载呢？其实我测了一下Vectorize数据库的查询速度，不算很慢，但还是需要时间，另外免费版我看了下额度是每月3000万个查询的向量维度，这个其实我没看太懂😂。另外Cloudflare不知道为什么没有展示免费版剩余的额度，而且它是按月计算的，导致我不敢乱用这个查询。 ~~所以我想了一下还是给个按钮来调用吧~~ （后来想了一下干脆直接调用然后加个缓存吧，毕竟我的文章不变，推荐内容也不会变）。最终调用的函数如下： ```javascript function getSuggestBlog(blogurl) { var suggest = $("#suggest-container")[0]; suggest.innerHTML = "Loading..."; - $.get(BlogAPI + "/suggest?id=" + blogurl, function (data) { + $.get(BlogAPI + "/suggest?id=" + blogurl + "&update=" + lastUpdated.valueOf(), function (data) { if (data.length) { getSearchJSON(function (search) { suggest.innerHTML = '推荐文章
'; diff --git a/js/main.js b/js/main.js index c27bf3a..ad460a2 100644 --- a/js/main.js +++ b/js/main.js @@ -1,4 +1,3 @@ -var BlogAPI = "https://summary.mayx.eu.org"; (function () { var $backToTopTxt = "返回顶部", $backToTopEle = $('
').appendTo($("body")) .text($backToTopTxt).attr("title", $backToTopTxt).click(function () { -- cgit 1.4.1-2-gfad0