[Help] 有时候进入自己的博客后，点击写作后就一直白屏或者黑屏，一直加载不出来，有什么解决方法吗？

[ZLY3439569179]

访问自己搭建的个人博客后，点击写作后就一直白屏或者黑屏，一直加载不出来，有什么解决方法吗？

[OXeu]

新开一个隐私标签页检查是否能正常打开，如果可以说明可能是某些浏览器插件的影响，可以逐个禁用排查

[ZLY3439569179]

我已经把浏览器所有的插件都关闭了，现在还是一样，还有什么解决方法吗？

[ZLY3439569179]

新开一个隐私标签页打开后，也是这样的情况

[OXeu]

页面内鼠标右键 > 检查 > 控制台/Console 点开看看有没有什么错误

另外尝试更换其他浏览器看看呢

[ZLY3439569179]

这个是报了个什么错误吗？

[ZLY3439569179]

有时候在编辑 写作 的时候，还没做完就一下全白屏或者全黑了

[OXeu]

这个是报了个什么错误吗？

看起来字体炸掉了，我晚点确认一下，你也可以在其他设备或者手机上尝试一下

[ZLY3439569179]

对了，博主，有什么办法设置文章的背景为图片吗？我前面第一次发的时候可以添加图片到文章中，发布后图片可以直接展示出来，现在添加后好像展示的是那一串字符，不展示图片了，有什么方式可以让它展示添加进入的图片吗？我现在只能直接放链接或者把超链接加在文字上了，在编写的时候工作量有点大😭

[OXeu]

对了，博主，有什么办法设置文章的背景为图片吗？我前面第一次发的时候可以添加图片到文章中，发布后图片可以直接展示出来，现在添加后好像展示的是那一串字符，不展示图片了，有什么方式可以让它展示添加进入的图片吗？我现在只能直接放链接或者把超链接加在文字上了，在编写的时候工作量有点大😭

#280 (comment)

建议先过一遍 GitHub Markdown 的文档，里面有写图片的格式

[ZLY3439569179]

OK，显示图片的格式，我已经学会了，谢谢，博主帮忙。
不过我说的那个 点击 写作 还是一直白屏或者黑屏，内容加载不出来

[ZLY3439569179]

对了，博主，我们这个博客中的数据文件都保存在CF中的R2 对象存储中
1.
R2 对象存储 的 10G 是针对你个人账户创建的每一个都是限制 10G，超过10G就要消费
2.
R2 对象存储 的 10G 是对你个人账户创建的所有R2 的存储总存储为 10G，超过10G就要消费
博主是 第1种 还是 第2种 ?

[OXeu]

对了，博主，我们这个博客中的数据文件都保存在CF中的R2 对象存储中
1.
R2 对象存储 的 10G 是针对你个人账户创建的每一个都是限制 10G，超过10G就要消费
2.
R2 对象存储 的 10G 是对你个人账户创建的所有R2 的存储总存储为 10G，超过10G就要消费
博主是 第1种 还是 第2种 ?

2

[OXeu]

有时候在编辑 写作 的时候，还没做完就一下全白屏或者全黑了

麻烦 F12 进入控制台/Console 然后输入以下内容回车

localStorage

获取到如下的内容：

鼠标右键点击一下返回的消息，选择复制对象，然后将复制的结果告知一下
复制的结果大概是如下形式

{
  "theme": "system",
  "new/content": "121121",
  "new/preview": "comparison",
  "i18nextLng": "zh-CN"
}

[ZLY3439569179]

{
    "theme": "dark",
    "1/content": "<style>\r\n    .p1{text-indent: 30px;}\r\n</style>\r\n<p class='p1'>前面找了很多的搭建教程视频可惜我尝试后，不是搭建过程中出问题就是搭建完后访问的网页有些问题或者是登录后台管理页面有问题</p>\r\n<p class='p1'>不过现在好了，终于搭建好了，目前测试来看，虽然功能上有点简洁了，缺少了很多功能，但是基础的一些功能都有，出bug的机率还是有的，不过直接去重新部署下还是可以暂时解决的</p>\r\n<h2><center><b><p class='p1'>搭建后的网站功能介绍：</p></b></center></h2>\r\n<ul>\r\n<li><p>支持 Github OAuth 登录，默认第一个登录的用户拥有管理权限，其他用户均为普通用户</p></li>\r\n<li><p>支持文章的写作与编辑</p></li>\r\n<li><p>支持本地实时保存对任意文章的修改/编辑且多篇文章互不干扰</p></li>\r\n<li><p>支持设置为仅自己可见，可以充当云端同步的草稿箱或者记录隐私性较强的内容</p></li>\r\n<li><p>支持拖拽/粘贴上传图片到支持 S3 协议的存储桶并生成链接</p></li>\r\n<li><p>支持设置文章别名，可通过形如 https://blog.xn--ciqpnm2jkwkllfjp8f.us.kg/about 链接访问文章</p></li>\r\n<li><p>支持文章不列出在首页列表中</p></li>\r\n<li><p>支持添加友链，同时后端每间隔 20 分钟定期检查更新友链可访问状态</p></li>\r\n<li><p>支持回复评论文章/删除评论</p></li>\r\n<li><p>支持通过 Webhook 发送评论通知</p></li>\r\n<li><p>支持自动识别文章中的第一张图片并作为头图展示在文章列表中</p></li>\r\n<li><p>支持输入形如\"#博客 #HTML网页 #自搭个人网站\"之类的标签文本并自动解析为标签</p></li>\r\n<li><p>支持日夜间模式</p></li>\r\n</ul>\r\n<h2><left><b><p class='p1'>优点 ：</p></b></cleft</h2>\r\n<ul>\r\n<li><p>不需要太多的成本</p></li>\r\n<li><p>搭建只需要拥有一个域名，注册二个账号即可搭建</p></li>\r\n<li><p>不需要花费太多的时间去运行管理自己的个人网站，有专门的托管平台帮我们全日运行并且管理我们的网站</p></li>\r\n</ul>\r\n<h2><left><b><p class='p1'>缺点 ：</p></b></ceft</h2>\r\n<ul>\r\n<li><p>在国内访问起来可能加载出来会有点慢</p></li>\r\n<li><pclass='p1'>评论还要登陆然而却没有引导我找半天原来用github登陆。不够私密。</p></li>\r\n<li><p class='p1'>目前这个项目确实缺少足够的引导，免登录直接输入信息回复也有在计划中，只是目前待完善的地方还很多暂时还没有开始做</p></li>\r\n<li><p class='p1'>写作的时候没有设置内容格式的按键，对于新手想要自己发布的文章好看点来说，操作起来可能有点不太友好</p></li>\r\n</ul>\r\n<h2><center><b><p class='p1'>搭建后的效果图片</p></b></center></h2>\r\n<hr/>\r\n![我的个人博客网站.png](https://bucket.xn--ciqpnm2jkwkllfjp8f.us.kg/images/7041c2ab4a247ad4f93da02e4a67b41de8b4e619.png)\r\n<hr/>\r\n![我的个人博客网站-2.png](https://bucket.xn--ciqpnm2jkwkllfjp8f.us.kg/images/f4a164b92ca7d1b3be45131f6897fc2130cc094f.png)\r\n<br/>\r\n<h2><center><b><p class='p1'>个人搭建的起因</p></b></center></h2>\r\n<p class='p1'>\r\n其实可能就是最近看了很多别人自搭的个人博客感觉挺不错的，\r\n然后想着自己有时候找一些资料的时候都要从自己的U盘或者移动硬盘中拷贝出来有点麻烦，\r\n于是我想把一些资料直接放在网上，这样我要的时候也方便下。</p>\r\n<h1><center><div style='background-color: bisque;'><i><b>结尾</b></i></div></center></h1>\r\n<p class='p1'>后续我会在我的个人博客上分享我的一些学习方面的总结笔记或者是分享一些个人生活上的一些有趣的事情并且继续完善我的这个博客网站。</p>\r\n<p class='p1'>期待以后过了几年后的我再次看到自己的第一章会有何感想呢，真是有点期待啊！</p>\r\n<p class='p1'>好了，时候不早了，晚安了o(*￣︶￣*)o</p>",
    "1/alias": "about",
    "2/tags": "#测试",
    "new/preview": "comparison",
    "2/content": "<h1>标题</h1>\r\n<marquee>巨石文明</marquee>\r\n\r\n\r\n<div style='background-color: brown;'>红色&nbsp;框框</div>\r\n<span style='background-color: brown;'>红色&lt;框框</span>\r\n<span style='background-color: bisque;'>橙色&gt;框框</span>\r\n<span style='background-color: aqua;'>蓝色&amp;框框</span>\r\n<div style='background-color: bisque;'>橙色&yen;框框</div>\r\n<span style='background-color: brown;'>红色&copy;框框</span>\r\n<span style='background-color: bisque;'>橙色&reg;框框</span>\r\n<i<span style='background-color: aqua;'>蓝色&deg;框框</span>\r\n<div style='background-color: aqua;'>蓝色&plusmn;框框</div>\r\n<span style='background-color: brown;'>红色&times;框框</span>\r\n<span style='background-color: bisque;'>橙色&divide;框框</span>\r\n<span style='background-color: aqua;'>蓝色框框</span>\r\n\r\n\r\n2&sup2;=4\r\n2&sup3;=8\r\n2&sup4;=16\r\n\r\n<span style='background-color: brown;'>红色框框</span>\r\n<span style='background-color: bisque;'>橙色框框</span>\r\n<span style='background-color: aqua;'>蓝色框框</span>\r\n\r\npython安装文件<br>\r\nhttps://www.python.org/ftp/python/3.10.10/python-3.10.10-amd64.exe'<br>\r\npython压缩包<br>\r\nhttps://www.python.org/ftp/python/3.10.10/python-3.10.10-embed-amd64.zip<br>\r\n百度<br>\r\nhttps://www.baidu.com<br>\r\n\r\n<strong>需要加粗的内容</strong>\r\n\r\n<b>需要加粗的内容</b>\r\n\r\n**需要加粗的内容**\r\n\r\n需要加粗的内容\r\n\r\n一般指的是那些以巨石建筑和石雕艺术为特征的古代文明。这些文明常见于世界各地，且通常与早期人类的社会组织和宗教信仰有关。以下是一些著名的巨石文明及其简介:\r\n1.**巨石阵文明**:这是位于英国威尔特郡的一个著名遗址，建于公元前3000年至前2000年之间。巨石阵是由大量的大型石块构成的圆形建筑，其用途至今仍存在争议，可能涉及宗教仪式、天文观察等。\r\n2.**复活节岛文明**:复活节岛(Rapa Nui)位于太平洋中部，以其大型石雕像(摩艾像)闻名。这些雕像主要建于公元1400年至1650年之间代表了岛上居民的祖先崇拜和社会地位。\r\n3.**古代埃及文明**:古埃及的金字塔和神庙也是巨石建筑的杰出代表。最著名的如吉萨金字塔群，包括大金字塔、狮身人面像等，这些建筑体现了古埃及的宗教信仰和社会组织。\r\n4.**中美洲的玛雅文明**:玛雅文明以其宏伟的石造建筑和复杂的天文观测台而著称。例如，位于墨西哥的楚琴伊察(Chichen Itza)遗址中。\r\n著名的库库尔坎金字塔是其标志性建筑之一。\r\n5.**安第斯文明**:安第斯山脉的印加文明建造了许多巨石结构，如马丘比丘。这些建筑体现了印加人对自然环境的适应和建筑技术的高超。\r\n这些巨石文明的共同特点是，它们都在技术和组织上表现出了非凡的能力，并且这些建筑和雕塑常常与当时人们的宗教信仰、天文学、社会结构等方面密切相关。\r\n\r\n代码块:\r\n```\r\nsys\r\nint gi0/0/0\r\nip add 192.168.1.1 24\r\nshow ip int br\r\n```\r\n\r\n# 一级标题\r\n## 二级标题\r\n### 三级标题\r\n\r\n**机床**\r\n\r\n**文字内容颜色需要加粗的**\r\n\r\n1. 设置内容使用字体1号大小\r\n2. 设置内容使用字体2号大小\r\n3. 设置内容使用字体3号大小\r\n4. 设置内容使用字体4号大小\r\n5. 设置内容使用字体5号大小\r\n\r\n这些巨石文明的共同特点是，它们都在技术和组织上表现出了非凡的能力，并且这些建筑和雕塑常常与当时人们的宗教信仰、天文学、社会结构等方面密切相关。\r\n\r\n<h2>标题2内容</h2>\r\n<h3>标题3内容</h3>\r\n<h3>标题3内容</h3>\r\n<h4>标题4内容</h4>",
    "1/tags": "#自搭个人网站",
    "new/content": "<html>\r\n<head>\r\n<hr>\r\n<h1><center><i</h1>\r\n<hr>\r\n<style>\r\nbody {\r\nmargin: 0;\r\nheight: 100vh;\r\ndisplay: flex;\r\nalign-items: center;\r\njustify-content: center;\r\nbackground-color: black;\r\noverflow: hidden;\r\n}\r\n.container {\r\nfont-size: 10px;\r\nwidth: 40em;\r\nheight: 40em;\r\nposition: relative;\r\n}\r\n.sun {\r\nposition: absolute;\r\ntop: 15em;\r\nleft: 15em;\r\nwidth: 10em;\r\nheight: 10em;\r\nbackground-color: yellow;\r\nborder-radius: 50%;\r\nbox-shadow: 0 0 3em white;\r\n}\r\n.earth, .moon {\r\nposition: absolute;\r\nborder-style: solid;\r\nborder-color: white transparent transparent transparent;\r\nborder-width: 0.1em 0.1em 0 0;\r\nborder-radius: 50%;\r\n}\r\n.earth {\r\ntop: 5em;\r\nleft: 5em;\r\nwidth: 30em;\r\nheight: 30em;\r\nanimation: orbit 36.5s linear infinite;\r\n}\r\n.moon {\r\ntop: 0;\r\nright: 0;\r\nwidth: 8em;\r\nheight: 8em;\r\nanimation: orbit 2.7s linear infinite;\r\n}\r\n.earth::before,\r\n.moon::before {\r\ncontent: '';\r\nposition: absolute;\r\nborder-radius: 50%;\r\n}\r\n.earth::before {\r\ntop: 2.8em;\r\nright: 2.8em;\r\nwidth: 3em;\r\nheight: 3em;\r\nbackground-color: aqua;\r\n}\r\n.moon::before {\r\ntop: 0.8em;\r\nright: 0.2em;\r\nwidth: 1.2em;\r\nheight: 1.2em;\r\nbackground-color: silver;\r\n}\r\n@keyframes orbit {\r\nto {\r\ntransform: rotate(360deg);\r\n}\r\n}\r\n</style>\r\n</head>\r\n<body>\r\n<div class=\"container\">\r\n<div class=\"sun\"></div>\r\n<div class=\"earth\">\r\n<div class=\"moon\"></div>\r\n</div>\r\n</div>\r\n</body>\r\n</html>",
    "2/title": "测试",
    "i18nextLng": "zh",
    "1/title": "我的第一个 个人博客网站",
    "new/alias": "about",
    "new/summary": "HTML制作的动态网页",
    "new/title": "动态 太阳系 网页",
    "1/summary": "今天2024.10.24.2.26",
    "2/alias": "测试",
    "2/summary": "测试",
    "new/tags": "HTML网页"
}

[OXeu]

刚验证了一下，当 h1 中有未闭合的标签时会导致编辑器崩溃导致白屏，如

<h1><i</h1>

后续会具体排查一下问题

临时解决方案

你可以在控制台执行以下命令清除草稿

localStorage.removeItem("new/content")

如果涉及到 html 标签的内容先在其他地方排好版以后再复制粘贴到网页中

[ZLY3439569179]

博主，怎么修改搭建的样式？
是在设置里面的上传那个文件吗？
但是我上次上传文件后发现文件上传到存储桶中了，但是搭建的样子还是没有变化

[OXeu]

博主，怎么修改搭建的样式？ 是在设置里面的上传那个文件吗？ 但是我上次上传文件后发现文件上传到存储桶中了，但是搭建的样子还是没有变化

样式暂不支持修改，可以直接修改自己 fork 仓库中的代码来改样式