开源一个无后端也无前端彻底无服务的网页版记事本

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

爱意满满的作品展示区。

这是一个创建于 366 天前的主题，其中的信息可能已经有所发展或是发生改变。

data:text/html;base64,PGh0bWwgY29udGVudGVkaXRhYmxlPmVkaXQgbWU8L2h0bWw+

复制到浏览器即可使用，可加书签，可分享，不需要网络，全平台可用

有时候需要有个地方临时复制粘贴一些东西，这时候可以用记事本，但是记事本或者其他文本编辑软件关闭时一般需要确认是否保存，且这些临时内容会和工作内容混合

还有个问题是记事本页面不够大，ui 也略复杂一点

这个网页版记事本就能支持这种场景，原则上不支持保存，随用随关，铺满全屏

而且我觉得最有意思的点是，这其实是一个彻底开源极端易于分享的软件形式，软件所有内容都塞到 url 数据里，所见即所得，无需安装，适配全平台，用户还能随时修改逻辑，无需网络，没有服务器成本

缺点是软件大小有限制以及软件作者可能不太好赚钱

记事本

软件

开源

内容会

147 条回复 • 2023-07-21 14:24:25 +08:00

1 2

❮

❯

2023-06-01 02:00:03 +08:00 via Android

有点意思

hanxiV2EX

2023-06-01 05:19:27 +08:00 via Android

可以加联网过得更多 vip 功能鸭

wonderfulcxm

2023-06-01 06:51:51 +08:00 via iPhone

这么牛逼

tulongtou

2023-06-01 07:24:21 +08:00

有意思，从 IDE 粘贴代码过去，竟然高亮缩紧都带

dawn009

2023-06-01 08:22:51 +08:00

这个思路有点意思

luchenwei9266

2023-06-01 08:33:19 +08:00

有意思，查了一下原理是用了 Data URL ，Data URL 由四个部分组成：前缀（ data:）、指示数据类型的 MIME 类型、如果非文本则为可选的 base64 标记、数据本身

nitmali

2023-06-01 08:33:26 +08:00

<html contenteditable>
HTMLElement.contentEditable

sxfscool

2023-06-01 08:41:49 +08:00

怎么更新链接呢，手动 base64?

cyio

2023-06-01 08:45:17 +08:00

如果不需要编辑

data:text/html;charset=utf-8,%E4%BD%A0%E5%A5%BD%EF%BC%8Cmy world

cyio

2023-06-01 08:50:13 +08:00

可读版本

data:text/html;charset=utf-8,<html contenteditable>1. </html>

zhcode

2023-06-01 08:55:16 +08:00

竟然还可以直接粘贴图片，这可比记事本强多了

zhcode

2023-06-01 08:57:28 +08:00

还有快捷键

retrocode

2023-06-01 09:01:40 +08:00

好活啊

luemail2023

2023-06-01 09:03:32 +08:00

厉害

ljsh093

2023-06-01 09:07:09 +08:00

@hanxiV2EX #2 先加个微信扫码才能用吧

Jonz

2023-06-01 09:08:57 +08:00

有点意思

jy02534655

2023-06-01 09:14:05 +08:00

高呀

lingeo

2023-06-01 09:18:53 +08:00

编辑后怎么生成自己的 url 呢？

imwhizzkid

2023-06-01 09:23:36 +08:00

标题不是说开源吗，源码在哪里？

cwcc

2023-06-01 09:25:37 +08:00

这样你甚至还能插入图片、按 Ctrl+S 保存为一个文件，在文件夹内双击还能打开，简直是一个超级无敌的记事本（真不是反话，感觉突然打开了浏览器的新世界）！

sunjiayao

2023-06-01 09:25:55 +08:00

@imwhizzkid #19 猜猜那串 base64 是什么

hervey0424

2023-06-01 09:27:25 +08:00

@imwhizzkid 源码就在 url 中哈哈

ifzm

2023-06-01 09:28:27 +08:00

卧槽，有点东西 😮

imwhizzkid

2023-06-01 09:28:27 +08:00

@sunjiayao 原来如此，谢了

HeyWeGo

2023-06-01 09:30:15 +08:00

windows 下可以配合 chrome 的 frame ，以无 tab 的方式启动这样一个页面。
建立一个这样的快捷方式（其中"C:\Program Files\Google\Chrome\Application\chrome.exe"为 chrome 的路径，自行修改）
"C:\Program Files\Google\Chrome\Application\chrome.exe" --chrome-frame --app=data:text/html;base64,PGh0bWwgY29udGVudGVkaXRhYmxlPmVkaXQgbWU8L2h0bWw+

lingeo

2023-06-01 09:34:41 +08:00

把别的 IDE 的格式复制过去后，没法再回到纯文本的模式了。

simo

2023-06-01 09:36:29 +08:00

你们都说的是真话么，怎么没 get 到点
怎么还有开源，软件，作者

chaslee

2023-06-01 09:39:55 +08:00

甚至可以保存成 html 分享

meeop

2023-06-01 09:41:09 +08:00 via Android

@lingeo 这个问题你可以改下代码，改成 text area 啥的

Judoon

2023-06-01 09:47:30 +08:00

data:text/html;base64,PGh0bWwgY29udGVudGVkaXRhYmxlPuS9oOWlvTwvaHRtbD4K

中文乱码怎么解决呀

jifengg

2023-06-01 09:47:53 +08:00

有意思，看到标题“无前端”我还在想是啥，进来看到 data: 就懂了，妙！

Liuman

2023-06-01 09:52:20 +08:00

好活，超级有意思，我改了一下，增加了导出到剪切板功能

data:text/html;charset=utf-8,<html contenteditable=""><head> <title>导出页面内容为 UTF-8 到剪切板</title> <script> function copyToClipboard() { var htmlContent = document.documentElement.outerHTML; var tempInput = document.createElement("textarea"); tempInput.style.opacity = 0; tempInput.value = 'data:text/html;charset=utf-8,' +htmlContent; document.body.appendChild(tempInput); tempInput.select(); document.execCommand("copy"); document.body.removeChild(tempInput); alert("已复制"); } </script> </head> <body> <h1>导出页面内容为 UTF-8 到剪切板</h1> <button onclick="copyToClipboard()">导出为 UTF-8</button> <hr>这里开始编辑</body></html>

meeop

2023-06-01 09:53:36 +08:00 via Android

@lingeo 编辑后的 html 内容 base64 一下然后重新拼一个链接，如果没有 url 限制的字符的话楼上 @cyio 的明文版本就挺好的

handblankt

2023-06-01 09:54:06 +08:00

确实牛

mdyh

2023-06-01 09:54:40 +08:00

@HeyWeGo #25 mac 有办法这么操作不？

搞个快捷启动，感觉很好用了

meeop

2023-06-01 09:55:35 +08:00 via Android

@Judoon 你改成标准 html 格式就不会了，html 协议支持设置编码格式，直接给个纯文本浏览器也不知道你是啥编码啊,或者看楼上 cyio 的版本

meeop

2023-06-01 09:57:19 +08:00 via Android

@mdyh 直接收藏到书签即可

mdyh

2023-06-01 09:59:05 +08:00

@meeop #37 收藏以后，能不能有快捷键启动呢

一会去搜一下看看怎么快捷启动书签，🥲

molvqingtai

2023-06-01 09:59:38 +08:00

我也会，开源一个无后端也无前端测底无服务的编辑器，实时渲染 HTML 、CSS 、JS

粘贴到浏览器看效果：
data:text/html,<body oninput="i.srcdoc=h.value+'<style>'+c.value+'</style><script>'+j.value+'</script>'"><style>textarea,iframe{width:100%;height:50%}body{margin:0}textarea{width:33.33%;font-size:18}</style><textarea placeholder=HTML id=h></textarea><textarea placeholder=CSS id=c></textarea><textarea placeholder=JS id=j></textarea><iframe id=i>

handblankt

2023-06-01 10:00:25 +08:00

好牛，还能叠加什么好玩的功能呢？

handblankt

2023-06-01 10:07:58 +08:00

自动保存，加密，分享？

meeop

2023-06-01 10:08:47 +08:00 via Android

@molvqingtai 我都不知道还能这么干，这不比网上那些在线网页编辑器轻便多了

Maboroshii

2023-06-01 10:13:04 +08:00

真佩服你们这种天才！收藏了

handblankt

2023-06-01 10:19:29 +08:00

// 自动保存
setInterval(function() {
localStorage.setItem('note', document.getElementById('note').value);
}, 5000); // 每 5 秒自动保存一次

// 云同步
function syncToCloud() {
var note = document.getElementById('note').value;
// 将 note 同步到云端的代码
}

huiyadanli

2023-06-01 10:21:37 +08:00

再加功能然后变成小书签🤣

israinbow

2023-06-01 10:22:52 +08:00 via Android

https://github.com/zserge/awfice

🤣用活浏览器

meeop

2023-06-01 10:33:20 +08:00

@israinbow 厉害,这个项目都快 2k start 了

meeop

2023-06-01 10:34:05 +08:00

分享 https://github.com/zserge/awfice 里的几个代码

网页版本画图
data:text/html,<canvas id=v><script>d=document,d.body.style.margin=0,P="onpointer",c=v.getContext`2d`,v.width=innerWidth,v.height=innerHeight,c.lineWidth=2,f=0,d[P+"down"]=e=>{f=e.pointerId+1;e.preventDefault();c.beginPath();c.moveTo(e.x,e.y)};d[P+"move"]=e=>{f==e.pointerId+1&&c.lineTo(e.x,e.y);c.stroke()},d[P+"up"]=_=>f=0</script></canvas>

meeop

2023-06-01 10:35:15 +08:00

没啥用的计算器

data:text/html,<table style="text-align: center;width:80vw;margin: 0 auto;"><tbody><tr><td colspan="4"><textarea></textarea></td></tr></tbody><script>let d=document;let tbl=d.querySelector('tbody');let z=d.querySelector('textarea');let oc=(x)=>z.value+=x;let cl=()=>z.value='';let re=()=>{try{z.value=eval(z.value);}catch(error){cl();}};[[1,2,3,'+'],[4,5,6,'-'],[7,8,9,'*'],['C',0,'=','/']].forEach((a)=>{let r=d.createElement('tr');r.style.lineHeight='64px';tbl.appendChild(r);a.forEach((b)=>{let tb=d.createElement('tb');tb.innerText=b;tb.style.padding='16px';tb.style.border='1px solid';r.appendChild(tb);tb.onclick=b==='='?re:b===%27C%27?cl:()=%3Eoc(b);})})%3C/script%3E%3C/table%3E

weijancc

2023-06-01 10:46:12 +08:00

很有意思, 建议加点边距, 在左上角视角不太好

Vegetable

2023-06-01 10:52:35 +08:00

现在编程领域，好像很少感受到“用更少的代码去实现好玩的功能”这种文化了。

iMusic

2023-06-01 10:54:03 +08:00

@molvqingtai 妙啊

xinh

2023-06-01 11:13:44 +08:00

这个挺好的，临时记录点东西，都玩出花了

codehz

2023-06-01 11:16:43 +08:00

data:text/html;charset=utf-8,<style>html{height:100%;display:flex;color-scheme:dark light}body{flex:1;flex-direction:column;font-family:system-ui}#t{position:sticky;padding:8px;inset: 0 0 auto;gap:4px}#t,button,body{display:flex}#e{flex:1;padding:8px;font-size:150%}</style><script>r=()=>f?.text().then(x=>f.type='text/html'?e.innerHTML=x:e.innerText=x)</script><body><div id=t><button onclick="e.innerHTML=''">🚮<button onclick="o.showPicker()">📂<button onclick="a.href=`data:text/${p.checked?'plain':'html'};charset=utf-8,${encodeURIComponent (p.checked?e.innerText:e.innerHTML)}`;a.click()">💾</button><input id=o hidden type=file onchange="f=o.files[0];r()"><label><input type=checkbox id=p onchange="e.contentEditable=p.checked?'plaintext-only':'true'">plaintext</label><a hidden id=a download=draft></div><div id=e contenteditable ondrop="f=event.dataTransfer.files[0];r();return false">
支持保存 html 到本地（点💾按钮），从本地加载（点📂或者直接拖文件进去，支持 html 和 text ），支持暗色模式自动切换，支持选择纯文本编辑模式（此时也会保存为 txt 文件）

xjpicism

2023-06-01 11:21:04 +08:00

要是支持发文件的话直接发单个 html 文件更简洁

data url 大部分聊天工具应该都不支持点击打开

meeop

2023-06-01 11:24:30 +08:00

@codehz 我贴到浏览器好像用不了,应该是代码里有特殊字符导致的,我用 base64 编码了下
data:text/html;base64,PHN0eWxlPmh0bWx7aGVpZ2h0OjEwMCU7ZGlzcGxheTpmbGV4O2NvbG9yLXNjaGVtZTpkYXJrIGxpZ2h0fWJvZHl7ZmxleDoxO2ZsZXgtZGlyZWN0aW9uOmNvbHVtbjtmb250LWZhbWlseTpzeXN0ZW0tdWl9I3R7cG9zaXRpb246c3RpY2t5O3BhZGRpbmc6OHB4O2luc2V0OiAwIDAgYXV0bztnYXA6NHB4fSN0LGJ1dHRvbixib2R5e2Rpc3BsYXk6ZmxleH0jZXtmbGV4OjE7cGFkZGluZzo4cHg7Zm9udC1zaXplOjE1MCV9PC9zdHlsZT48c2NyaXB0PnI9KCk9PmY/LnRleHQoKS50aGVuKHg9PmYudHlwZT0ndGV4dC9odG1sJz9lLmlubmVySFRNTD14OmUuaW5uZXJUZXh0PXgpPC9zY3JpcHQ+PGJvZHk+PGRpdiBpZD10PjxidXR0b24gb25jbGljaz0iZS5pbm5lckhUTUw9JyciPmRlbDxidXR0b24gb25jbGljaz0iby5zaG93UGlja2VyKCkiPm9wZW48YnV0dG9uIG9uY2xpY2s9ImEuaHJlZj1gZGF0YTp0ZXh0LyR7cC5jaGVja2VkPydwbGFpbic6J2h0bWwnfTtjaGFyc2V0PXV0Zi04LCR7ZW5jb2RlVVJJQ29tcG9uZW50IChwLmNoZWNrZWQ/ZS5pbm5lclRleHQ6ZS5pbm5lckhUTUwpfWA7YS5jbGljaygpIj5zYXZlPC9idXR0b24+PGlucHV0IGlkPW8gaGlkZGVuIHR5cGU9ZmlsZSBvbmNoYW5nZT0iZj1vLmZpbGVzWzBdO3IoKSI+PGxhYmVsPjxpbnB1dCB0eXBlPWNoZWNrYm94IGlkPXAgb25jaGFuZ2U9ImUuY29udGVudEVkaXRhYmxlPXAuY2hlY2tlZD8ncGxhaW50ZXh0LW9ubHknOid0cnVlJyI+cGxhaW50ZXh0PC9sYWJlbD48YSBoaWRkZW4gaWQ9YSBkb3dubG9hZD1kcmFmdD48L2Rpdj48ZGl2IGlkPWUgY29udGVudGVkaXRhYmxlIG9uZHJvcD0iZj1ldmVudC5kYXRhVHJhbnNmZXIuZmlsZXNbMF07cigpO3JldHVybiBmYWxzZSI+

codehz

2023-06-01 11:25:58 +08:00

@meeop 被当作搜索了吗？我这边是可以用的(Arc 浏览器，手动选择按 url 打开)，此外 emoji 的问题可以通过 text/html;charset=utf-8,来解决

iblessyou

2023-06-01 11:41:23 +08:00

@codehz 你最先那个我删了 style 部分就可以了

cleardevstudio

2023-06-01 12:24:24 +08:00

好久没见过这么好的活了，赞

kkocdko

2023-06-01 12:59:29 +08:00 via Android

我记得 GitHub 上有个这种项目，还收集了一些 canvas 画画之类的功能。可惜当时没 star

mokevip

2023-06-01 13:06:50 +08:00

翻译一下
data:text/html;text,<html contenteditable>edit me</html>

Tsuj100

2023-06-01 13:54:24 +08:00

最简单的才是最好用的

hs0000t

2023-06-01 14:03:55 +08:00 via Android

最简化版：data:text/html;,<html contenteditable>

wangofjian

2023-06-01 14:04:16 +08:00

临时记录方便了

storyxc

2023-06-01 14:12:54 +08:00

interesting

kiritoxf

2023-06-01 14:24:34 +08:00

添加了可以切换显示 /隐藏 HTML/CSS/JavaScript/Output 的功能

data:text/html,<body oninput="i.srcdoc=h.value+'<style>'+c.value+'</style><script>'+j.value+'</script>'"><style> textarea, iframe { width: 100%; height: 50%; background-color: rgb(245, 245, 245); } body { margin: 0; background-color: rgb(245, 245, 245); } textarea, iframe { width: 33.3%; height: 100%; flex: 1; font-size: 18; resize: none; } textarea:focus { background-color: white; } .menu { text-align: center; overflow: hidden; width: 100%; padding: 5px 0; } .panels { display: flex; justify-content: center; height: calc(100% - 40px); }</style><script> function switchDisplay(id) { var dom = document.getElementById(id); if (!dom) return; if (dom.style.display !== '') { dom.style.display = ''; return; } if (dom.style.display === '') { dom.style.display = 'none'; return; } }</script><div class="menu"><button onclick="switchDisplay('h')">HTML</button><button onclick="switchDisplay('c')">CSS</button><button onclick="switchDisplay('j')">JavaScript</button><button onclick="switchDisplay('i')">Output</button></div><div class="panels"><textarea placeholder=HTML id=h></textarea><textarea placeholder=CSS id=c></textarea><textarea placeholder=JS id=j></textarea><iframe id=i></div>

dongdongdong

2023-06-01 14:26:11 +08:00

interesting

wydinhk

2023-06-01 14:29:25 +08:00

@weijancc 加入左右边距、更换系统字体

data:text/html,<body contenteditable style=line-height:1.5;margin-left:20%;margin-right:20%;font-family:system-ui>

sss15

2023-06-01 14:36:48 +08:00

@Liuman #32 你这个不错，已经用上了，收藏了

romisanic

2023-06-01 14:38:00 +08:00

能不能搞一个 json 编辑器，可以上下或者两边对比的那种

kile

2023-06-01 14:41:58 +08:00

好活好活,举一反三创意满满,收藏了

v135ex

2023-06-01 14:49:35 +08:00

双屏对照版
data:text/html;text,<html><body style="display:flex"><div contenteditable style="flex:1;padding:5px"></div><div contenteditable style="flex:1;padding:5px"></div></body></html>

oneisall8955

2023-06-01 15:20:44 +08:00

去年站内有人做过左右分屏，用于翻译的

zhouyg

2023-06-01 15:35:25 +08:00

好活有点意思，相当于直接分享一个 html 了

ZeroDu

2023-06-01 15:37:15 +08:00

@zhcode #12 666 ，确实还可以有快捷键，字体加粗斜体，下划线

aduangduang

2023-06-01 15:51:09 +08:00

一键清理浏览器垃圾

data:text/html;charset=utf-8,<script>while(1){Math.random()*Math.random()/Math.random()}alert('清理完成');</script>

taogen

2023-06-01 15:58:16 +08:00

有没有大佬整一个 Markdown 编辑器？

Jonz

2023-06-01 16:03:33 +08:00

@israinbow 宝藏项目，star 了

gggyyybbb

2023-06-01 16:04:24 +08:00

好活！超级有意思

DOLLOR

2023-06-01 16:16:14 +08:00

视频播放器

data:text/html;base64,PCFET0NUWVBFIGh0bWw+DQo8aW5wdXQgdHlwZT0iZmlsZSIgaWQ9ImlucHV0IiBhY2NlcHQ9InZpZGVvLyoiPg0KPGJyPg0KPHZpZGVvIHNyYz0iIiBpZD0idmlkZW8iIGNvbnRyb2xzIGF1dG9wbGF5PjwvdmlkZW8+DQo8c2NyaXB0Pg0KICBpbnB1dC5vbmNoYW5nZSA9ICgpID0+IHsNCiAgICBjb25zdCBmaWxlID0gaW5wdXQuZmlsZXM/LlswXTsNCiAgICBpZiAoZmlsZSkgew0KICAgICAgdmlkZW8uc3JjID0gVVJMLmNyZWF0ZU9iamVjdFVSTChmaWxlKTsNCiAgICB9DQogIH07DQo8L3NjcmlwdD4=

zhaol

2023-06-01 16:27:47 +08:00

支持将编辑内容一键复制成 url 分享给其他人

data:text/html;base64,PGh0bWw+PGhlYWQ+CiAgICA8bWV0YSBjaGFyc2V0PSJVVEYtOCI+CiAgICA8bWV0YSBodHRwLWVxdWl2PSJYLVVBLUNvbXBhdGlibGUiIGNvbnRlbnQ9IklFPWVkZ2UiPgogICAgPG1ldGEgbmFtZT0idmlld3BvcnQiIGNvbnRlbnQ9IndpZHRoPWRldmljZS13aWR0aCwgaW5pdGlhbC1zY2FsZT0xLjAiPgogICAgPHRpdGxlPkRvY3VtZW50PC90aXRsZT4KICA8L2hlYWQ+CiAgPGJvZHk+CiAgICA8YnV0dG9uIGlkPSJidG4iPuWwhue8lui+keWGheWuueWkjeWItuS4ukRhdGFVcmw8L2J1dHRvbj4KICAgIDxkaXYgaWQ9ImVkaXRvci1hcmVhIiBjb250ZW50ZWRpdGFibGU9IiI+PC9kaXY+CiAgCiAgPHN0eWxlPgogICAgI2VkaXRvci1hcmVhIHsKICAgICAgd2lkdGg6IDEwMCU7CiAgICAgIGhlaWdodDogY2FsYygxMDB2aCAtIDgwcHgpOwogICAgICBtYXJnaW4tdG9wOiAyMHB4OwogICAgICBvdmVyZmxvdzogc2Nyb2xsOwogICAgICBvdXRsaW5lOiAxcHggc29saWQgZ3JheTsKICAgIH0KICA8L3N0eWxlPgogIDxzY3JpcHQ+CiAgICBmdW5jdGlvbiB1dGY4X3RvX2I2NChzdHIpIHsKICAgICAgcmV0dXJuIHdpbmRvdy5idG9hKHVuZXNjYXBlKGVuY29kZVVSSUNvbXBvbmVudChzdHIpKSk7CiAgICB9CgogICAgLy8gZnVuY3Rpb24gYjY0X3RvX3V0Zjgoc3RyKSB7CiAgICAvLyAgIHJldHVybiBkZWNvZGVVUklDb21wb25lbnQoZXNjYXBlKHdpbmRvdy5hdG9iKHN0cikpKTsKICAgIC8vIH0KCiAgICBjb25zdCBidG4gPSBkb2N1bWVudC5xdWVyeVNlbGVjdG9yKCIjYnRuIik7CiAgICBidG4uYWRkRXZlbnRMaXN0ZW5lcigiY2xpY2siLCAoKSA9PiB7CiAgICAgIGNvbnN0IGh0bWxDb250ZW50ID0gZG9jdW1lbnQucXVlcnlTZWxlY3RvcigiaHRtbCIpOwogICAgICBjb25zb2xlLmxvZyhodG1sQ29udGVudC5pbm5lckhUTUwpOwogICAgICBjb25zdCBkYXRhVXJsID0gIjxodG1sPiIgKyBodG1sQ29udGVudC5pbm5lckhUTUwgKyAiPC9odG1sPiI7CiAgICAgIGNvbnN0IGJhc2U2NCA9IHV0ZjhfdG9fYjY0KGRhdGFVcmwpOwogICAgICAvLyBjb25zb2xlLmxvZyhiYXNlNjQpOwoKICAgICAgY29uc3QgaW5wdXRWYWx1ZSA9IGBkYXRhOnRleHQvaHRtbDtiYXNlNjQsJHtiYXNlNjR9YAogICAgICBjb25zdCBpbnB1dCA9IGRvY3VtZW50LmNyZWF0ZUVsZW1lbnQoImlucHV0Iik7CiAgICAgIGlucHV0LnNldEF0dHJpYnV0ZSgicmVhZG9ubHkiLCAicmVhZG9ubHkiKTsKICAgICAgaW5wdXQuc2V0QXR0cmlidXRlKCJ2YWx1ZSIsIGlucHV0VmFsdWUpOwogICAgICBkb2N1bWVudC5ib2R5LmFwcGVuZENoaWxkKGlucHV0KTsKICAgICAgaW5wdXQuc2V0U2VsZWN0aW9uUmFuZ2UoMCwgOTk5OSk7CiAgICAgIGlucHV0LnNlbGVjdCgpOwogICAgICBkb2N1bWVudC5leGVjQ29tbWFuZCgiY29weSIpOwogICAgICBkb2N1bWVudC5ib2R5LnJlbW92ZUNoaWxkKGlucHV0KTsKICAgIH0pOwogIDwvc2NyaXB0PgoKPC9ib2R5PjwvaHRtbD4=

Lentin

2023-06-01 16:28:23 +08:00

@codehz #54 @meeop #56 Chrome 里面#号部分被忽略掉了需要 urlencode 处理
data:text/html;charset=utf-8,%3Cstyle%3Ehtml%7Bheight%3A100%25%3Bdisplay%3Aflex%3Bcolor-scheme%3Adark%20light%7Dbody%7Bflex%3A1%3Bflex-direction%3Acolumn%3Bfont-family%3Asystem-ui%7D%23t%7Bposition%3Asticky%3Bpadding%3A8px%3Binset%3A%200%200%20auto%3Bgap%3A4px%7D%23t%2Cbutton%2Cbody%7Bdisplay%3Aflex%7D%23e%7Bflex%3A1%3Bpadding%3A8px%3Bfont-size%3A150%25%7D%3C%2Fstyle%3E%3Cscript%3Er%3D%28%29%3D%3Ef%3F.text%28%29.then%28x%3D%3Ef.type%3D%27text%2Fhtml%27%3Fe.innerHTML%3Dx%3Ae.innerText%3Dx%29%3C%2Fscript%3E%3Cbody%3E%3Cdiv%20id%3Dt%3E%3Cbutton%20onclick%3D%22e.innerHTML%3D%27%27%22%3E%F0%9F%9A%AE%3Cbutton%20onclick%3D%22o.showPicker%28%29%22%3E%F0%9F%93%82%3Cbutton%20onclick%3D%22a.href%3D%60data%3Atext%2F%24%7Bp.checked%3F%27plain%27%3A%27html%27%7D%3Bcharset%3Dutf-8%2C%24%7BencodeURIComponent%20%28p.checked%3Fe.innerText%3Ae.innerHTML%29%7D%60%3Ba.click%28%29%22%3E%F0%9F%92%BE%3C%2Fbutton%3E%3Cinput%20id%3Do%20hidden%20type%3Dfile%20onchange%3D%22f%3Do.files%5B0%5D%3Br%28%29%22%3E%3Clabel%3E%3Cinput%20type%3Dcheckbox%20id%3Dp%20onchange%3D%22e.contentEditable%3Dp.checked%3F%27plaintext-only%27%3A%27true%27%22%3Eplaintext%3C%2Flabel%3E%3Ca%20hidden%20id%3Da%20download%3Ddraft%3E%3C%2Fdiv%3E%3Cdiv%20id%3De%20contenteditable%20ondrop%3D%22f%3Devent.dataTransfer.files%5B0%5D%3Br%28%29%3Breturn%20false%22%3E

hemingway

2023-06-01 16:28:28 +08:00

这个有意思，牛

Lentin

2023-06-01 16:30:26 +08:00

javascript:location.href="https://web.archive.org/save/"+location.href;

歪个楼，一键存档当前网页=。=

qzwlecr

2023-06-01 17:21:24 +08:00

@zhaol 这个好，正琢磨着怎么实现一个类似的功能，就有现成的了🤣

daokedao

2023-06-01 17:24:20 +08:00

有意思

shinession

2023-06-01 17:27:32 +08:00

好活, 收藏支持一下

liuidetmks

2023-06-01 17:27:41 +08:00

有趣

duanxianze

2023-06-01 17:39:34 +08:00

好活！

zhaol

2023-06-01 17:41:07 +08:00

@qzwlecr 哈哈，好玩试试的，简单点文本可以。但是如果放图片的话，字数太长，微信限制字数了，分享不了。

summerLast

2023-06-01 17:45:56 +08:00

画板

data:text/html;base64,PGNhbnZhcyBpZD12PjxzY3JpcHQ+ZD1kb2N1bWVudCxkLmJvZHkuc3R5bGUubWFyZ2luPTAsUD0ib25wb2ludGVyIixjPXYuZ2V0Q29udGV4dGAyZGAsdi53aWR0aD1pbm5lcldpZHRoLHYuaGVpZ2h0PWlubmVySGVpZ2h0LGMubGluZVdpZHRoPTIsZj0wLGRbUCsiZG93biJdPWU9PntmPWUucG9pbnRlcklkKzE7ZS5wcmV2ZW50RGVmYXVsdCgpO2MuYmVnaW5QYXRoKCk7Yy5tb3ZlVG8oZS54LGUueSl9O2RbUCsibW92ZSJdPWU9PntmPT1lLnBvaW50ZXJJZCsxJiZjLmxpbmVUbyhlLngsZS55KTtjLnN0cm9rZSgpfSxkW1ArInVwIl09Xz0+Zj0wPC9zY3JpcHQ+PC9jYW52YXM+