ImQi1 https://imqi1.com/ zh-CN 做技术的分享者、生活的摄影师、时事的评论员。 Mon, 22 Jul 2024 20:38:00 +0800 Mon, 22 Jul 2024 20:38:00 +0800 旧地方待久了,想去新地方 https://imqi1.com/discuss/363.imqi1 https://imqi1.com/discuss/363.imqi1 Mon, 22 Jul 2024 20:38:00 +0800 中心词:新鲜感。

转眼搬进沈阳已经两三年了,这次有了一个稳定的住处(我家住在沈河区,如果有想认识我的小伙伴可以找我),不需要和父母到处奔波了。(他们干活,到处租房子,为的是离卖东西的地方近点,经常换地方)回想起几年前第一次住进沈阳时,我以为终于走出了大山,来到了真正的“大城市”。

沈阳市,简称沈,别称奉天、盛京,是中华人民共和国辽宁省的省会、副省级市、国家区域中心城市和特大城市。沈阳位于辽河平原南缘,南连辽东半岛,位处环渤海经济圈之内,是环渤海地区连接朝鲜半岛的重要枢纽,也是东北地区的政治、经济、金融、商业、交通、文化、商贸中心,中国人民解放军北部战区机关驻地,国家新型工业化综合配套改革试验区沈阳经济区核心城市。市人民政府驻浑南区沈中大街206号。

秦皇岛市,简称秦,旧称临榆,是中华人民共和国河北省下辖的地级市,位于河北省东北部,市境西南界唐山市,西北接承德市,东北临辽宁省朝阳市、葫芦岛市,东南滨渤海湾。地处燕山山脉丘陵区及山前平原过渡带,地势北高南低。滦河、青龙河、戴河皆流经市境注入渤海湾,市人民政府驻海港区翠岛大街1号。秦皇岛是京哈铁路上重要城市之一,为沿海开放城市,中国北方重要的对外贸易口岸,国务院批准的全国甲级旅游城市。著名的风景区山海关、北戴河坐落于此。

我去过沈阳故宫,中街,张学良故居,918事变纪念馆,k11,大悦城,很多很多地方。

乐高恐龙 的照片是在 k11 拍的。

刚找了一下站内【图片】分类的照片,在沈阳拍的少之又少,不过都真真实实去过。我觉得去过一个地方最重要,照片都是次要的。

开学我就大四了,那就是在秦皇岛的第四年,在沈阳的第三年。

我记得刚来这两个地方刚开始是害怕,然后是好奇,充满新鲜感,那时候活力十足,想探索这两座城市的各处。

那时候刚高考完,精力十足,在家玩了两个月,终于开学了,而且听说大学一点也不忙,我就说要走遍全秦皇岛的景点。

第一次来沈阳也是,特别喜欢这座陌生的城市,觉得他应该被很多人向往吧。

你们都喜欢住在哪里呢?

有时听群里的博友谈论北京上海重庆,甚至海外时,他们都对自己的城市不太喜欢。就是谈论它们的时候,他们没有骄傲的感觉。

对于没走出过大山的孩子说,到达一座大城市见见世面,肯定很很让他们心动吧。

不过一旦对自己身边的事情无比熟悉了以后,就不太喜欢这个地方了,没有当初刚到这里来探索的欲望。

沈阳本地的某些东西我就开始不太喜欢了:

  • 前几天大半夜天降大水,道路被淹,走路都难走;
  • 不分主路辅路,有一次我骑电动车将一个出租车的后视镜撞坏了,我竟然是次要责任。交警说只要我没在上面走就要担一部分责任。当时的地方上面超级不好走,而且几乎全沈阳的电动车都在机动车道上走;

不过很多地方我还是很喜欢的,沈阳的东北味也是十足,有很多人都很大方。众所周知在东北,任何一个人都是朋友。

秦皇岛的规定近期也多了起来。

最近秦皇岛要求电动车的车牌都得戴上,就连我们学校内都要戴上。之前为了应付,花了30元在车棚买了个别人的车牌。但是后来又被告知需要搞“校园通行证”,需要车人牌一一对应。还好我有驾驶证,他们上个机动车牌还是临时电动车牌我都可以了。不过这对有一部分同学就不太友好了,没证还是电动摩托,只能他们自己想办法了。

还有之前提到的“走廊不许放垃圾桶”,“走廊里不许放个人物品”等,跟高中“男生不许留头发”,“女生不许留长发”等规定如出一辙。

一个地方待久了,待习惯了,就连规定也是习惯的。要是突然出了新规定,对自己不太友好的,就可能讨厌这个地方了。

老弟中考完开始游辽宁省了,看他在朋友圈发的,有“中朝边境鸭绿江”,有爬山,太空栈道,跳楼机,有名胜古迹。有车真方便啊。

开学之前我也去哪玩玩吧。

]]>
10 https://imqi1.com/discuss/363.imqi1#comments https://imqi1.com/feed/
为屏蔽垃圾评论,我也是煞费苦心 https://imqi1.com/tech/358.imqi1 https://imqi1.com/tech/358.imqi1 Mon, 15 Jul 2024 12:12:00 +0800 建个站不容易啊,又得想办法提高性能,开个 CDN 吧,还得防盗刷,防 DDos,评论吧还老有国外的 IP 发广告、垃圾评论。

本文介绍一下我为了防垃圾评论都做了哪些措施,和我一样使用 Typecho 平台的可以跟着本教程试一试。

这些措施按照实现的难易程度(对不懂代码的人来说)、实用性、弊处等方面综合考虑,越靠后越不推荐。

7月16日更新 - Token 验证

今天凌晨我将 Token 以 Cookies 的形式改成了作为表单的一项提交给后端并由后端校验,这就需要改动我的 JS 文件了,看来省事还是不行啊。

这里分享一下加密和解密函数:

function encryptToken(): string
{
    $key = "typecho";  // 密钥兼前缀
    $timestamp = time();  // Token 生成时的时间戳
    $string = $key . $timestamp;  // 拼接
    $cipher = "aes-256-cbc";  // 加密算法
    $iv_length = openssl_cipher_iv_length($cipher);
    $iv = openssl_random_pseudo_bytes($iv_length);
    $encrypted_string = openssl_encrypt($string, $cipher, $key, 0, $iv);  // 这三步是解密
    return base64_encode($iv . $encrypted_string);  // 再编码
}

function decryptAndValidateToken($encrypted_token): string
{
    $key = "typecho";  // 密钥兼前缀
    $cipher = "aes-256-cbc";  // 加密算法
    $encrypted_token = base64_decode($encrypted_token);  // 解码
    $iv_length = openssl_cipher_iv_length($cipher);
    $iv = substr($encrypted_token, 0, $iv_length);
    $encrypted_string = substr($encrypted_token, $iv_length);
    $decrypted_string = openssl_decrypt($encrypted_string, $cipher, $key, 0, $iv);  // 解密字符串
    $timestamp = substr($decrypted_string, strlen($key));
    $current_time = time();
    $validity_period = 3600; // 1 小时的有效期
    return ($current_time - $timestamp) <= $validity_period;  // 这几步是验证是否有效
}

将这些函数写在主题根文件夹的 function.php 中。

然后在 Typecho 的评论 php 文件,通常是 comment.php,在表单中插入一条:

<input type="hidden" name="token" id="token" value="<?php echo encryptToken()?>"/>

然后在表单提交时,把这一部分作为表单的一项提交即可。由于本站是 ajax 提交评论,则在提交请求时还需要加上这一个表单项。总之就是在哪里提交的就在哪里加。

然后修改 Typecho 源码,在 var/Widget/Feedback.php 文件中,在 comment 函数前几行加上:

$token = $_GET['token'] ? $_GET['token'] : $_POST['token'];
        
if (!Feedback::decryptAndValidateToken($token)) {
    throw new Exception(_t('token 无效。'));
}

这里还需要一个 Feedback 的静态函数 decryptAndValidateToken,我们在 Feedback 类中加入这个函数:

private static function decryptAndValidateToken($encrypted_token): string
{
   if (!$encrypted_token) {
       return false;
   }
   $key = "typecho";
   $cipher = "aes-256-cbc";
   $encrypted_token = base64_decode($encrypted_token);
   $iv_length = openssl_cipher_iv_length($cipher);
   $iv = substr($encrypted_token, 0, $iv_length);
   $encrypted_string = substr($encrypted_token, $iv_length);
   $decrypted_string = openssl_decrypt($encrypted_string, $cipher, $key, 0, $iv);

   // 检查解密后的 token 是否有效
   if (!is_numeric($decrypted_string)) {
       throw new Exception("Token 无效");
   }

   $timestamp = (int) $decrypted_string;
   $current_time = time();
   $validity_period = 1800; // 30分钟的有效期
   if (($current_time - $timestamp) <= $validity_period) {
       return true;
   } else {
       return false;
   }
}

Token 验证

这种方式实现难度很高,比如我使用的是 Typecho 这类平台,需要对源码有很深的理解,因为它的评论提交没有任何验证措施,仅仅是向对应接口发送个请求(如直接访问 https://imqi1.com/shot/355.imqi1/comment?author=1&text=1&mail=1@q.com )。所以我们需要手动为它添加验证措施,这就需要改动源码了。我觉得它的安全性是最高的,但弊端是防不住爬虫机器人。因为爬虫机器人访问前端后就可以获取到这个 Cookies,就绕过了这一机制。实现难度也很高。

首先先介绍下我的友链申请是如何实现的。

友链申请输入框友链申请输入框.webp

可以看到,输入框有一个 hidden ,它代表不展示给用户具体的输入框,它的值一般由其他代码控制,在表单提交时一并作为表单项一起提交。

当申请友链的请求被提交后:

友链的请求被提交友链的请求被提交.webp

可以看到,友链的请求被提交时,Token 是和其他表单项一起提交的,后端处理这个请求时,就可以先验证这个 Token,如果 Token 是正常的,就可以继续后面的处理逻辑了。

所以这里最推荐也是最有效的方法,就是加一个 Token 验证。

要实现这个,我们首先要写一个加密和解密函数,因为 Token 不能以明文方式显现出来。

加密和解密函数很好写,你可以用现成的库,或者自己写一个函数。比如我的站点名称为 ImQi1,我就可以将 “ImQi1” 作为字符串的前缀。然后为了防止 Token 被他人拿去利用,我设定 Token 的过期时间为一小时,那我将 Token 生成的初始时间戳作为起始时间,单位是秒,然后在解密和验证函数中,用代码执行时当前的时间减去生成 Token 的时间,再和 3600 秒一比较就好了。有了这个逻辑,我们就可以尝试写一下。

名词解释
Token,一个名词,用于硬件安全校验的令牌,现在也可作为软件的安全校验。
时间戳,广义上指 Unix 时间戳,是从1970年1月1日(UTC/GMT的午夜)开始所经过的秒数,不考虑闰秒。
<?php
function generateToken()
{
    $prefix = "imqi1"; // 前缀
    $currentTime = time();  // 当前时间戳
    $unencrypted = $prefix . '_' . $currentTime;  // 拼接前缀和当前时间戳
    return base64_encode($unencrypted);  // 返回加密后的字符串
}

function decryptToken($token)
{
    return base64_decode($token);  // 解密 Token
}

function testToken($token) {
    $decrypted = decryptToken($token); // 解密 Token
    $prefix = "imqi1"; // Token 的前缀
    $prefix_length = strlen($prefix); // 前缀的长度
    $current_time = time(); // 当前时间戳

    // 检查解密的 Token 是否以正确的前缀开头
    if (substr($decrypted, 0, $prefix_length) === $prefix) {
        // 从解密的令牌中提取时间戳部分
        $timestamp_str = substr($decrypted, $prefix_length + 1);
        // 尝试解析提取的时间戳
        $timestamp = (int)$timestamp_str;
        // 检查时间戳是否有效(在合理范围内)
        if ($timestamp > 0 && $timestamp <= $current_time) {
            // 令牌结构和有效性检查通过
            return true;
        }
    }
    // 如果任何条件失败,则返回 false,表示令牌无效
    return false;
}

这里介绍两种情况,我先介绍一下本站是如何实现 Token 验证的。由于我的评论表单是异步提交,JS 已经写死了,我不想去改,因为还要验证 + 压缩 + 混淆 + 上传 + 二次验证,比较麻烦,因而我就采用了 Cookies 的形式进行验证。

Typecho 为 Cookies 的添加封装了一个很实用的类叫 Typecho_Cookie 。它有三个方法:

Typecho_Cookie::get($cookie_name);
Typecho_Cookie::set($cookie_name, $cookie_value);
Typecho_Cookie::delete($cookie_name);

第一个方法是获取 Cookies 的值,参数是 Cookies 的名称;第二个方法是设置 Cookies 的值,第三个方法则是删除某 Cookies。

它比原生的 setCookie() 多了个安全前缀,更为安全,而且使用也极为方便。

有了以上知识之后我们就可以修改评论的逻辑了,首先就是在用户未登录时,为用户生成一个 Token。若 Token 已有且未过期,就可以不需要再申请。这部分代码需要写在评论页面,通常为 comment.php 。

if (!Typecho_Cookie::get('_typecho_comment_token') && !$this->user->hasLogin()) {
    Typecho_Cookie::set('_typecho_comment_token', generateToken());
}
if (!testToken(Typecho_Cookie::get('_typecho_comment_token'))) {
    Typecho_Cookie::delete('_typecho_comment_token');
}

然后就是在评论提交前验证一下 Token,这部分代码我写在了我的评论审核插件中,如果你没有此插件,就需要写在 Typecho 的源码中提交评论的那一部分,我记得应该是 var/Widget/Feedback.php 中,它里面有一个 comment 方法,貌似是提交评论时执行的方法,各位可以试一下。若用了评论审核插件,则可以插入到评论审核插件中验证评论的那一个函数中,通常叫做 filter 之类的。

我的验证 Token 代码存放的位置我的验证 Token 代码存放的位置.webp

$user = Typecho_Widget::widget('Widget_User');
$token = Typecho_Cookie::get("_typecho_comment_token");
if (testToken($token) && !$user->hasLogin()) {
    throw new Exception("Token失效,请刷新后重新评论。");
}

到这里就大功告成了,因为 Cookies 生成之后,每次发送请求时都会一并提交给服务器,所以 Cookies 内包含 Token 的方式就不需要改动 JS 。

若你使用的是其他的博客平台,甚至是自建的,则也可以通过上述方式,只是将生成 Token 的那部分改成像我的友链中 Token 验证的那部分那样即可。

验证码

验证码的灵感是来源于喵的 MyLife 主题前几版中的评论验证,不过喵在后来的版本中把它去除了。

本站的验证码就是为评论表单多加了一个验证码的输入框,它的 placeholder 使用了一个简单的繁体字计算式,为防止外国的机器人直接使用 placeholder 的值得出正确结果从而越过该机制。

验证码验证码.webp

个人觉得这个验证码很有创意,并且还是自己写的,不需要引入第三方库或插件。这种方式可以屏蔽爬虫机器人访问前端页面后模拟真实用户提交的评论,但它防不住直接向后端提交请求的(因为验证码的审核是由前端实现的)。而前者则防不住爬虫机器人,因此这个可以说是前后端都设了道防线,因此有动手能力的也建议上一下。

这种实现比上一个简单多了,但还是有点难度。

要实现,首先要封装下:

  • 数字转换为中文大写数字、运算符转换的函数;
  • 替换 placeholder 的函数;
  • 验证的函数;
  • 初始化函数。

有了以上知识我们就可以开始写了。

function numberToTraditionalChinese(number) {
    const traditionalChineseNumbers = ['零', '壹', '貳', '參', '肆', '伍', '陸', '柒', '捌', '玖'];
    return traditionalChineseNumbers[number];
}

function replacePlaceholder() {
    let num1 = Math.floor(Math.random() * 10) + 1;
    let num2 = Math.floor(Math.random() * 10) + 1;
    let operator = ["+", "-", "×"][Math.floor(Math.random() * 3)];
    let expression = numberToTraditionalChinese(num1) + " " + operator + " " +numberToTraditionalChinese(num2);
    let result = operator === "×" ? num1 * num2 : eval(num1 + operator + num2);
    document.getElementById('captcha').setAttribute('placeholder', expression);
    window.result = result;
}

function checkCaptcha() {
    return document.getElementById('captcha').value === window.result.toString();
}

在系统加载完成以后在评论区调用替换 placeholder 的函数就可以了。

这里给出了个最简单的版本,但是需要做一些处理:

  • 为了能看得懂代码,上面的正确结果是直接存储在 window.result 里的,因此通过浏览器控制台就可以获取正确结果,从而绕开这个机制,在生产环境中要存储在别处并替换变量名;
  • 上述代码的函数名和变量名意图非常明显,在生产环境中要替换变量名和函数名。

然后在评论提交前,先验证一下验证码是否通过即可。

百度内容审核平台

前端后端都加上我认为比较严厉的验证机制以外,接下来就要对评论内容进行限制,因为有些广告也可以手动发。

这个的实现简单,但内容审核的尺度需要参数来调节,这些参数就需要自己根据自己的网站的实际情况调整。Typecho 实现了对百度内容审核平台的接口,可以直接应用插件并使用,还可以自定义屏蔽词汇,缺点就是参数需要自己调节,过高可能会不通过正常评论,建议所有不通过审核的都设为待审核模式。

百度内容审核平台的地址为 https://ai.baidu.com/tech/textcensoring ,插件地址为 https://github.com/sy-records/ty-baidu-textcensor ,领取试用资格的文档地址为 https://ai.baidu.com/ai-doc/ANTIPORN/Wkhu9d5iy

防垃圾评论插件

这个可以提供一些基础的防垃圾评论的功能,可以设置敏感邮箱、链接、昵称、评论内容、IP,设置评论是否必须包含中文等。

插件的地址我已经找不到了,但是网上有很多版本,可以自己去搜索下,名称叫 SmartSpam ,目前最新版本为 2.7.0。

]]>
16 https://imqi1.com/tech/358.imqi1#comments https://imqi1.com/feed/
光遇五周年演唱会 https://imqi1.com/shot/355.imqi1 https://imqi1.com/shot/355.imqi1 Sat, 13 Jul 2024 21:39:00 +0800 0 https://imqi1.com/shot/355.imqi1#comments https://imqi1.com/feed/ 两个皇冠,我来了 https://imqi1.com/note/349.imqi1 https://imqi1.com/note/349.imqi1 Fri, 12 Jul 2024 00:09:49 +0800 不知各位的 QQ 号都什么等级了啊。

我的 QQ 是在 2012 年注册的。那时候吧,我上初中,我家亲戚从黑龙江搬到湖北,留下一堆不需要的家具,包括沙发、冰箱、一张大床,还有一个台式机。

当然,现在的我已经有了大学生标配的笔记本电脑,但有多少人,儿时就有属于自己的电脑呢。

那时候身边的同龄人都有 “QQ”,家里终于有了一台可以浏览 Web 的设备了,不注册一个 QQ 吗。

QQ原来从00年之前就有了QQ原来从00年之前就有了.webp

有些特别的场景,当亲身经历时,突然发现自己对这个场景无比熟悉,好像以前经历过或梦过相同的。

写到这里我想说一下,沈阳的天气是真热啊。我在实木的桌子上写到这里,胳膊贴着桌子,不一会贴的地方就热了。刚贴的时候是凉的,贴一会得换个位置。

注册 QQ 的时候好像也是这样,当自己看到注册成功,出现 QQ 号那一瞬间,仿佛自己以前预见过要发生这个事情,就连 QQ 号都一模一样。

注册了 QQ 那时候,就是添加身边的熟人,虽然也说不了几句话,但是那时候我觉得 QQ 好友越多,人缘就越好。

中间断片了。

到了高中,QQ 开通了【扩列】功能,我在此期间加了很多很多网友(保底 3000 名),这些网友都是互赞的,然后呢还可以看他们 QQ 空间发的日常。

在此期间也认识了一些朋友,虽然都是网上的,但也给无聊的课余生活添加了点乐趣。

第一个朋友姓许,是个女生,那时候她初中。

第二个朋友姓曹,他声音特别好听,还带我打王者荣耀。那时候我经常玩到深夜,然后我妈就催我赶紧睡觉别熬夜。

还有一个朋友叫什么名字忘了,但那时候我过生日,他没什么送我的,就给我充了个 SVIP。然后我发现他开通的是自动续费,我说你不关吗,他说自己有钱,这点小钱没什么的,我后来又说那我以后不得把钱还给你吗,他说你还不还都行。我觉得太不好意思了,就让他把自动续费关了。

还有一个朋友姓陆,他也是唯一一个还在我列表里的朋友(高中的时候交的)。那时候“丧”是年轻人的潮流,很多年轻人都发这种文案,我也跟风在空间发然后攒访客量。然后这个人就注意到了我空间发的说说,她主动私聊我然后安慰我说别这么伤心了,我来开导一下你。

还认识了几位朋友这里不一一列举了,但是这些朋友除了刚刚提到的那位剩下都删掉了。

在那时候,我们身边的人也喜欢比 QQ 等级,在那时候 QQ 等级超过一个皇冠的很少。他们家里有电脑有手机,可以天天在线,还开着特权,QQ 等级升的很快。于是我也在这方面努力。

当然这些都是年轻人娱乐的方式了,每一代年轻人都有自己在意的东西。这种合理就尊重,比如削卡片,但不健康的方式当然要反对且管制,比如最近火起来的烟卡。

我现在的 QQ 应该很值钱,有想要的吗,想要我也不卖,就是炫耀。

我加的群里面有卖 QQ 号的,然后我们上 Linux 课的时候老师也说他的 QQ 是八位数,有一个皇冠,是不是很值钱,我在闲的时候就估了一下,能卖 1000 吧。

前段时间看我的 QQ 等级,121 级,离 128 级(2 个皇冠)很近了,于是我找了个代挂,每天自动帮我做做任务,攒攒时长。

我的 QQ 等级我的 QQ 等级.webp

代挂平台代挂平台.webp

现在每天能攒 10 天作用,最多三个月,就可以到 128 级了。

以前 QQ 到 64 级的时候,激动了好久,不知道这次到 128 级了以后自己会是什么心情呢。

现在各位还用 QQ 吗,你们的 QQ 都是几位数的啊,都多少级了。

在这里提一下,我用 QQ 用的比较多,但是有很多小伙伴都加我的微信。页脚 QQ 的链接电脑的 QQ9 NT 可能打不开,手机是可用的,欢迎加我的联系方式和我一起交流建站的问题,我很乐意解答。
]]>
11 https://imqi1.com/note/349.imqi1#comments https://imqi1.com/feed/
分享几个自用的站点防盗刷的小方法 https://imqi1.com/tech/339.imqi1 https://imqi1.com/tech/339.imqi1 Mon, 08 Jul 2024 00:49:00 +0800 最近在群里观察到有一些小伙伴被某山西的 IP 盗刷了,扣了 400 多 G 的流量。我前段时间也是因为站点监测总被该 IP 盗刷,导致我将它从我的国内云服务器上转到 Vercel 上部署了。建站这么久了,发现这些人盗刷资源都是那几个套路,在此分享一下给各位一点小小的参考。

在站点监测(status 二级域名,目前已关闭)被盗刷的几天,它频频触发用量封顶,导致站点被关停数次。除了 IP 是山西的以外,我注意到它每次盗刷的资源都是 JS、CSS 文件。从下图可以看到,index.js 文件比主体的 HTML 文件要大上几十倍,所以它盗刷大的 JS 文件比盗刷小的 HTML 文件有效。另外,我们的站点都托管于中国大陆,在我注意到的盗刷中,服务器及加速地区都是国内。所以盗刷者使用了国内 IP 就是为了更快速地访问站点的资源,然后进行盗刷。

status.qi1.website 中各文件的大小status.qi1.website 中各文件的大小.webp

再看下本站 imqi1.com 中各文件的大小。

imqi1.com 各文件的大小imqi1.com 各文件的大小.webp

只要网页内容不是特别多的,很多网页都是 CSS、JS 文件比 HTML 文件更大,所以我要分享的第一个方法就是将所有静态资源,如 CSS、JS、图片、音视频等放在云存储中,然后为云存储加防盗链,只有站点可以访问,小站的话加一个 Referer 校验就足够了。将静态资源放到云存储中最大的优点就是可以大大减轻原站的压力,防盗链也会起到一部分防盗刷的效果(防盗刷的是主站,这里不包含云存储的防盗刷)。

在这里值得一提,公益服务最怕的就是被盗刷,比如杜老师的图床。杜老师的图床不是总被攻击吗,我觉得杜老师的图床可以加一个防盗链的功能(我不是去不图床的用户,我不知道杜老师的图床有没有防盗链功能),给注册的用户加一个授权域名,只有该域名才能访问图床内的属于该用户的资源。这样做感觉可以缓解一些图床被攻击的问题。

然后呢剩下的方法就很简单了,都是比较常用的方法,在不影响正常使用的情况下,有的都可以开一下。

速率限制速率限制.webp

用量封顶策略用量封顶策略.webp

限制地域访问限制地域访问.webp

境内解析到国内CDN,境外解析到CloudFlare境内解析到国内CDN,境外解析到CloudFlare.webp

Referer防盗链Referer防盗链.webp

时间戳防盗链时间戳防盗链.webp

最简单的方法,其实就是使用长期免费且稳定的服务,比如 Vercel + CloudFlare,或者又拍云联盟的云存储,即使被盗刷,我们也不需要支付高额的费用。

想详细了解防盗刷的可以阅读下面的文章,讲的很详细。

COS&CDN防盗刷方案 - 腾讯云精选文章

]]>
5 https://imqi1.com/tech/339.imqi1#comments https://imqi1.com/feed/
站点开发手记 https://imqi1.com/note/329.imqi1 https://imqi1.com/note/329.imqi1 Thu, 04 Jul 2024 17:34:00 +0800 想法 & 历史

在大二上学期的时候,我想过有一个自己的网站,里面可以记录自己。当时还不知道有“博客”这个东西,向同学请教后,我才知道了这个名词。在建站初期,自己还是小白的时候,也是这个同学教的我,在此对他表示感谢。当时在腾讯云靠新用户优惠买了个一个月的服务器,还有域名,备案也是自己弄的。在备案没有通过期间,自己没有找到合适的 CMS(Content Manage System,内容管理系统),就在拼多多上找建站的订单,大多都是源码,于是就找到了第一个自己比较喜欢的样式,然后自己改了改,就正式上线了。

网页样式我记得,但是找不到源码了,我就画了一个,类似于下面这样。

第一个网页的源码第一个网页的源码.webp

第二个接触到的框架就是 halo 框架,用了一个月。当时请教了同学之后,为了不过多麻烦他,我自己在网上搜教程,搜视频,最后找到了一个以 halo 框架作为 CMS 的视频。看了视频效果,我很满意,于是我就跟着他操作。选用的主题是Heo设计的,然后小孙同学开发的 theme-halo-hao 主题。但正如[浅尝Halo博客框架:基础体验还一言难尽]一文中提到的,Halo 有一堆 bug,然后我那时候还是小白,连 docker 都不会,只会跟着文档走,而 Halo 的文档我又看不懂,数据也丢失了,于是就从头开始,换了另一个框架:Typecho。

Halo-Theme-Hao主题样式Halo-Theme-Hao主题样式.webp

Typecho从过去一直用到现在,最开始在 Typecho 社区尝试过许多主题,然后在某主题站内看到了 🌸MyDiary 主题,它是收费的。我从建站到现在,每一项服务都在花钱,所以当时没有在意太多,就购入了这款主题。当时建站追求的是颜值和功能,MyDiary 主题很满足我的需求,于是第一次站点使用了此主题开始了第一次长时间的运营。

MyDiary主题MyDiary主题.webp

再后来,MyDiary 主题作者出了新作品。刚开始价格很便宜(50左右?),还在测试版本,我也是第一批使用新主题的用户,还写了篇五千字的测评文。MyDiary 主题是固定的左右栏,我不喜欢,还尝试修改过。新主题的导航栏在上方,配色很简洁,盒子还会发光,还有很多配色,我也是被它花哨的功能吸引了。Typecho 的主题都很简单,但是新主题功能超级多,样式也有很多。在换到现在这个主题前,站点一直用的新主题,直到24年初我决定开发一个属于自己的主题。

MyLife主题MyLife主题.webp

和以前一样,在主题站看了好久,找到一个小众的又符合我的主题:Citizen。换上这个主题了以后,也在作者处征求了魔改的意见,作者也同意了(他说我拿去倒卖都没事),于是我也就在此主题的基础上添加了许多我喜欢的东西。

改动

我喜欢很多其他博主设计的样式:

  • blog.zhheo.com 的关于界面,风格是圆角矩形,滚动的卡片。
  • thyuu.com 中展示相册的封面铺满了屏幕。
  • 苹果官网的站点地图。我们熟知的站点地图都是以 XML 形式展示给搜索引擎的爬虫的,而且很多博主把站点地图内展示的东西以“侧边栏”、“归档”、“内容统计”等形式呈现给读者,整体都很分散。我觉得苹果官网和大多数国内网站的站点地图一样,就把网站中所有的内链全部放到此页中,读者可以快速找到他想要的页面,而不必去导航栏或页脚处查找,极大方便读者的阅读。
  • blog.bennyxguo.com 的归档页面,归档是以时间线形式呈现出来的。
  • msn 的图注,用一个小线条将图片和图注连接起来。
  • skywt.cn 的导航栏,有一个很明显的伸缩动作。
  • guhub.cn 的主页。
  • 子比主题邮件通知的样式。

于是参考着这些样式,加上思考如何把这些样式完美地融合在一起而不违和,我总耗时两星期左右,把这些样式融合到了一起。

现在的 Citizen 主题已更名为 ImQi1 主题。在看到风记星辰打算将自己的主题作为独立主题分发并起名字时,虽然我没有分发的想法,但是我也觉得,仪式感要有。于是我开始重构代码,尝试让 imqi1 这五个字符遍布各处。

现在你所看到的imqi1.com,就是我自己的得意之作。为什么得意,因为我完成了开头时提到的梦想:想过有一个自己的网站,并且还是自己写的。或许学计算机专业的幸福感就来自于此吧。

成果

  • 全新的关于界面。其中,大多数模仿自 skywt.cn,小部分模仿自 blog.zhheo.com/about.html。
  • 全新的导航栏,完全模仿自 skywt.cn。
  • 模仿着thyuu.com中图片分类的封面展示,我也做了一个符合本站风格的“摄影”类封面展示,其他分类则不再显示封面。

摄影类文章封面展示摄影类文章封面展示.webp

经过了一个小时的优化,桌面端LightHouse跑分几乎满分,但移动端略低一些。

桌面端LightHouse跑分桌面端LightHouse跑分.webp

细节

除此之外,我还在网站里设置了很多小细节,可能有很多人没有注意到。

  • 浏览器控制台中的欢迎提示;
  • 关于页面中的站点截图中,展示的站点使用的主题模式取决于当前使用的主题;

还有一部分则是站点中莫名出现的字符,其实它们都有自己的意义:

  • 首页中头像右侧第一行文字“棋 / Qi1 / .”,其实都是我各个平台的昵称,最后的“.”也是昵称。
  • imqi1,这个字符组合实际上是 I'm Qi1,即“我是棋”的意思。因为 1 和 Qi 同韵母,且某些平台不允许短昵称,所以我就将它们连到了一起。

回答

有很多人问过我关于建站的一些问题,我很乐意和大家分享。在此我分享一下我的网页都运用了什么技术。

本站域名托管于腾讯云,加速服务是腾讯云的 EdgeOne 个人版,服务器是京东云的 2H4G5M 轻量云主机,云存储则使用的是又拍云云存储。

本站的 CMS 为 Typecho,主题为魔改过的 Citizen 主题,魔改后的主题不分发也不售卖,仅个人使用。至于样式,我的样式都是参考的别人的,我感觉本站的样式可不可以参考都谈不上。

本站加速服务有 EdgeOne 和又拍云云存储提供的 CDN 服务,还有 Typecho 的基于 Redis 数据库缓存的 Tpcache 插件,以提高本站的访问速度。

本站的字体为思源宋体,代码字体为 JetBrainsMono。这两个字体都托管于又拍云云存储中,且加入了防盗链和跨域等限制,因此需要引用这两个字体的请前往官网下载。思源宋体链接 JetBrainsMono 字体链接

值得一提的是,思源宋体字体的整体文件大小很大,约2M,对于低带宽的客户端来说很不友好。目前很多网页都对字体分段加载(我也不知道具体的名词是什么),具体就是将一个字体文件拆成几十个字体文件,每个字体文件有10KB左右,然后在CSS中,给出这个字体的链接和对应的Unicode编码范围。举例:

@font-face {
    font-family: "Noto Serif SC";
    src: url(https://cdn.imqi1.com/static/notoserifsc/H4c8BXePl9DZ0Xe7gG9cyOj7mlK1SzUpCNMKEN0nmGnGv-OMEQDgKS-k5SiuioPhBdQcziZZTQ.4.woff2) format("woff2");
    unicode-range: U+1f1e9-1f1f5,U+1f1f7-1f1ff,U+1f21a,U+1f232,U+1f234-1f237,U+1f250-1f251,U+1f300,U+1f302-1f308,U+1f30a-1f311,U+1f315,U+1f319-1f320,U+1f324,U+1f327,U+1f32a,U+1f32c-1f32d,U+1f330-1f357,U+1f359-1f37e
}

@font-face {
    font-family: "Noto Serif SC";
    src: url(https://cdn.imqi1.com/static/notoserifsc/H4c8BXePl9DZ0Xe7gG9cyOj7mlK1SzUpCNMKEN0nmGnGv-OMEQDgKS-k5SiuioPhBdQcziZZTQ.5.woff2) format("woff2");
    unicode-range: U+fee3,U+fef3,U+ff03-ff04,U+ff07,U+ff0a,U+ff17-ff19,U+ff1c-ff1d,U+ff20-ff3a,U+ff3c,U+ff3e-ff5b,U+ff5d,U+ff61-ff65,U+ff67-ff6a,U+ff6c,U+ff6f-ff78,U+ff7a-ff7d,U+ff80-ff84,U+ff86,U+ff89-ff8e,U+ff92,U+ff97-ff9b,U+ff9d-ff9f,U+ffe0-ffe4,U+ffe6,U+ffe9,U+ffeb,U+ffed,U+fffc,U+1f004,U+1f170-1f171,U+1f192-1f195,U+1f198-1f19a,U+1f1e6-1f1e8
}

上面的CSS代码中,unicode-range和src是一一对应的。这样网页中只要出现了该范围的字体,CSS就会加载对应的字体文件,而不需下载全部字体文件。

计划

明天就要回沈阳了,暑期计划就是搭建一个类似云笔记的站点,但是不记笔记了(因为不再学新知识了)。这个笔记里记录一些常用库的用法,然后把它们的库做一个镜像,加快访问速度。

预想的样子:

标题:JQuery

内容:jQuery is a fast, small, and feature-rich JavaScript library...

jQuery的用法:$(选择器).方法(参数),如改变 CSS 样式:$("#some-element").css("some-style", "some-value")

类似于上面这样吧。

写在最后

我觉得,学习计算机专业最大的成就感就来自于,可以将自己的想法在计算机中变成现实。这次有了自己的主题,我很高兴,我在其中尝试了很多没有尝试过的新事物。最让我觉得方便的,就是我给网页加了个 PWA。这里的“写在最后”,就是我用手机编写的。感谢代码给我的生活中增添了如此多的乐趣。

]]>
7 https://imqi1.com/note/329.imqi1#comments https://imqi1.com/feed/
一组光遇的合照(2) https://imqi1.com/interest/328.imqi1 https://imqi1.com/interest/328.imqi1 Thu, 27 Jun 2024 12:53:13 +0800






]]>
3 https://imqi1.com/interest/328.imqi1#comments https://imqi1.com/feed/
吐槽一下我很讨厌的行为 https://imqi1.com/discuss/320.imqi1 https://imqi1.com/discuss/320.imqi1 Tue, 25 Jun 2024 22:53:00 +0800 心情不太好,找某些人出出气。今天吐槽一下哪些行为让我很讨厌甚至厌恶。本人东北人,本文是东北话纯享版,欢迎阅读。

  1. 吸烟。

我非常讨厌别人在我身边抽烟,我都会躲开。抽烟我不反对,因为我的舅舅就抽烟,但是我非常讨厌烟雾,我去他家做客时,他抽烟都会离我远一些。他的牙齿已经被烟熏的全是龋齿,有很多都烂了。

我也非常讨厌在室内抽烟的人。我以前住在乡下的时候,我最不喜欢去宴席,因为每一桌都有人抽烟。宴席还是在封闭的室内,乡下空调也不普及,门窗还闭着,整个饭店里面都是刺鼻的烟味。现在到了大城市,有一些小餐馆仍然有人抽烟。我都不想跟他们说明这情况,就和朋友调个座位就可以了,不过我的脸色肯定是非常难看,那是给他们看的。

  1. 垃圾到处都是。

自从我们走廊里的垃圾桶消失了的一段时间,这些人的隐藏素质可显露出来了。有一次我去阳台取衣服,被一个桌子拆了的部件拌的失去了平衡,这些部件就堆放在原来放垃圾桶的位置。当时我就在大群里说了一些话:“走廊里的木头谁放的啊,能不能扔到楼下垃圾桶里?我去阳台差点被它们绊倒,等着谁给你收拾它们呢?”

还有我们宿舍楼三楼,有人在走廊里抽烟,味道在四楼就能闻到,而且三楼某些宿舍门口的垃圾堆成山了,还不清理。我们宿舍对面就是厕所,本来很臭,这些垃圾和厕所的臭味是要来个大杂烩吗。

  1. 车子乱停。

我们学生骑的都是电动车,但是电动车也得好好停放吧。马路两边的车子停的整齐有序,车头都挨着马路边上,但是有些人就是喜欢把车子堵在你的车后面让你出不来。当然造成这种情况的根本原因是车子停满了,那你是不是可以找个远点的地方停呢。这个事情就像排队一样,先来的就有位置,没有的就去别的地方,要不就等着呗。

  1. 插队。

很久没坐过公交车了,坐的都是出租车,一方面是因为出租车方便,那么相反,公交车就极为不方便。沈阳属于新一线城市吧,地铁、公交车每次都找不到座位。然后呢,某些中年人,明明在等车的时候站到靠后的位置,然后一上车,人家都在排长队上车,偏偏就有几个人走到队伍侧面去插队。

  1. 食堂占座。

虽然我也总是在食堂占座,但是也是迫不得已。每次去食堂,只要去晚了一点,食堂的桌子上面就全是书包、衣服、各种占座的物品。食堂里面本来就明确规定禁止占座,但是有些人占座就是占很长时间,有很多次我吃饭之前,东西在那,吃完饭,东西还在那,始终就没见过人。

  1. 干什么总让别人带。

这个“带”是多方面的。第一种就是去个超市,帮忙带个老冰棍,帮忙打印个报告,帮忙取个快递。第二种就是你们组缺人吗,我可以来吗。来了之后,什么都不做,到了实验室,手机平板往那一放就开始刷抖音打游戏,然后干什么活全靠组长安排。全都不会可还行,但你会,还不做,欺负谁呢。

还有一种情况与其类似的,没问,关系一般,东西不经允许直接用,或者自己经常没有经常借。

再延伸一下,自己不想努力,借别人的抄抄吧,改改就成自己的了,或者去网上问问,或者问问ChatGPT。

  1. 穿的很少的女生。

这里我说的保守一点,列举一些在我们学校的:只穿睡衣睡裤拖鞋出门、不洗头发还披着头发、穿的衣服又少又肥,尤其是领口,我一米九的个子稍微低头就能看见里面。还有一部分放在下面讲。

  1. 不会骑电动车就上路。

不会骑的是什么意思呢?过个减速带超级慢,然后过完减速带,左右晃了好几下,尤其是女生。会骑电动车的都知道,如果你骑得慢,很容易摔倒,我们学校里面很多事故都是这样发生的。

然后女生还有穿着裙子骑车的。

除了不会骑,还有左右转不看后面的,有后视镜看看后视镜吧,没后视镜就回头看一眼,别突然就转弯。掉头也包括在前者里面。还有一直鸣笛的,这和深夜炸街的没什么区别。还有不看红绿灯,直接穿行马路的。

  1. 只穿个拖鞋去教室的。

上课穿拖鞋,考试穿拖鞋,去做实验穿拖鞋。你的脚干净也行啊,脚趾甲整齐不脏也行啊,脚不臭也行啊。我穿的拖鞋都是洞洞鞋前面全是遮住的,而且我也穿袜子,穿拖鞋光脚丫脚还不干净的就别去了呗。

  1. 外放声音特别大的。

我们寝室里就有,也不管别人睡不睡觉,就是开的超大声。打游戏的声音、刷抖音的声音,然后不光外放声音很大,和朋友打游戏开麦,嗷嗷叫的。声音能有80分贝。

欢迎补充。

]]>
9 https://imqi1.com/discuss/320.imqi1#comments https://imqi1.com/feed/
我可能不是懒,而是太累了 https://imqi1.com/discuss/317.imqi1 https://imqi1.com/discuss/317.imqi1 Wed, 19 Jun 2024 00:02:00 +0800 最近事情真的多,考试没考过,实验一大堆,没有学习的动力,觉得自己很累。我还以为我变懒惰了,面对着父母亲,自己甚至有点逃避。可能和人聊个天打个交道,都觉得自己被消耗了。就连打游戏也没有动力,没有思路,最引以为傲的王者荣耀,我也开始走下坡路了。

如果你是i人,社交、派对可能更消耗你;如果你是e人,和朋友一起可以快速回血。如果白天一直处理繁杂的信息,那下班后还过度使用电子设备,只会让你的感官受到更多的刺激。如果白天一直在和人打交道,晚上还要继续社交,也会让有些人身心俱疲。

问问自己有多累?

  • 早晨不想起床,即使勉强起床,也是浑身倦意。
  • 工作或看书注意力难以集中。
  • 说话有气无力。
  • 不愿与同学交流,回到家后也总是默不作声。
  • 总是伸懒腰,打哈欠,睡眼惺忪。
  • 懒得爬楼,上楼常常绊脚。
  • 公交车开起来了也不愿赶着上车。
  • 喜欢躺在沙发上,把脚抬高才舒服。
  • 易忘,记忆力很差。
  • 不易入睡,很容易做梦。

我总觉得玩手机叫休息,睡觉也叫休息。

这类休息能让我感到舒适,仿佛也没什么不对。到底狂玩,狂睡也累,那就是有问题。

我一休息就躺下来玩手机,总是下意识看抖音,生怕错过有意思的事情。抖音巨量的信息掩盖了我真正的需求,快节奏的冲浪也都耽误了我很多时间,让我越玩越累。

明明睡得很多,但总也睡不够。睡眠不一定能降低疲劳感,可能是营养不足,压力过大或者是药物作用。经常补觉,总是还“欠觉债”,总也还不完。

我感觉我的休息很被动。

什么是休息?过去我喜欢游山玩水,去人多的地方看热闹;逛街看电影,拍照等等。

如果身体疲惫,那我们可以睡一小会,伸个懒腰,做做运动或者泡个澡。

如果精神疲惫,我们可以转移注意力,时不时问问自己你还好吗。

如果是社交疲惫,我们就先别和别人打交道了,先给自己放个假,让自己独处一会。

如果感觉自己像一台机器,每天重复着以前的操作,我们可以找一下以前的创造力:画画,唱歌,哪怕是写代码。即使做的不好,那也是真正的自己。

如果感官过载,接收了太多的信息,或者连光线和声音都难以接受,那就试试“关闭感官刺激”。睡前少玩一个小时手机,或者关上窗帘,发呆几分钟。

如果我们总是在讨好别人,那我们不妨卸下伪装,找一个真心朋友,倾诉自己的想法,可以是家人,同学,或者是小动物。

如果觉得孤独,生活毫无意义,被困在生活琐事中,可以试着给自己找一些归属感,比如参加社区,阅读好书,或者加入群聊,和别人交换意见。

]]>
7 https://imqi1.com/discuss/317.imqi1#comments https://imqi1.com/feed/
现在的年轻人越来越不尊重电脑了 https://imqi1.com/discuss/307.imqi1 https://imqi1.com/discuss/307.imqi1 Sat, 15 Jun 2024 10:52:00 +0800 前两天,一个离谱的话题冲上了微博热搜,叫Steam代安装。说现在有一堆网店在提供收费服务:给别人装Steam。销量最高的那家,已经卖出了8000多份。

热搜热搜.webp

安装价格从3.6到19.8不等。3.6标准版,是商家给你链接,自己下载安装;7.8豪华版,商家远程给你安装好;19.8的尊享版,账号帮你注册好,加速器给你开好,上手就能玩。

尊享版尊享版.webp

可能看到这里你会觉得,这有啥大不了的,我上我也行。那你看看评价和买家秀。

真的有不少买家对电脑常识的缺乏,到了让人无法理解和沟通的程度。

众所周知一些“风险链接”在微信里是打不开的,所以商家用微信发送链接后,都会加一句浏览器打开。

但还是有买家因为“微信里点不开链接”,消息回复不及时,给了差评。

评价评价.webp

除此之外,还有买家搞不懂什么是“安装路径不能有中文” ,什么叫“其他浏览器”。

之前不是还有个植物大战僵尸杂交版火了吗,我能在里面看到评论区里有人说,“用夸克网盘解压,那不是还要花钱吗,不还是花钱买游戏吗”。有没有一种可能,夸克网盘电脑版可以直接下载呢。

还有一个游戏UP主专门发了个动态吐槽这些不懂电脑的游戏爱好者。

庄不纯吐槽电子文盲庄不纯吐槽电子文盲.webp

还有,有一名信息课的老师监考,试卷上要求学生开启电脑,有学生按开了显示器的电源。

每个电脑小白都经历过,想下载某个软件,不小心下载了“P2P下载器”,或者进入某软件园,使用高速下载(如“电信高速下载”)。

电信高速下载电信高速下载.webp

不仅国内这样,国外也有年轻人不会是用电脑。有人在Reddit上吐槽:公司请一批 20 岁年轻人来试用,结果八分之七不会打开浏览器。还有人吐槽自己要教一堆 18-21 岁的员工如何截图、打印文档、在不同软件之间切换。

科技进步了,计算机的普及更高了,为什么还有人不会使用电脑?

时间回到我上初高中的时候。

在那会,玩电脑是一件非常值得在意的事,也充满了仪式感。

电脑自带的三维弹球和《 金山打字通 》就能玩一天。

金山打字通金山打字通.webp

那个时候对我们魅惑力最大的就是微机课。那时候不是家家都有电脑,每次进入实验室要带脚套,然后按照老师的指引到达自己该坐的位置,然后跟随老师的指引学习怎么使用MS Office。可是我们都会偷偷打开扫雷、蜘蛛纸牌游戏或4399、植物大战僵尸,然后玩上一整节课。

但是现在,手机越来越替代电脑,有很多以前要在电脑上完成的操作,现在用手机APP就能完成。就连登录个QQ找朋友聊天,也不用开启电脑了,拿起手机就可以。

现在人们使用手机不需要到处碰壁,手机各项设置都给你调好了,软件在应用商城里可以下载,系统更新也可以一键完成,不需要去浏览器上找安装包,不需要判断是不是病毒,也不需要查找繁琐的教程了。

现在电脑可能都不是必需品了,现在是人手一个手机而不是人手一个电脑。

如果到以后,手机不再成为必需品了,也会有人发出类似的感想吧,标题就叫:“为什么年轻人都不使用手机了”。

仔细回想一下,我们的计算机水平主要是来源于自己的摸索。

我刚接触电脑的时候,就是为了玩游戏。硬着头皮研究什么是ISO和安装路径,弹窗闪退怎么办,去哪挨个下载缺失的dll文件。

我的计算机技能,就在碰壁过程中逐渐娴熟。

就算真遇到没法解决的难题,只要下个订单,师傅立马库库给你修好。

淘宝上可以修复错误的订单淘宝上可以修复错误的订单.webp

好在,现在国家开始在这里下功夫了。

2022年,教育部就公开了全新的义务教育课程方案和标准。

这门课被改名成信息科技,它正式从“综合实践活动”中单飞,成为全国统一开设的独立课程科目,并覆盖到了九年义务教育的全阶段。3-8年级单独开展课程,其他年级融入进语文、数学、科学等课程。信息课也有课时标准了。它在九年总课时(9522节课)占比须达到1%-3%。换句话说,一个初中毕业的学生至少接触过95~285节信息课。

教育部新标准教育部新标准.webp

]]>
23 https://imqi1.com/discuss/307.imqi1#comments https://imqi1.com/feed/