Appearance
frp
frp 是一个专注于内网穿透的高性能的反向代理应用,支持 TCP、UDP、HTTP、HTTPS 等多种协议。可以将内网服务以安全、便捷的方式通过具有公网 IP 节点的中转暴露到公网。
下面我们演示使用域名 live.houdunren.com 访问我们的本地前端项目。
软件下载
访问 fatedier/frp 下载你系统的软件,因为我使用的服务器是 linux,开发电脑是 Mac 所以我要下载两个系统的软件。
- 苹果电脑:frp_0.44.0_darwin_arm64.tar.gz
- Linux 服务器 : frp_0.44.0_linux_amd64.tar.gz
然后解压两个压缩包
服务器FRP
下面对 Linux 服务器的 frp 进行设置
配置文件
修改 linux/fps.ini 配置文件
- bind_port 为 mac 客户端通信端口
- vhost_http_port 域名访问 frp 端口
[common]
bind_port = 7000
vhost_http_port = 8080
然后将整个文件夹上传到服务器并改名为 /www/frp 目录
端口放行
下面将 8080 与 7000 端口放行
进程管理
服务器安装 Supervisor管理器,用于定义守护进程
然后添加frp守护进程
并保证进行成功
网站设置
下面在宝塔面板中设置网站
添加站点
首先添加个新站点并绑定域名 live.houdunren.com
SSL
然后设置站点的SSL
反向代理
然后设置Nginx 反向代理
客户端
下面来配置客户端,我电脑是 m1苹果系统所以要下载 frp_0.44.0_darwin_arm64
配置文件
解包后修改 frpc.ini 文件
- server_addr:Linux 服务器 IP地址
- server_port:Linux服务器frps.ini 定义的 bind_port 端口
- local_port:本地项目端口,比如你 Vue 前端项目的端口3000
- custom_domains:服务器定义的域名
[common]
server_addr = 47.98.119.88
server_port = 7000
[web]
type = http
local_port = 3000
custom_domains = live.houdunren.com
运行
下面使用终端,进入解包后的 frp_0.44.0_darwin_arm64 目录
添加 frpc 可执行权限
chmod +x frpc
运行frp 客户端
./frpc -c ./frpc.ini
现在就可以使用 live.houdunren.com 访问到本地项目了
效率提升
本地会有多个项目,我们可以将过程简化。
首先将 frpc 命令复制到 /code/frpc,并修改 ~/.zshrc 定义以下内容
# frpc
alias frpc="~/code/soft/frp/frpc -c ./frpc.ini"
然后终端重新加载 zshrc 配置文件
source ~/.zshrc
在任意项目中添加 frpc.ini 配置文件,然后执行 frpc 命令就可以运行 frp 了。