博文

目前显示的是 二月, 2024的博文

无服务器 自建短链服务 Url-Shorten-Worker 变身日记本 NetJournal 支持Markdown

图片
上一篇我们解决了网络日记本 NetJournal 从无到有的核心后台逻辑 . 现在要来解决使用效果了. 谁也不想日记本里面只能用文字+emoji+ascii艺术吧.  那想一想, 最好的解决方案就是 Markdown 了. 启发 找 GPT 一问, 给了一个很好的例子. https://devv.ai/zh/search?threadId=dbr3kt6te3uo 核心代码就是这一小段 document.getElementById('markdown-content').addEventListener('input', function () {   const markdownContent = document.getElementById('markdown-content').value;   const htmlPreview = document.getElementById('html-preview');   htmlPreview.innerHTML = marked.parse(markdownContent); }); 实践 把这一段抄到我们的index.html里面去, 添加一个card, 里面显示我们当前输入的Markdown文本的效果. 还可以把这样的显示效果融合到显示列表中. function buildValueMarkdown(longUrl) {   let valueMarkdown = document.createElement('div')   valueMarkdown.classList.add("form-control")     valueMarkdown.innerHTML = marked.parse(longUrl)   return valueMarkdown } buildValueItemFunc = buildValueMarkdown 在调试过程中, 发现一个问题. 如果我把日记内容写得比较复杂, 里面就会带上一些 [] ! () # 这类符号, 并且还有换行. 当我在index.html调用API去查询单条记录的时候, 报错说json格式有什么问题. 但是我用 loadKV 去查询全部的时候,

无服务器 自建短链服务 Url-Shorten-Worker 变身网络日记本 NetJournal

图片
前面我们已经实现了 网络记事本 PasteBin , 用于托管自己的一段文本. 演示站:  https://pastebin.icdyct.cloudns.asia/tieludasiliqiuweiyue 如果想作为自己的一份日记本的话, 用起来会有一点不顺手. 比如, 如果你把这个页面作为主要的操作页面, 而不是从别的地方写好了再复制粘贴过来, 那么这个页面并不能让你写一点了保存一下, 再写一点了再保存一下. 你点保存的时候会提示 key 存在冲突. 还有一点就是, 当你确定要修改某一篇日记时, 还要去显示列表中找到它, 有点不方便. 思路 一是实现一下, 在向数据库保存key-value时, 不要检测key是否已存在(在之前的短链系统中, 是检测了的) 二是增加读取指定key-value的小功能. 点击了 Load 按钮之后, 从数据库中把 value 读出来, 再把数据放到原本的操作界面上.  后续操作就可以按以前系统的操作方式使用就好了. 实践 worker.js 增加一个配置项 overwrite_kv 设置为 true 时, 添加key-value时就不检测key是否存在了. main.js 里面加一个读指定key-value的函数.  index.html 里面添加几个页面元素就不细讲了. ======= 完 Github:  https://github.com/crazypeace/url-Shorten-Worker/ 演示站:  https://journal.crazypeace.workers.dev/journaljournal

The Hot3 in Last 30 Days

ClouDNS .asia免费域名 托管到CloudFlare开CDN白嫖Websocket WS通道翻墙 / desec.io

无服务器 自建短链服务 Url-Shorten-Worker 完整的部署教程