六月份折腾的几个东西

六月份工作很少，一直带薪摸鱼，折腾了不少东西，现在天气热加上后面升学的安排，提了离职，给自己放个暑假~
2024.07.12：放暑假了比拿了国奖还开心🥳

1、低成本搭建了GitHub文件下载加速站

GitHub文件在国内的访问一直是个玄学问题，有时候就是会在没有科学上网的环境下有下载GitHub文件的需求。

网络上有不少现成的项目可以解决这个需求，一般叫加速站或者中转站，本质上是一个代理，可以做到将GitHub的静态资源进行转发，但是如果访问量太多的话，网站也承受不住，于是开始出现利用开源项目方便自己部署。我也尝试用hunshcn/gh-proxy进行搭建，Worker的免费版每天有 10 万次免费请求，完全够用了：

创建Worker
点击“编辑代码”
拷贝https://github.com/hunshcn/gh-proxy/blob/master/index.js代码到左边代码编辑框，替换掉默认的代码
修改代码：

ASSET_URL是静态资源的url（实际上就是现在显示出来的那个输入框单页面）

PREFIX是前缀，默认（根路径情况为"/"），如果自定义路由为example.com/gh/*，请将PREFIX改为 '/gh/'，注意，少一个杠都会错！
部署程序
在/settings/triggers/Custom Domains选项卡下，添加子域名
测试访问：https://[子域名]/[前缀]/[静态资源地址]

理论上，可以直接复制连接的都属于静态资源，可以直接拼接

2、利用Cloudflare搭建了诸多服务

Cloudflare的边缘服务有着很大的便利，我用空闲时间摸鱼搭建了alist 、影视站、文件暂存服务，因为辞职准备暑假了，所以这部分不展开写了

3、两份图床迁移的经验

3.1 Wordpress文件迁移到图床

从Wordperss导出后导入Halo

halo提供了一个插件给我们方便地迁移Wordpress，但是实测在迁移过程中如果勾选了限定的分类的话会出现选中了文件识别不了没有下一步的情况，这个问题在后续的版本更新中修复了，如果遇到类似的问题更新一下版本就行

打包附件

我们可以在 WordPress 部署服务器后台，找到附件存储目录，例如我在阿里云部署之后默认的 /data/wwwroot/wordpress/wp-content/uploads，打包该目录下的 upload 目录：

tar -czvf uploads.tgz uploads/

上传OSS或者服务器

如果上传服务器

将得到的uploads.tgz文件拷贝到新的Halo服务器上，并在Halo工作目录下的attachments目录中创建migrate-from-wp子目录。
```
mkdir -p {halo-work-dir}/attachments/migrate-from-wp
```
将uploads.tgz中的文件解压到上述目录中。
```
cd {halo-work-dir}/attachments/migrate-from-wp
tar --strip-components 1 -zxvf /path/to/uploads.tgz
```
操作完成后，在Halo服务器上的{halo-work-dir}/attachments/目录，会得到如下目录结构：
```
{halo-work-dir}/attachments
├── migrate-from-wp
│   ├── 2015
│   ├── 2016
│   ├── 2017
│   ├── 2018
│   ├── 2019
│   ├── 2020
│   ├── 2021
│   ├── 2022
│   ├── elementor
│   ├── wpforms
│   └── wp-import-export-lite
└── upload
    └── local
```
5.在Halo中增加转发规则

将附件上传到Halo服务器以后，暂时还不能通过Halo提供的链接访问到附件。接下来，需要在Halo的工作目录中创建一个application.yaml配置文件，并在配置文件中增加如下配置：
```
halo:
  attachment:
    resource-mappings:
      - pathPattern: /wp-content/uploads/**
        locations:
          - migrate-from-wp
```
通过该配置，用户就可以使用{HALO_EXTERNAL_URL}/wp-content/uploads/{文件名}形式的链接访问到这个文件，与WordPress中的附件链接规则一致。这样文章内容导入后，仍然可以使用原本的图片链接正常显示该图片。

如果上传的是S3协议的图床

可以使用rclone传输，Rclone 是一个强大的命令行程序，用于管理和同步文件到各种云存储服务，甚至是挂载一些网盘到PC上。

R2是基于S3协议的对象存储，网页端上传会限制文件数量和大小，通过alist的方式又不稳定，所以对于迁移大量数据来说rclone是个很不错的选择。

1.安装rclone

sudo -v ; curl https://rclone.org/install.sh | sudo bash

2.编辑配置

查看 config 文件识别的地址

rclone config file

编辑配置文件

vi [文件路径]

<配置名，任取>
type = s3
provider = Cloudflare
access_key_id = <密钥ID>
secret_access_key = <密钥>
endpoint = https://<accountid>.r2.cloudflarestorage.com
acl = private

3.尝试列出存储桶及其他常用的操作

# 列出所有存储桶:
rclone lsd <配置名>:
# 列出所有桶及内部目录文件
~ rclone tree  <配置名>:
  ...
# 列出指定桶及内部目录文件
~ rclone tree  <配置名>:bucket
/
└── XXX
    ├── XX1
    │   ├── XXXX.png
    │   └── XXXX.png
    ├── XX2
    │   ├── XXXX.jpg
    │   └── XXXX.png
    └── XX3
        └── XXXX.png
# 创建新桶: 
rclone mkdir <配置名>:bucket
# 删除空桶:
rclone rmdir <配置名>:bucket  
# 列出对象列表:
rclone ls <配置名>:path
# 计算对象存储总量:
rclone size <配置名>:path

4.上传和检索对象

# 上传本地文件或目录: 
# rclone copy [目录或者文件] test:桶名+路径
rclone copy helloworld <配置名>:bucket
# 查看
rclone tree <配置名>:bucket
# 下载对象到本地:
# rclone copy test:桶名+路径 本地目标路径
rclone copy <配置名>:bucket/README.md .
# 删除
# rclone delete test:桶名+路径
rclone delete <配置名>:bucket/README.md
# 更多
rclone --help

替换路径

文件迁移完成之后，还差最后一步——替换迁移文件中的静态资源的路径前缀，可以提取相关的特征：

比如把upload前面的路径换成R2/OSS的资源对应子域名，编辑文件时候推荐使用系统自带的记事本，实测IDEA替换的时候会导致某些换行

3.2 批量将GitHub图床切换至代理

修改Picgo

Picgo中GitHub图床用的cdn是https://cdn.jsdelivr.net/gh/[user]/[repo]@[branch]的方式，替换的话需要先将链接转换成raw形式：也就是把链接中的@换成/，把前面的https://cdn.jsdelivr.net/gh换成https://raw.githubusercontent.com；然后再把链接拼接上前面的图床中设置的子域名+前缀。

最终的形态就是：

https://[子域名]/[前缀]/https://raw.githubusercontent.com/[user]/[repo]/[branch]/[文件名]

替换链接

上面不是搭建了GitHub的加速站吗，图床是不就可以利用起来了

idea会出现缩进，采用默认的记事本

如下

https://cdn.jsdelivr.net/gh/linzepore/workplace-blog-posts-images@main

https://gh-proxy.zepo.re/transfer/https://raw.githubusercontent.com/linzepore/workplace-blog-posts-images/main

4、文章整理删除与保留

过去网站是在高中时期建的，经历了从git page + hexo 到 wordpress ，再到现在学完软件之后转的halo，有些不成熟的内容就不公开啦，花了不少时间整理

5、IDEA导入多模块

IDEA导入已经写好的多模块项目的时候，容易只导入随机的几个，产生丢失

有一个小技巧可以解决这个问题：

先新建导入已有的项目
然后任选一个主要的模块先导入，因为IDEA很多时候不会把多选的全部导入，比较麻烦
一直点下一步，这里选一下overwrite
然后选择新增模块，把其他几个添加进去即可

6、Umami 2.3.0 版本出错

Umami 构建 2.3.0 版本时出现了一个问题：

"✗ Command failed: prisma migrate deploy Error: P3009"

我的MySQL版本是8.2.0，这个错误是因为5.7版本的MySQL重命名语法不同，在参考一些博文的解决方式之后，主要是这几步：

找到 migration.sql 文件

如果不是基于容器构建的，这个文件可能会放在umami/db/mysql/migrations/02_report_schema_session_data，如果是像我一样直接使用1Panel构建的话，路径则是/app/prisma/migrations/02_report_schema_session_data

1Panel的容器默认失败会一直重启直至成功，如果修改成不重启又需要重新构建镜像，有一个方法就是先把它关了，这样就不会继续重启，方便操作容器

然后可以通过docker start [Umami容器名/id] && docker exec -it [Umami容器名/id] cat [路径]/migration.sql来确定路径

如果不存在，由于Docker的机制，关闭的容器不让访问文件，出现问题了又启动不起来，就只能把容器导出来了：
```
docker export [容器名/id] > zepore-unami.tar
```

修改 migration.sql 文件

找到文件之后，将文件的前六行：

-- AlterTable
ALTER TABLE "event_data" RENAME COLUMN "event_data_type" TO "data_type";
ALTER TABLE "event_data" RENAME COLUMN "event_date_value" TO "date_value";
ALTER TABLE "event_data" RENAME COLUMN "event_id" TO "event_data_id";
ALTER TABLE "event_data" RENAME COLUMN "event_numeric_value" TO "number_value";
ALTER TABLE "event_data" RENAME COLUMN "event_string_value" TO "string_value";

替换成：

-- RenameColumns
ALTER TABLE `event_data` ADD COLUMN data_type INTEGER UNSIGNED AFTER event_data_type;
ALTER TABLE `event_data` ADD COLUMN date_value TIMESTAMP(0) AFTER event_date_value;
ALTER TABLE `event_data` ADD COLUMN event_data_id VARCHAR(36) AFTER event_id;
ALTER TABLE `event_data` ADD COLUMN number_value DECIMAL(19, 4) AFTER event_numeric_value;
ALTER TABLE `event_data` ADD COLUMN string_value VARCHAR(500) AFTER event_string_value;

UPDATE event_data
SET data_type = event_data_type,
    date_value = event_date_value,
    event_data_id = event_id,
    number_value = event_numeric_value,
    string_value = event_string_value;

ALTER TABLE `event_data` MODIFY data_type INTEGER UNSIGNED NOT NULL;
ALTER TABLE `event_data` MODIFY event_data_id VARCHAR(36) NOT NULL;

ALTER TABLE `event_data` DROP COLUMN event_data_type;
ALTER TABLE `event_data` DROP COLUMN event_date_value;
ALTER TABLE `event_data` DROP COLUMN event_id;
ALTER TABLE `event_data` DROP COLUMN event_numeric_value;
ALTER TABLE `event_data` DROP COLUMN event_string_value;

ALTER TABLE `event_data` ADD PRIMARY KEY(event_data_id);

覆盖掉容器中 migration.sql 文件

将上面修改好的文件放在宿主机某一路径上

然后使用命令将文件拷贝进容器，实现覆盖：
```
docker cp [修改完文件目录]/migration.sql [容器名/id]:[第一步找到的路径]
```
删除所有表并重启容器

7、GitHub上传大文件

上传大文件到github的时候出现了一个错误

remote: error: File logs/sys-error.log is 125.18 MB; this exceeds GitHub's file size limit of 100.00 MB
remote: error: File xx-admin/target/xx.zip is 224.58 MB; this exceeds GitHub's file size limit of 100.00 MB

文件超过GitHub的时候需要采用Git Large File Storage的方式来完成上传

首先需要下载GLFS：

git lfs install

然后需要跟踪对应的大文件：

git lfs track [文件相对路径（上面报错中有相应的提示）]

最后将.gitattributes文件commit上去就可以重新push代码了

一般情况下到上面一步就完成了，但是我执行的时候出现提示说不存在这些文件，解决方式很简单，直接把**.git**文件夹中给删掉或者过滤之后再删除即可

8、超椭圆的实现

主题默认的logo展示是方形，想着把小米超椭圆设计搬过来，于是尝试了一下

html是一个简单的嵌套div标签

<div class="App">
<div class="icon"></div>
</div>

.App 样式：这个样式定义了一个 div 的形状、大小和背景。这里使用了两组百分比值的border-radius搭配旋转来创建一个超椭圆形状。

.App{
  overflow: hidden;
  width: 482px;
  height: 482px;
  transform: rotate(-19deg);
  border-radius:
    43% 57% 43% 57% /
    57% 43% 57% 43%;
  background-image: 
    linear-gradient(
      150deg,
      #fff49d 0%,
      #d85882 50%,
      #840e78 100%
    );
}

div.icon::after 样式：这个样式定义了一个伪元素，它的背景是一个图片，位置和大小与 .App div 相同，但是它被旋转了 19 度，用来抵消上面产生的旋转对背景图片的影响，同时不影响外形。

div.icon::after {
    content: '';
    background: url(https://halo-img.zepo.re/blog/2024-06-26T14:32:35-wpbqmzcp.jpg) no-repeat;
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 482px; 
    height: 482px;
    transform: rotate(19deg);
}

搞定，省下三百w