奋战到3点半,有时候会被一个细节气疯

请注意,本文编写于 1005 天前,最后修改于 1003 天前,其中某些信息可能已经过气。

三点半,当然是凌晨三点半啊//今天是谷歌的21周年。写下这篇颇有意义的博客。
那么具体是干了什么呢,既然新的博客已经开始运行,老站的存在就显得有些多余。但弃之不用不仅可惜,而且还麻烦。各种地方留的域名都是那个顶级域名,甚至是身上穿的衣服上还印着www.fkun.tech。所以那个域名还得留着,看了一圈,发现很多博主都有自己的Start site,或者说是导航页。一张超级大的图当背景,几行字附带着链接。链接有博客,云盘,还有各种SNS。这正是我需要的东西。
开搞,
那么我主要是参考了https://ijglb.com/#home的北京还有live2d形象,以及左岸博客的悬浮面板。
这也是我一直以来喜欢做的事,把两个东西结合在一起。说起来这要追溯到初中的时候沉迷各种AE模板,当初是因为很多模板必须在全英文环境下运行,否则某些重要的表达式会错误,而导致无法表现该有的效果。于是那时的我就把多个模板的内容互相交叉,要解决的就是其中的兼容问题。为啥不从头学,从头做呢?累啊,懒啊。反正要的是最后的效果,路子野点,别太在意嘛,而且,我也不会就因为稍微融合了一下就说是完全自己做的啦。
刚才也说到兼容问题,对,这就是我要解决的东西。你可以理解为抄论文但又想过查重,那就得修改修改,前后连贯一下。虽然我还没写我的论文,原理上大致是这样吧。
这次的实践,有几个注意点。
首先,主页挂在Githubpages,要求静态网页,对JS也有一定的限制。要规避不受兼容的JS。
其次,在初步查看原作源码以后发现,背景图幻灯片效果的图片源来自API,而不是本地文件夹。
最后,还是SSL的问题,这个问题大了去了,一时半会儿解决不来。

关于第一个点,不必太慌张,一边开着浏览器,持续刷新,另一边在源码里开删就完事儿了。删到网页突然不正常了就撤销跳过,再删下面的。用这个方法可以无脑暴力的简化不必要的部分。说着轻松,可你曾否听过CSS,打开index一看,哦~一堆头文件,引入一堆js,删删删,但往下的内容就那么点,啥也删不了,想去掉的部分又去不掉。这时候用chrome审查一看,行吧,东西都藏在CSS。那就点开CSS,这就很痛苦了,不是自己写的代码,在这边处理起来就特别的吃力。要在审查元素里测试完后取CSS改对应的内容。这一步持续了3-4小时。

毕竟是经常干这事儿的人,这点苦还是受的住的。来看下一个。
背景图幻灯片这种样式其实网上有很多开源的代码,有的实现起来非常简单,几句话搞定。BUT,我总是遇到一些奇怪的问题,主要是和屏幕尺寸适配的问题,想起了当年我做原来那个博客的头图的时候,不知道多少个夜晚才搞定,本来简单的事儿怎么会这么难呢?还不是因为代码全混在一起,动一处,全乱套。
况且这次他源码我都没怎么看明白,所以最好还是尽可能的保留原貌。于是,我就看到了API。。
初次认识API还是在整B站脚本的时候看到的。总觉得这是什么先进玩意儿,没想到这次自己也要处理这东西。这个API接口的作用是,每次访问会返回一张图,每次返回的图还不一样。听着就先进啊。查了一下,网上有不少公开的接口,随便访问了几个,感觉。。。要么是太慢,要么是图的尺度太大,总之不太喜欢。原作的API是作者自己网站的,一路追过去,发现他也是同意大家去使用的。八过。。尺度还是太大。我更想把自己之前的摄影作品展示出来,感觉更有情调。
于是。。我需要自己做一个API接口来返回图片。找了很久,终于找到一个简洁的项目。acgimgurl唯一要吐槽的就是Github下面简介里给的示范链接点进去竟然是个小黄站。。不过话说回来,方便倒是方便的,一共两个文件,一个php一个txt,只要往txt里一行一行的写链接就好了。测试了一下,NICE,每次刷新会出现不同的图片,到这里快乐还没到达顶点,起起落落的才是人生。
下一步是整合这个接口到原来的文件,我上来就是把源地址一删,新地址贴近进去吗。刷新一看,图是出来了,可这咋只有一张,一直是一张在这儿隔几秒闪一闪。这时候再仔细读了一读代码,里面似乎藏了个循环。
暑假的时候跟Sniper搞单片机,里面也有类似的东西。果然代码都是有共通点的,看来看去,这代码就是在计数,延迟一秒记一次,记5次循环。再看我贴进去的东西,好像确实没什么能让他刷新的部分。打开原来的代码,发现链接结尾有+ '&r=' + index; 这样的话,其中index是每次循环重新变成1。这个r,应该是刷新的记号,如果等于0,就相当于没加,等于1了才真的刷新。情况是这样,但死活运行不了,加上之后图片直接显示不出来了。后来又去试Js的reload还有replace代码,图是能刷新了,但每次整个页面都要刷新过,跟开了autorefresh插件一样。这并不是我要的效果,就这样整了2个多小时。最后……我自己发现了问题。

最后的代码
最后的代码

斜杠,就是斜杠,/这个东西。早在之前初次玩域名的时候就看过文章说结尾的/可以让服务器少做一步,应该这么写才规范。当时只是看在眼里,问我我是知道的,但自己写总是懒得加这么个玩意儿。这次,教训来了。没有/后面的&r直接算在前面的目录里,然而带这么奇怪结尾的域名并不存在,当然就是打不开。有时候就是这么一小下,一个/解决所有问题。

所以现在就有大家看到的主页的样子了。

homepage
homepage

现在没能解决的就是SSL,所谓的效率锁。
主页因为涉及到了博客这边的链接,SSL也就一并歇逼了。而博客这边的情况就很复杂。其实我自己也没太搞懂。一个域名server.fkun.tech直接解析到路由器,路由器里端口转发把下载机的BT端口转出来。路由器本身的管理界面添加了证书,在某个端口访问可以正常出现绿锁。下载及BT服务单独添加了SSL,访问BT的端口也可以正常SSL。但是,Typecho,我就不知道这玩意儿SSL该往哪儿放,或者说,我直接不知道这玩意儿的证书咋签。域名都是一样的,端口不一样,网上找到一篇跑Owncloud服务的,创建新文件以及一堆设置,我把内容替换成Typecho的之后,然而并没有成功,甚至连端口都没给我打开。(我可是认真做了端口转发的)
再说吧,反正访问这个博客的人还少。以后真去租个服务器什么的那就方便多了。

评论区

评论列表