V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
meeop
V2EX  ›  分享创造

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

  meeop · 2023-06-01 01:12:48 +08:00 · 15400 次点击
这是一个创建于 539 天前的主题,其中的信息可能已经有所发展或是发生改变。

data:text/html;base64,PGh0bWwgY29udGVudGVkaXRhYmxlPmVkaXQgbWU8L2h0bWw+

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

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

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

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

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

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

150 条回复    2024-07-30 18:09:20 +08:00
1  2  
ob
    1
ob  
   2023-06-01 02:00:03 +08:00 via Android
有点意思
hanxiV2EX
    2
hanxiV2EX  
   2023-06-01 05:19:27 +08:00 via Android
可以加联网过得更多 vip 功能鸭
wonderfulcxm
    3
wonderfulcxm  
   2023-06-01 06:51:51 +08:00 via iPhone
这么牛逼
tulongtou
    4
tulongtou  
   2023-06-01 07:24:21 +08:00
有意思,从 IDE 粘贴代码过去,竟然高亮缩紧都带
dawn009
    5
dawn009  
   2023-06-01 08:22:51 +08:00
这个思路有点意思
luchenwei9266
    6
luchenwei9266  
   2023-06-01 08:33:19 +08:00
有意思,查了一下原理是用了 Data URL ,Data URL 由四个部分组成:前缀( data:)、指示数据类型的 MIME 类型、如果非文本则为可选的 base64 标记、数据本身
nitmali
    7
nitmali  
   2023-06-01 08:33:26 +08:00
<html contenteditable>
HTMLElement.contentEditable
sxfscool
    8
sxfscool  
   2023-06-01 08:41:49 +08:00
怎么更新链接呢,手动 base64?
cyio
    9
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
    10
cyio  
   2023-06-01 08:50:13 +08:00   ❤️ 3
可读版本

data:text/html;charset=utf-8,<html contenteditable>1. </html>
zhcode
    11
zhcode  
   2023-06-01 08:55:16 +08:00
竟然还可以直接粘贴图片,这可比记事本强多了
zhcode
    12
zhcode  
   2023-06-01 08:57:28 +08:00
还有快捷键
retrocode
    13
retrocode  
   2023-06-01 09:01:40 +08:00
好活啊
luemail2023
    14
luemail2023  
   2023-06-01 09:03:32 +08:00
厉害
ljsh093
    15
ljsh093  
   2023-06-01 09:07:09 +08:00
@hanxiV2EX #2 先加个微信扫码才能用吧
Jonz
    16
Jonz  
   2023-06-01 09:08:57 +08:00
有点意思
jy02534655
    17
jy02534655  
   2023-06-01 09:14:05 +08:00
高呀
lingeo
    18
lingeo  
   2023-06-01 09:18:53 +08:00   ❤️ 1
编辑后怎么生成自己的 url 呢?
imwhizzkid
    19
imwhizzkid  
   2023-06-01 09:23:36 +08:00
标题不是说开源吗,源码在哪里?
cwcc
    20
cwcc  
   2023-06-01 09:25:37 +08:00   ❤️ 1
这样你甚至还能插入图片、按 Ctrl+S 保存为一个文件,在文件夹内双击还能打开,简直是一个超级无敌的记事本(真不是反话,感觉突然打开了浏览器的新世界)!
sunjiayao
    21
sunjiayao  
   2023-06-01 09:25:55 +08:00
@imwhizzkid #19 猜猜那串 base64 是什么
hervey0424
    22
hervey0424  
   2023-06-01 09:27:25 +08:00
@imwhizzkid 源码就在 url 中 哈哈
ifzm
    23
ifzm  
   2023-06-01 09:28:27 +08:00
卧槽,有点东西 😮
imwhizzkid
    24
imwhizzkid  
   2023-06-01 09:28:27 +08:00
@sunjiayao 原来如此,谢了
HeyWeGo
    25
HeyWeGo  
   2023-06-01 09:30:15 +08:00   ❤️ 2
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
    26
lingeo  
   2023-06-01 09:34:41 +08:00   ❤️ 3
把别的 IDE 的格式复制过去后,没法再回到纯文本的模式了。
simo
    27
simo  
   2023-06-01 09:36:29 +08:00
你们都说的是真话么,怎么没 get 到点
怎么还有开源,软件,作者
chaslee
    28
chaslee  
   2023-06-01 09:39:55 +08:00
甚至可以保存成 html 分享
meeop
    29
meeop  
OP
   2023-06-01 09:41:09 +08:00 via Android
@lingeo 这个问题你可以改下代码,改成 text area 啥的
Judoon
    30
Judoon  
   2023-06-01 09:47:30 +08:00
data:text/html;base64,PGh0bWwgY29udGVudGVkaXRhYmxlPuS9oOWlvTwvaHRtbD4K

中文乱码怎么解决呀
jifengg
    31
jifengg  
   2023-06-01 09:47:53 +08:00
有意思,看到标题“无前端”我还在想是啥,进来看到 data: 就懂了,妙!
Liuman
    32
Liuman  
   2023-06-01 09:52:20 +08:00   ❤️ 14
好活, 超级有意思,我改了一下, 增加了导出到剪切板功能

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
    33
meeop  
OP
   2023-06-01 09:53:36 +08:00 via Android
@lingeo 编辑后的 html 内容 base64 一下然后重新拼一个链接,如果没有 url 限制的字符的话楼上 @cyio 的明文版本就挺好的
handblankt
    34
handblankt  
   2023-06-01 09:54:06 +08:00
确实牛
mdyh
    35
mdyh  
   2023-06-01 09:54:40 +08:00
@HeyWeGo #25 mac 有办法这么操作不?

搞个快捷启动,感觉很好用了
meeop
    36
meeop  
OP
   2023-06-01 09:55:35 +08:00 via Android
@Judoon 你改成标准 html 格式就不会了,html 协议支持设置编码格式,直接给个纯文本浏览器也不知道你是啥编码啊,或者看楼上 cyio 的版本
meeop
    37
meeop  
OP
   2023-06-01 09:57:19 +08:00 via Android
@mdyh 直接收藏到书签即可
mdyh
    38
mdyh  
   2023-06-01 09:59:05 +08:00
@meeop #37 收藏以后,能不能有快捷键启动呢

一会去搜一下看看怎么快捷启动书签,🥲
molvqingtai
    39
molvqingtai  
   2023-06-01 09:59:38 +08:00   ❤️ 35
我也会,开源一个无后端也无前端测底无服务的编辑器,实时渲染 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
    40
handblankt  
   2023-06-01 10:00:25 +08:00
好牛,还能叠加什么好玩的功能呢?
handblankt
    41
handblankt  
   2023-06-01 10:07:58 +08:00
自动保存,加密,分享?
meeop
    42
meeop  
OP
   2023-06-01 10:08:47 +08:00 via Android
@molvqingtai 我都不知道还能这么干,这不比网上那些在线网页编辑器轻便多了
Maboroshii
    43
Maboroshii  
   2023-06-01 10:13:04 +08:00
真佩服你们这种天才! 收藏了
handblankt
    44
handblankt  
   2023-06-01 10:19:29 +08:00   ❤️ 1
// 自动保存
setInterval(function() {
localStorage.setItem('note', document.getElementById('note').value);
}, 5000); // 每 5 秒自动保存一次

// 云同步
function syncToCloud() {
var note = document.getElementById('note').value;
// 将 note 同步到云端的代码
}
huiyadanli
    45
huiyadanli  
   2023-06-01 10:21:37 +08:00   ❤️ 1
再加功能然后变成小书签🤣
israinbow
    46
israinbow  
   2023-06-01 10:22:52 +08:00 via Android   ❤️ 4
meeop
    47
meeop  
OP
   2023-06-01 10:33:20 +08:00
@israinbow 厉害,这个项目都快 2k start 了
meeop
    48
meeop  
OP
   2023-06-01 10:34:05 +08:00   ❤️ 1
分享 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
    49
meeop  
OP
   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
    50
weijancc  
   2023-06-01 10:46:12 +08:00
很有意思, 建议加点边距, 在左上角视角不太好
Vegetable
    51
Vegetable  
   2023-06-01 10:52:35 +08:00
现在编程领域,好像很少感受到“用更少的代码去实现好玩的功能”这种文化了。
iMusic
    52
iMusic  
   2023-06-01 10:54:03 +08:00
@molvqingtai 妙啊
xinh
    53
xinh  
   2023-06-01 11:13:44 +08:00
这个挺好的,临时记录点东西,都玩出花了
codehz
    54
codehz  
   2023-06-01 11:16:43 +08:00   ❤️ 2
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
    55
xjpicism  
   2023-06-01 11:21:04 +08:00
要是支持发文件的话 直接发单个 html 文件更简洁

data url 大部分聊天工具应该都不支持点击打开
meeop
    56
meeop  
OP
   2023-06-01 11:24:30 +08:00   ❤️ 2
@codehz 我贴到浏览器好像用不了,应该是代码里有特殊字符导致的,我用 base64 编码了下
data:text/html;base64,PHN0eWxlPmh0bWx7aGVpZ2h0OjEwMCU7ZGlzcGxheTpmbGV4O2NvbG9yLXNjaGVtZTpkYXJrIGxpZ2h0fWJvZHl7ZmxleDoxO2ZsZXgtZGlyZWN0aW9uOmNvbHVtbjtmb250LWZhbWlseTpzeXN0ZW0tdWl9I3R7cG9zaXRpb246c3RpY2t5O3BhZGRpbmc6OHB4O2luc2V0OiAwIDAgYXV0bztnYXA6NHB4fSN0LGJ1dHRvbixib2R5e2Rpc3BsYXk6ZmxleH0jZXtmbGV4OjE7cGFkZGluZzo4cHg7Zm9udC1zaXplOjE1MCV9PC9zdHlsZT48c2NyaXB0PnI9KCk9PmY/LnRleHQoKS50aGVuKHg9PmYudHlwZT0ndGV4dC9odG1sJz9lLmlubmVySFRNTD14OmUuaW5uZXJUZXh0PXgpPC9zY3JpcHQ+PGJvZHk+PGRpdiBpZD10PjxidXR0b24gb25jbGljaz0iZS5pbm5lckhUTUw9JyciPmRlbDxidXR0b24gb25jbGljaz0iby5zaG93UGlja2VyKCkiPm9wZW48YnV0dG9uIG9uY2xpY2s9ImEuaHJlZj1gZGF0YTp0ZXh0LyR7cC5jaGVja2VkPydwbGFpbic6J2h0bWwnfTtjaGFyc2V0PXV0Zi04LCR7ZW5jb2RlVVJJQ29tcG9uZW50IChwLmNoZWNrZWQ/ZS5pbm5lclRleHQ6ZS5pbm5lckhUTUwpfWA7YS5jbGljaygpIj5zYXZlPC9idXR0b24+PGlucHV0IGlkPW8gaGlkZGVuIHR5cGU9ZmlsZSBvbmNoYW5nZT0iZj1vLmZpbGVzWzBdO3IoKSI+PGxhYmVsPjxpbnB1dCB0eXBlPWNoZWNrYm94IGlkPXAgb25jaGFuZ2U9ImUuY29udGVudEVkaXRhYmxlPXAuY2hlY2tlZD8ncGxhaW50ZXh0LW9ubHknOid0cnVlJyI+cGxhaW50ZXh0PC9sYWJlbD48YSBoaWRkZW4gaWQ9YSBkb3dubG9hZD1kcmFmdD48L2Rpdj48ZGl2IGlkPWUgY29udGVudGVkaXRhYmxlIG9uZHJvcD0iZj1ldmVudC5kYXRhVHJhbnNmZXIuZmlsZXNbMF07cigpO3JldHVybiBmYWxzZSI+
codehz
    57
codehz  
   2023-06-01 11:25:58 +08:00
@meeop 被当作搜索了吗?我这边是可以用的(Arc 浏览器,手动选择按 url 打开),此外 emoji 的问题可以通过 text/html;charset=utf-8,来解决
iblessyou
    58
iblessyou  
   2023-06-01 11:41:23 +08:00
@codehz 你最先那个我删了 style 部分就可以了
cleardevstudio
    59
cleardevstudio  
   2023-06-01 12:24:24 +08:00
好久没见过这么好的活了,赞
kkocdko
    60
kkocdko  
   2023-06-01 12:59:29 +08:00 via Android
我记得 GitHub 上有个这种项目,还收集了一些 canvas 画画之类的功能。可惜当时没 star
mokevip
    61
mokevip  
   2023-06-01 13:06:50 +08:00
翻译一下
data:text/html;text,<html contenteditable>edit me</html>
Tsuj100
    62
Tsuj100  
   2023-06-01 13:54:24 +08:00
最简单的才是最好用的
hs0000t
    63
hs0000t  
   2023-06-01 14:03:55 +08:00 via Android   ❤️ 2
最简化版:data:text/html;,<html contenteditable>
wangofjian
    64
wangofjian  
   2023-06-01 14:04:16 +08:00
临时记录方便了
storyxc
    65
storyxc  
   2023-06-01 14:12:54 +08:00
interesting
kiritoxf
    66
kiritoxf  
   2023-06-01 14:24:34 +08:00   ❤️ 1
添加了可以切换显示 /隐藏 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
    67
dongdongdong  
   2023-06-01 14:26:11 +08:00
interesting
wydinhk
    68
wydinhk  
   2023-06-01 14:29:25 +08:00   ❤️ 2
@weijancc 加入左右边距、更换系统字体

data:text/html,<body contenteditable style=line-height:1.5;margin-left:20%;margin-right:20%;font-family:system-ui>
sss15
    69
sss15  
   2023-06-01 14:36:48 +08:00
@Liuman #32 你这个不错,已经用上了,收藏了
romisanic
    70
romisanic  
   2023-06-01 14:38:00 +08:00
能不能搞一个 json 编辑器,可以上下或者两边对比的那种
kile
    71
kile  
   2023-06-01 14:41:58 +08:00
好活好活,举一反三创意满满,收藏了
BUHeF254Lpd1MH06
    72
BUHeF254Lpd1MH06  
   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
    73
oneisall8955  
   2023-06-01 15:20:44 +08:00
去年站内有人做过左右分屏,用于翻译的
zhouyg
    74
zhouyg  
   2023-06-01 15:35:25 +08:00
好活有点意思,相当于直接分享一个 html 了
ZeroDu
    75
ZeroDu  
   2023-06-01 15:37:15 +08:00
@zhcode #12 666 ,确实还可以有快捷键,字体加粗斜体,下划线
aduangduang
    76
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
    77
taogen  
   2023-06-01 15:58:16 +08:00
有没有大佬整一个 Markdown 编辑器?
Jonz
    78
Jonz  
   2023-06-01 16:03:33 +08:00
@israinbow 宝藏项目,star 了
gggyyybbb
    79
gggyyybbb  
   2023-06-01 16:04:24 +08:00
好活!超级有意思
DOLLOR
    80
DOLLOR  
   2023-06-01 16:16:14 +08:00   ❤️ 3
视频播放器

data:text/html;base64,PCFET0NUWVBFIGh0bWw+DQo8aW5wdXQgdHlwZT0iZmlsZSIgaWQ9ImlucHV0IiBhY2NlcHQ9InZpZGVvLyoiPg0KPGJyPg0KPHZpZGVvIHNyYz0iIiBpZD0idmlkZW8iIGNvbnRyb2xzIGF1dG9wbGF5PjwvdmlkZW8+DQo8c2NyaXB0Pg0KICBpbnB1dC5vbmNoYW5nZSA9ICgpID0+IHsNCiAgICBjb25zdCBmaWxlID0gaW5wdXQuZmlsZXM/LlswXTsNCiAgICBpZiAoZmlsZSkgew0KICAgICAgdmlkZW8uc3JjID0gVVJMLmNyZWF0ZU9iamVjdFVSTChmaWxlKTsNCiAgICB9DQogIH07DQo8L3NjcmlwdD4=
zhaol
    81
zhaol  
   2023-06-01 16:27:47 +08:00   ❤️ 7
支持将编辑内容一键复制成 url 分享给其他人

data:text/html;base64,PGh0bWw+PGhlYWQ+CiAgICA8bWV0YSBjaGFyc2V0PSJVVEYtOCI+CiAgICA8bWV0YSBodHRwLWVxdWl2PSJYLVVBLUNvbXBhdGlibGUiIGNvbnRlbnQ9IklFPWVkZ2UiPgogICAgPG1ldGEgbmFtZT0idmlld3BvcnQiIGNvbnRlbnQ9IndpZHRoPWRldmljZS13aWR0aCwgaW5pdGlhbC1zY2FsZT0xLjAiPgogICAgPHRpdGxlPkRvY3VtZW50PC90aXRsZT4KICA8L2hlYWQ+CiAgPGJvZHk+CiAgICA8YnV0dG9uIGlkPSJidG4iPuWwhue8lui+keWGheWuueWkjeWItuS4ukRhdGFVcmw8L2J1dHRvbj4KICAgIDxkaXYgaWQ9ImVkaXRvci1hcmVhIiBjb250ZW50ZWRpdGFibGU9IiI+PC9kaXY+CiAgCiAgPHN0eWxlPgogICAgI2VkaXRvci1hcmVhIHsKICAgICAgd2lkdGg6IDEwMCU7CiAgICAgIGhlaWdodDogY2FsYygxMDB2aCAtIDgwcHgpOwogICAgICBtYXJnaW4tdG9wOiAyMHB4OwogICAgICBvdmVyZmxvdzogc2Nyb2xsOwogICAgICBvdXRsaW5lOiAxcHggc29saWQgZ3JheTsKICAgIH0KICA8L3N0eWxlPgogIDxzY3JpcHQ+CiAgICBmdW5jdGlvbiB1dGY4X3RvX2I2NChzdHIpIHsKICAgICAgcmV0dXJuIHdpbmRvdy5idG9hKHVuZXNjYXBlKGVuY29kZVVSSUNvbXBvbmVudChzdHIpKSk7CiAgICB9CgogICAgLy8gZnVuY3Rpb24gYjY0X3RvX3V0Zjgoc3RyKSB7CiAgICAvLyAgIHJldHVybiBkZWNvZGVVUklDb21wb25lbnQoZXNjYXBlKHdpbmRvdy5hdG9iKHN0cikpKTsKICAgIC8vIH0KCiAgICBjb25zdCBidG4gPSBkb2N1bWVudC5xdWVyeVNlbGVjdG9yKCIjYnRuIik7CiAgICBidG4uYWRkRXZlbnRMaXN0ZW5lcigiY2xpY2siLCAoKSA9PiB7CiAgICAgIGNvbnN0IGh0bWxDb250ZW50ID0gZG9jdW1lbnQucXVlcnlTZWxlY3RvcigiaHRtbCIpOwogICAgICBjb25zb2xlLmxvZyhodG1sQ29udGVudC5pbm5lckhUTUwpOwogICAgICBjb25zdCBkYXRhVXJsID0gIjxodG1sPiIgKyBodG1sQ29udGVudC5pbm5lckhUTUwgKyAiPC9odG1sPiI7CiAgICAgIGNvbnN0IGJhc2U2NCA9IHV0ZjhfdG9fYjY0KGRhdGFVcmwpOwogICAgICAvLyBjb25zb2xlLmxvZyhiYXNlNjQpOwoKICAgICAgY29uc3QgaW5wdXRWYWx1ZSA9IGBkYXRhOnRleHQvaHRtbDtiYXNlNjQsJHtiYXNlNjR9YAogICAgICBjb25zdCBpbnB1dCA9IGRvY3VtZW50LmNyZWF0ZUVsZW1lbnQoImlucHV0Iik7CiAgICAgIGlucHV0LnNldEF0dHJpYnV0ZSgicmVhZG9ubHkiLCAicmVhZG9ubHkiKTsKICAgICAgaW5wdXQuc2V0QXR0cmlidXRlKCJ2YWx1ZSIsIGlucHV0VmFsdWUpOwogICAgICBkb2N1bWVudC5ib2R5LmFwcGVuZENoaWxkKGlucHV0KTsKICAgICAgaW5wdXQuc2V0U2VsZWN0aW9uUmFuZ2UoMCwgOTk5OSk7CiAgICAgIGlucHV0LnNlbGVjdCgpOwogICAgICBkb2N1bWVudC5leGVjQ29tbWFuZCgiY29weSIpOwogICAgICBkb2N1bWVudC5ib2R5LnJlbW92ZUNoaWxkKGlucHV0KTsKICAgIH0pOwogIDwvc2NyaXB0PgoKPC9ib2R5PjwvaHRtbD4=
Lentin
    82
Lentin  
   2023-06-01 16:28:23 +08:00   ❤️ 2
@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
    83
hemingway  
   2023-06-01 16:28:28 +08:00
这个有意思,牛
Lentin
    84
Lentin  
   2023-06-01 16:30:26 +08:00
javascript:location.href="https://web.archive.org/save/"+location.href;

歪个楼,一键存档当前网页=。=
qzwlecr
    85
qzwlecr  
   2023-06-01 17:21:24 +08:00
@zhaol 这个好,正琢磨着怎么实现一个类似的功能,就有现成的了🤣
daokedao
    86
daokedao  
   2023-06-01 17:24:20 +08:00
有意思
shinession
    87
shinession  
   2023-06-01 17:27:32 +08:00
好活, 收藏支持一下
liuidetmks
    88
liuidetmks  
   2023-06-01 17:27:41 +08:00
有趣
duanxianze
    89
duanxianze  
   2023-06-01 17:39:34 +08:00
好活!
zhaol
    90
zhaol  
   2023-06-01 17:41:07 +08:00
@qzwlecr 哈哈,好玩试试的,简单点文本可以。但是如果放图片的话,字数太长,微信限制字数了,分享不了。
summerLast
    91
summerLast  
   2023-06-01 17:45:56 +08:00   ❤️ 2
画板

data:text/html;base64,PGNhbnZhcyBpZD12PjxzY3JpcHQ+ZD1kb2N1bWVudCxkLmJvZHkuc3R5bGUubWFyZ2luPTAsUD0ib25wb2ludGVyIixjPXYuZ2V0Q29udGV4dGAyZGAsdi53aWR0aD1pbm5lcldpZHRoLHYuaGVpZ2h0PWlubmVySGVpZ2h0LGMubGluZVdpZHRoPTIsZj0wLGRbUCsiZG93biJdPWU9PntmPWUucG9pbnRlcklkKzE7ZS5wcmV2ZW50RGVmYXVsdCgpO2MuYmVnaW5QYXRoKCk7Yy5tb3ZlVG8oZS54LGUueSl9O2RbUCsibW92ZSJdPWU9PntmPT1lLnBvaW50ZXJJZCsxJiZjLmxpbmVUbyhlLngsZS55KTtjLnN0cm9rZSgpfSxkW1ArInVwIl09Xz0+Zj0wPC9zY3JpcHQ+PC9jYW52YXM+
lk920724
    92
lk920724  
   2023-06-01 18:27:12 +08:00
甜菜啊!学习学习
pkoukk
    93
pkoukk  
   2023-06-01 18:34:56 +08:00
哈哈哈,好活儿
awesomes
    94
awesomes  
   2023-06-01 18:39:39 +08:00   ❤️ 2
所以 v 站上的人都是第一次听说 data URI 吗,也是神奇
etnperlong
    95
etnperlong  
   2023-06-01 19:24:53 +08:00
不错不错 我来一个极致精简版 所写所见即所得

`data:text/html;base64,PGh0bWwgY29udGVudGVkaXRhYmxlIC8+`
leeton
    96
leeton  
   2023-06-01 19:34:23 +08:00 via iPhone
今天看了一下,这不是一个网站,就是纯粹的利用浏览器的能力打开的一个本地网页。可以随意粘贴东西,有意思。有时候我就是想随便粘贴一些东西,还得粘贴到百度输入框里,这下好了,啥都能粘贴了😬
asmoker
    97
asmoker  
   2023-06-01 21:01:04 +08:00 via Android
卧槽 太牛逼了这思路
exploreunknown18
    98
exploreunknown18  
   2023-06-01 21:23:15 +08:00
太牛了,脑洞大开
LaurelHarmon
    99
LaurelHarmon  
   2023-06-01 21:36:23 +08:00
有没有大佬开源一个支持 VIM 模式编辑的
Cheons
    100
Cheons  
   2023-06-01 21:45:15 +08:00 via Android
好家伙,离线文本
目前阶段规避审查好手段。。。

快速转二维码,易用性 upup📈
1  2  
关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1685 人在线   最高记录 6679   ·     Select Language
创意工作者们的社区
World is powered by solitude
VERSION: 3.9.8.5 · 31ms · UTC 16:50 · PVG 00:50 · LAX 08:50 · JFK 11:50
Developed with CodeLauncher
♥ Do have faith in what you're doing.