开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第1天，点击查看活动详情

模子

说到前端一般区分与服务端，总感觉离服务器似乎很远，即使 Node.js 扩展了 JavaScript 的边界后这种情况也并没有太大的改善，除去一部分会接触到基础设施建设或有 BFF 层开发需求的群体外，大体上“服务器”与“前端”鲜少有交集。于是这里提出问题，如果想扩展相关的技能，又没有业务资源做支持，该怎么处理呢？解决这个问题便是本文的主旨。所谓服务器，无非是一台可以像外提供服务的电脑，理论上说只要把你现在访问网页用的设备向公网提供某个可以访问的端口，并提供服务那就是一台合格的服务器了。

比对

理所当然，获得一台电脑无非两种途径，租一个，买一个。服务器也是如此，租一台个人用的，不怎么需要性能的云服务器成本不高，国内各种云供应商租一年新人活动价大概100～200元，国外供应商的大概每个月3～5刀吧，国内的优势在于访问速度快，连接稳定，缺点是带宽和续费实在是太贵了，总是去蹭新人优惠需要频繁迁移，挂网站的话备案也需要维护，总之以低成本角度来看，不太划算，国外？懂得都懂。买一个的话，比如电脑，成本从几百到几千都有，如果想玩的话，比起树莓派类的，个人更推荐无风扇工控主机，就是那种物联网用的nuc主机，性能一般般但是便宜而且有x86平台的，相比基于arm的树莓派会更接近生产环境一些，再加上现在树莓派也着实不便宜。成本通常在 500～1000 个人玩玩不是非常重的应用足够了，而且二十四小时开着也费不了多少电，无风扇也很安静。剩下就是传统的电脑了，出门左转显卡吧或者图拉丁吧，想要什么价位的装机单都有。剩下就是，比如不用的手机刷成linux这类操作，成本也不高。

穿透服务

好了，我们现在有一台电脑了，那么怎么让它可以在公网访问呢？ 1、首先是DHCP动态解析，找自家的宽带运营商要个公网 ip 然后动态解析到某个域名上，这个方案体验最好，最省钱，但限制也最多，不一定给公网 ip 而且根据区域不同，有非常多的端口不能用，比如 80 443 22 这类。 2、找中转服务，自建frp之类的服务，需要云服务器，变成先有鸡还是先有蛋的问题了。 3、第三方中转服务，花生壳，frp服务提供商，natapp，cpolar，有免费通道，不过限制很多，即使收费限制也不少，优势在于链接稳定，价格大概和新人优惠差不多。 4、Tailscale 之类的 p2p 组网，更像是虚拟网络构筑，访问需要客户端，不是很方便。 4、cloudflare tunnel 这个应该归类为第三类但它现在是免费的，所以单独列出来，唯一的遗憾是节点在国外，连结稳定性有待商权，但限制少。

cloudflare tunnel 的使用

cloudflare 一个免费 cdn 供应商，大多数节点在国外，不做特殊处理可能是减速 cdn 但是免费。tunnel 则是 cloudflared 基于这些边缘节点提供的代理服务，支持端对端加密，泛域名解析，那些懂得都懂的影响，在这里会有所缓解虽然不多，但是免费，免费的同时限制少，对比上面第三类的免费服务，通常体验会更好，使用方式也差不多（替换容易），对于个人用户，不是生产任务的话基于这个可谓是再合适不过了，下面简单介绍下使用。

cloudflare tunnel 的创建有两种概括起来

第一种

到 cloudflare 的零信任控制台 Access>Tunnels 点击 "Create a tunnel"，按提示创建
配置 Public Hostname 进入配置界面，选择Public Hostname，点击 "Add a public hostname" 按钮，添加一个子域名，并按提示配置本地服务相关信息。
根据控制台给的 tunnel 详细信息在本地服务对应的机器上跑起来 cloudflared 服务。

实际跑起来的服务会根据参数载入具体的配置信息，不怎么需要关心本地的配置，全程有引导算是比较省心。

第二种

直接去下载 cloudflared 服务:github.com/cloudflare/…

wget https://github.com/cloudflare/cloudflared/releases/download/2022.9.1/cloudflared-linux-amd64

安装并登陆

# 会提供也个网页做登陆验证
./cloudflared-linux-amd64 login

# 注册为服务(可选)
./cloudflared-linux-amd64 service install

创建 tunnel

cloudflared tunnel create <name>

本地配置

# 进入配置所在文件夹 
cd ~/.cloudflared/
# 这时里面会有一个证书和一个 xxxx.json 这里的 xxx 为通道的标识符
# 没有则创建
vim config.yml

# Tip: 如果注册为服务则需要检查服务读取的配置文件位置，建议软链过去 像这样
ln -s ~/.cloudflared/config /etc/cloudflared/config.yml

# TIP: 检查服务配置
systemctl status cloudflared
# 检查 “Loaded” 项中的 service 文件
# 检查 “ExecStart” 中指定的 config 文件

写入如下信息 xxxx 与上面的json对应

tunnel: xxxx
credentials-file: /root/.cloudflared/xxxx.json 

ingress:
		# 自己的域名
    - hostname: <hostname> 
		# 需要代理的本地服务的信息
      service: http://0.0.0.0:80

		# 可以配置多个
    - hostname: <hostname> 
      service: http://0.0.0.0:8081

    - service: http_status:404

在 cloudflare 添加 CNAME 解析至 xxxx.cfargotunnel.com
启动

# 如果注册过服务
systemctl start cloudflared
# 查看运行状态
journalctl -u cloudflared -f
# 开机启动
systemctl enable cloudflared

# 如果没有
./cloudflared-linux-amd64 tunnel run

流程大概这样，我不太清楚如果域名通过别的平台解析过去可不可以，感觉大概率不行。
其次，为了改善cdn的访问情况，cloudflare 可以指定香港的节点，不知道对于这个会不会有效，以后也许会折腾试试。然后有几个小点，cloudflared 默认启动方式会自动更新，可能不太稳定可以通过带 --no-autoupdate 启动关闭自动更新。连不上检查下dns服务根据错误提示，下面的参数可以改善网络连接状况，虽然实际中我没太感觉出来。

# 增大 套节字 的缓存大小
sysctl -w net.core.rmem_max=2500000 
# 允许一种特殊的ping实现 
sysctl -w net.ipv4.ping_group_range='0 1000'

总结

这大概就是我针对，标题问题的解答了，概括来说就是搞个低成本电脑然后搞内网穿透，因为服务器是自己的，所以不用担心续费，电费也微乎其微，就有很多的玩具可以部署，比如，博客，笔记本，网盘，nas，rssHub，爬虫，各种bot，n8n之类的。如果有比较重的需求，还可以暴露网页shell或ssh服务，结合wakeOnLane对主力用的电脑，搞远程开机。即使不搞这些也可以，单纯的练习linux的使用，熟悉运维部署，以及...网络（比如拿去做旁路由）。虽然感觉和前端主业好像没啥直接关联，但是可以有效扩充知识边界，并解决实际问题，方便生产生活。顺便如果谁有更合适的穿透服务或方法可以推荐给我，基于中转毕竟还是比较慢。

前端如何低成本的折腾服务器

模子

比对

穿透服务

cloudflare tunnel 的使用

总结