都说搭博客简单，鬼知道后端程序员要经历什么

作者：小傅哥 博客：https://bugstack.cn

沉淀、分享、成长࿰c;让自己和他人都能有所收获！😄

一、我࿰c;多能折腾！

Ὠc; 我跟你说࿰c;折腾蓄蓝࿰c;还能赚钱！

• 2013年࿰c;毕业以学Java的身份进入传统企业写C#和PLC࿰c;每天5:30下班࿰c;总有伙伴找到我帮忙做个网站。PS：要用php写࿰c;省服务器费用！
• 2014年࿰c;租住门脸࿰c;下班回来顺便࿰c;卖电话、内存卡、充电线、手机壳、充话费
• 2015年࿰c;搭建 itstack.org 域名博客࿰c;编写 Netty 5.0 案例࿰c;后因 org 域名不能备案࿰c;博客也挂了
• 2016年࿰c;从传统行业进入互联网已经半年࿰c;开始疯狂折腾 Java 以前不熟悉的技术
• 2017年࿰c;好奇所接触的一切新鲜框架技术࿰c;羡慕技术大佬的能力࿰c;书童一样学习高并发场景实现࿰c;这么大的调用体量怎么没有挂
• 2018年࿰c;不只是看了࿰c;开始对源码动手࿰c;把 RPC 实现了一遍࿰c;做了一套监控系统࿰c;写了一堆的中间件࿰c;申请了好几个专利࿰c;差点被淘宝中间件团队挖去。
• 2019年࿰c;从《用Java实现一个JVM》开始࿰c;捡回我的热情࿰c;申请并备案域名、搭建 jekyll 博客、开通公众号࿰c;年底成为 CSDN 博客专家并已积累公众号粉丝1k
• 2020年࿰c;2月编写第一个基于 Netty 实现的仿微信 IM࿰c;放到腾讯技术社区参赛࿰c;获得第一名(运营小姐姐告诉我࿰c;她把仿微信IM推给了小马哥࿰c;哈哈哈)。同年字节码编程、设计模式、面经手册等PDF相继出炉࿰c;火了 他们都问我是不是字节的！
• 2021年࿰c;赶在图书节࿰c;我的第一本技术书籍《重学Java设计模式》出版了࿰c;出书并不是终点࿰c;只是想走走没走过的路、爬爬没爬过的山࿰c;看看风雨过后的彩虹是否那么绚烂。

结束了吗？ 不࿰c;折腾依旧在！

2021年的1024࿰c;小傅哥一路趟坑࿰c;把300篇文章的bugstack虫洞栈博客从 jekyll 升级到 vuepress！

这些年的折腾在域名申请到备案、服务器选择到上线、php开发扩展功能࿰c;迁移兼容博客等࿰c;经验和技能储备都没问题࿰c;也会点 html、css、js、jquery 做自定义的开发处理。但在面对没接触过的 vue 时࿰c;依旧有点不知道从哪下手࿰c;而为了vuepress博客从能用到好用࿰c;一顿操作差点干拉胯！

技术拓宽、实力增强、薪资拉升࿰c;来吧࿰c;一起折腾！

二、坑࿰c;差点肝拉？

可能你没自己搞过 vuepress 的博客࿰c;你不知道。它这个官网说啥？说：像数 1, 2, 3 一样容 tui！糟老头子坏的很࿰c;没有一点前端知识根本跑不起来࿰c;更别说是生产使用࿰c;只能算是玩具级别。当然࿰c;不要误会࿰c;人家这个也是想着你有vue的知识背景的࿰c;不过我不是没有吗！ 为此在我折腾完把坑趟平以后࿰c;知道怎么正确操作后࿰c;还专门录了个搭建 vuepress 博客教程的视频࿰c;如下：

嘿࿰c;好嘛！有了这个案例后࿰c;我就一直在琢嘛࿰c;怎么把我的博客迁移过来呢࿰c;毕竟这套架构可以更好的承载我的文章࿰c;也能很大程度的提升阅读体验和对博客的操作空间。

日日思念惦记呀࿰c;就跟你处对象一样࿰c;朝为日࿰c;暮为月࿰c;卿为朝朝暮暮啊！咋整࿰c;办它吧࿰c;想过会遇到坑࿰c;也提前铺平垫稳了࿰c;但无奈还是会有很多因为没折腾过࿰c;vue 知识储备不足而遇到的问题。

1. 300篇文章迁移࿰c;链接问题

• 背景：旧版博客到新版博客的迁移࿰c;不只是想把界面结构更换了࿰c;还希望解决文章分类的问题࿰c;所以在有些文章会重新摆放它所属的文件夹。
• 问题：那么就会出现文章路径与原来文章路径不一致的问题。这其中还包括原有文章中用到的图片路径问题。
• 方案：分两阶段解决࿰c;如果目前把旧版文章全部下线会导致很大一部分老用户࿰c;尤其是保留了旧版链接的用户࿰c;在访问文章时就会出现 404 找不到了文章了࿰c;体验非常不好。所以这里上新版博客的同时也保留旧版博客在同一个服务器中࿰c;另外把服务器的 404 配置页面配置到 https://bugstack.cn 以免将来旧版链接几乎已经没有什么流量删除时࿰c;再次出现 404 所以为了安全起见先把 404 页面配置成首页࿰c;这样也能满足用户找到现有的文章路径。

2. 浏览器限制cookie࿰c;解锁问题

• 背景：小傅哥的博客有一个阅读解锁功能࿰c;这个解锁是基于公众号做的开发࿰c;浏览器生成通过友盟cookie获取6位的唯一码࿰c;当做用户的个人ID࿰c;再通过这个ID到公众号输入后绑定到公众号个人身份ID上࿰c;就解锁了。
• 问题：但有些用户限制了浏览器cookie࿰c;或者安装了一些拦截广告的插件࿰c;那么 cookie 就不能正确拿到了࿰c;一点阅读全文这个解锁码就不唯一了࿰c;卡卡的闪。我头都大了！
• 方案：咋办࿰c;总不能告诉每个用户࿰c;你把插件给我删了 cookie 给我打开吧࿰c;那他们肯定觉得傅哥技术拉胯呀！后来我就想肯定会有一个技术手段能在浏览器计算出唯一ID࿰c;否则我不登录时候浏览器xxxx࿰c;怎么就给我推荐了呢。经过搜索还真有对应的东西࿰c;就是浏览器指纹࿰c;fingerprintjs 浏览器指纹库࿰c;这个库用于查询浏览器属性并从中计算散列的访问者标识符。与 cookie 和本地存储不同࿰c;指纹在匿名/私有模式下保持不变࿰c;甚至在清除浏览器数据时也保持不变。妥࿰c;有了这个技术就妥嘞࿰c;在 cookie 限制的情况下࿰c;通过浏览器指纹获取唯一ID截取成文章解锁码。

3. 构建文件哈希命名࿰c;版本问题

• 背景：看到这的时候我人都傻了࿰c;vue 变异出来的文件竟然 数字+哈希值.js 想想也对࿰c;人家这样可以更好的保证版本升级࿰c;不至于出现缓存问题。
• 问题：有啥问题呢࿰c;你看左侧本地和右侧服务器࿰c;发现没。只要每次部署一个版本࿰c;服务器端就多出一个新的js文件࿰c;好家伙这用不了多久࿰c;不把我这小服务器干满了吗！！！删除？删错了呢࿰c;那多吓人！
• 方案：其实有时候遇到这样问题不知道咋查你懂吧࿰c;搜了半天不如问前端一下࿰c;原来这个是可以通过webpack把打包文件名称处理的࿰c;也就是你可以让每次的构建出来的 js、css、img 文件名࿰c;都是一个固定的名字。但还有点小问题࿰c;vue 里是这么搞࿰c;vuepress 怎么搞呢࿰c;找了不少资料终于找到 chainWebpack 可以配置文件名 config.output.filename('assets/js/cg-[name].js?v=' + datetiR_22_11845@E).end();

模块打包配置：

chainWebpack@H_874_172@: config @H_874_172@=@H_874_172@> {
    if (process.env.NODE_ENV @H_874_172@==@H_874_172@= 'PROduction') {
        const datetiR_22_11845@e @H_874_172@= new Date().getTime();
        
        // 清除js版本号
        config.output.filename('assets/js/cg-[name].js?v=' @H_874_172@+ datetiR_22_11845@e).end();
        config.output.chunkFilename('assets/js/cg-[name].js?v=' @H_874_172@+ datetiR_22_11845@e).end();
        
        // 清除css版本号
        config.plugin('mini-css-extract-plugin').use(require('mini-css-extract-plugin'), [{
            filename@H_874_172@: 'assets/css/[name].css?v=' @H_874_172@+ datetiR_22_11845@e,
            chunkFilename@H_874_172@: 'assets/css/[name].css?v=' @H_874_172@+ datetiR_22_11845@e
        }]).end();
    }
}

• 通过这样配置后࿰c;再打包出来的文件就都是 cg-名称.js 的文件了࿰c;每次 push 到我的站点服务器是上就可以只有一份同名的 js 了࿰c;不至于把我服务器搞爆。

4. Java VS php 公众号开发࿰c;服务器资源问题

流程图

DDD + php = 爷青回

• 背景：因为要开发博客到公众号的引流࿰c;所以需要对公众号做一些开发处理。
• 问题：最初我是使用 Java 语言写了一版࿰c;但目前随着用户体量的上升࿰c;调用我这个跑着 Java 程序的小服务器࿰c;已经有点小马拉大车了。现象就是服务崩溃࿰c;需要重启！！！
• 方案：咋办࿰c;花钱升级服务器？我有技术我花那钱࿰c;闹呢？上php呀࿰c;这玩意多升服务器资源࿰c;况且我在13年就折腾会了࿰c;把DDD思想给我架到php上࿰c;让它爷青回！

三、那࿰c;还能干啥？

你觉得视野范围重要吗࿰c;如果我不曾如此折腾࿰c;可能与我相遇的美好࿰c;也都将错过！

哪怕是工作࿰c;我也不希望自己是一个工具人。趁年轻、趁着有资源、趁着有时间࿰c;多给自己补充一些未来的可能࿰c;你现在所学到的所有知识、所结交的所有人脉、所开拓的所有技能࿰c;都将会在未来使用上࿰c;这些一点一点的点࿰c;会聚合成一条条知识线࿰c;在撑起你整个人生的页面。

尤其是现在在大厂࿰c;可能很多时候自己接触的工作范围是非常局限的࿰c;只是知道自己把代码写好了就可以了࿰c;关于它是怎么跑起来的࿰c;部署到哪里了࿰c;域名、VIP、Nginx、CDN、SSL࿰c;也并不清楚都是什么。这会有什么问题吗࿰c;短时间不会有࿰c;甚至还会做的很开心࿰c;但时间长了需要你承担更大的职责了呢࿰c;又或者需要你自己出去干点啥了呢࿰c;怎么在冷启动阶段让自己把这些事拿捏呢？千万别把补充自己的知识当做卷的借口࿰c;否则坑的是自己！

其实有一台服务器可以做很多事情࿰c;这不像你自己开虚拟机࿰c;一个模拟环境和真实环境࿰c;还是有很大区别的！

你可以用一台服务器部署你在工作中遇到的知识࿰c;也可以是自己想学习搭建的系统࿰c;就像小傅哥折腾的这些内容：

1. 搭博客：https://mp.weixin.qq.com/s/ZoQ0xAphJQkP_pb8H08BMg
2. 搞论坛：phpwind、Discuz、wordpress(有博客和论坛等模板)
3. 弄网盘：https://mp.weixin.qq.com/s/gzUrFexHcyCrw7XZ_L7N7w
4. 聊天室：https://mp.weixin.qq.com/s/OmXCY4fTfDpkvjlg5ME0ZA
5. 其他的：练习下自己的项目、搞个集群、玩玩ES、弄弄实战、留着接私活给别人部署演示

而这些内容的练习࿰c;都能让你把一整套从研发到运维的内容玩透࿰c;彻底的了解域名、备案、ssl、宝塔、Linux常用命令等等。

四、卷࿰c;咱搞起来！

1. 先neng个服务器

首先࿰c;无论你是否有服务器࿰c;你都可以跟小傅哥一起学习关于服务器的使用࿰c;我们建了个群专门学习服务器࿰c;添加我的微信：fustack࿰c;备注：服务器学习加群。

如果你还是一个新用户小白࿰c;那么可以跟着我的流程一起来࿰c;先neng一个便宜的服务器࿰c;学习使用即可。这里小傅哥给新人弄了个活动࿰c;79元即可买一台一年有效期的服务器࿰c;还是比我以前买的便宜多了！

• 购买链接：https://www.aliyun.com/minisite/goods?taskPkg=1111ydsrwb&pkgSid=11388&recordId=1033318&userCode=is4kfbdt
• 优惠价格：¥1,234.20 ¥69
• 参与条件：¥79 仅适用于新注册或注册未购买的用户࿰c;如果你是老用户可以找下对象或媳妇的帐号注册。

• 当你购买服务器的时候会看到࿰c;地域、实例、操作系统等࿰c;地域北京、上海、杭州的网速比较好࿰c;张家口的便宜但是网速会比较慢。操作系统默认即可࿰c;停机后可以更换。

2. 服务器介绍

在购买完服务器后࿰c;等待云平台数分钟初始化服务࿰c;完事就可以直接使用配置。如下：

• 重置密码：点击你的实例࿰c;蓝色的这个字母࿰c;进入后再右侧有一个࿰c;重置实例密码࿰c;操作。
• 远程链接：点击远程链接即可链接到你服务上࿰c;它是一个在线的操作。你可以通过本地的软件 xsHell 链接到服务上去。
• 更换系统：如果你对自己默认选择的系统不是很满意或者有其他需求࿰c;都可以点击停止系统࿰c;之后开始操作系统更换。

3. 系统更换成宝塔镜像

对于服务器系统来说你可以使用Linux命令安装各项服务组件࿰c;例如k8s、docker、jdk、tomcat、mysql或者php需要的内容等࿰c;但对于实际使用的运维来说࿰c;我们更希望运维成本越低越好࿰c;所以这里我们选择了宝塔࿰c;这样一个服务器运维面板来管理我们的服务器。

在各类的云平台上࿰c;包括：百度云、华为云、阿里云、腾讯云࿰c;都可以安装宝塔的࿰c;有的云平台还会有自己的已经准备好的宝塔镜像࿰c;这里我们以阿里云服务为例࿰c;把系统停机更好为宝塔。

停机

• 位置：点击云服务的实例࿰c;就可以进入到这个页面
• 操作：更换系统之前我们需要先进行停机操作࿰c;停机后就可以点击更换操作系统了

换系统

选镜像

• 更换完系统进行确认订单࿰c;接下来会跳转到管理后台࿰c;这时稍等会࿰c;服务器会进行启动。

4. 配置并登录宝塔

远程登录

• 这一步我们直接在网页上登录了࿰c;你也可以使用 xsHell 登录公网IP

初始化宝塔

命令：[root@CodeGuide ~]# bt default

配置安全组

• 宝塔的访问要配置 8888 端口࿰c;否则是不能访问到的࿰c;这个在服务器的安全组中开放即可。
• 这里我们为了方便就直接开启全部的了࿰c;如果你是实际使用࿰c;可不能这样操作࿰c;否则很不安全！

登录宝塔

• 地址：http://39.96.73.xxx:8888/ - 换成你的地址
• 账号：用户名和密码已经在控制台打印࿰c;你可以复制自己的࿰c;登录宝塔后可以修改这个默认的密码

5. 安装阿帕奇和FTP

接下来我们在宝塔中安装一个阿帕奇服务器和FTP࿰c;这样就可以部署和访问我们的静态博客了࿰c;也就是一个html࿰c;如下:

安装 Apache

• @R_996_9382@会自动的执行一些命令࿰c;这个你不用管࿰c;只要默默看着就行了。

安装 FTP

• 安装 FTP 主要是为了通过本地可以把文件传送到服务器上࿰c;比如你的一个静态博客是 html࿰c;就可以通过 FTP 传到服务器上。

6. 网站配置

安装了阿帕奇和FTP我们就可以简单的配置一个站点了࿰c;有了这个站点就可以访问到我们自己的博客！

创建站点

• 创建站点的适合如果你还没有申请域名࿰c;或者域名还没有备案呢࿰c;那么就可以直接把公网IP填写进来。

访问站点

• 地址：http://39.96.73.167/　在访问的时候࿰c;你换成自己的ＩＰ即可

7. 网站内容

• 在宝塔的文件里࿰c;你可以选择第6步骤中添加的站点࿰c;在里面找到你的文件࿰c;做一些修改动作。这个时候在访问网站࿰c;@R_498_10585@内容已经是你新的内容了。

8. 域名配置

如果你有域名并已经备案好了࿰c;那么在创建站点的时候就可以直接把域名配置上࿰c;在访问你的网站的时候就可以通过域名访问了。

• 添加域名：这个里面小傅哥配置的是已经申请好并备案了的域名࿰c;你配置成你的就可以。记得配置好域名后࿰c;需要在你的域名服务里࿰c;通过A记录把服务器IP映射配置上去。
• FTP 配置：为了更加方便的上传你的文件࿰c;你可以把FTP打开࿰c;这样就可以通过FTP传输配置了。
• 访问地址：http://blog.itedus.cn - 由于域名不是在阿里云࿰c;可能http会监测为未备案࿰c;拒绝访问

9. SSL 配置

关于 SSL 的申请可以有很多免费网站提供࿰c;也可以在宝塔中申请࿰c;如果你是用阿里云服务࿰c;可以免费申请20个 SSL 证书࿰c;另外如果你的域名和服务都是在阿里云࿰c;那么在申请 SSL 可以直接走 DNS 认证࿰c;否则你需要把 DNS 信息手动配置到你自己的域名上去。放心这个在申请的时候都有提示࿰c;按照说明配置即可

下载证书

因为我们需要把 ssl 配置到宝塔上࿰c;所以这里需要把 SSL 下载下来࿰c;选择 Apache 格式下载。

配置证书

• 配置后点击保存即可࿰c;另外需要强制开启 httpS࿰c;否则你的网站访问 http 也能继续访问࿰c;就没有意义了。
• 现在你就可以通过 https࿰c;访问自己的博客或者网站了࿰c;是不看上去高大上了不少！

10. 其他说明

可能你还希望配置 jdk、tomcat࿰c;没关系࿰c;在宝塔里你都可以安装࿰c;也可以安装 mysql࿰c;有了这些入门的内容࿰c;剩下的就可以搜索一些通用配置的内容࿰c;也可以在阿里云中搜索。

五、嗯࿰c;总结一下

• 讲道理࿰c;我希望你遇到我࿰c;因为总有一些热情于技术的男人࿰c;会带着你搞点啥࿰c;搞着搞着你的薪资就上去了！
• 做技术号主的两年多࿰c;我把自己定位成37开࿰c;70%开源贡献社区࿰c;沉淀、分享࿰c;帮助有需要的技术同号。30%做付费内容用于支撑起可以继续完成70%的事情！
• 我见过自己的粉丝伙伴应届生拿到总包50的࿰c;也见过清北出国的࿰c;也有高考失利又不断学习考证拿下研究生学位进入大厂管培职位的。但无一例外࿰c;这些人从不会给自己设限࿰c;甚至是非常自律࿰c;很难看到这样的伙伴会去胡扯、瞎聊、当别人的分母࿰c;而是不断的“折腾”࿰c;折腾学习、折腾感兴趣的事情、折腾自己的爱好࿰c;而高薪职位也只不过是过路的风景。
• 趁着年轻：承遇朝霞、年少正恰࿰c;整装戎马、刻印风华！