使用frp搭建微信开发环境
这两天准备换 PHP 搞微信开发，用 ngrok 转发时设置微信接口永远失败。。。搞不懂什么原因。
刚好看了篇大神的文章内网穿透：在公网访问你家的 NAS，介绍了 frp 这个神器，搜索了下 微信+frp，已经有不少人在用这种技术了，试了下感觉非常好用，记录下来备忘。
1. 准备
- 阿里云轻量级服务器一台，系统
Ubuntu 16.04，IP 假设为1.2.3.4 - 已备案域名一个并指向
1.2.3.4，文章使用your-domain.com进行说明 - 域名新增一个 A记录：
wx.your-domain.com仍然指向阿里云服务器 IP1.2.3.4 - 本地
Win10系统，使用Homestead虚拟机, IP 为192.168.10.10，已安装Ubuntu 16.04
开始吧！
2. 服务端
2.1 配置 fprs
下载 frp_0.24.1_linux_amd64.tar.gz 并解压
wget https://github.com/fatedier/frp/releases/download/v0.24.1/frp_0.24.1_linux_amd64.tar.gz
tar zxvf frp_0.24.1_linux_amd64.tar.gz
cd frp_0.24.1_linux_amd64
# 看下都有啥
root@aliyun:~/frp_0.24.1_linux_amd64$ ll
total 19431
drwxrwxrwx 1 root root 4096 Feb 25 15:21 ./
drwxrwxrwx 1 root root 4096 Feb 25 14:15 ../
-rwxrwxrwx 1 root root 9589632 Feb 25 14:15 frpc*
-rwxrwxrwx 1 root root 6376 Feb 25 14:15 frpc_full.ini*
-rwxrwxrwx 1 root root 168 Feb 25 14:54 frpc.ini*
-rwxrwxrwx 1 root root 10276544 Feb 25 14:15 frps*
-rwxrwxrwx 1 root root 2199 Feb 25 14:15 frps_full.ini*
-rwxrwxrwx 1 root root 26 Feb 25 14:15 frps.ini*
-rwxrwxrwx 1 root root 11358 Feb 25 14:15 LICENSE*
编辑 frps.ini
[common]
bind_port = 7000
auth_token = your-token
vhost_http_port = 8080
vhost_https_port = 8443
[web]
type = http
custom_domains = wx.your-domain.com
启动
root@aliyun:~/frp_0.24.1_linux_amd64$ ./frps -c ./frps.ini
2019/02/25 15:39:16 [I] [service.go:124] frps tcp listen on 0.0.0.0:7000
2019/02/25 15:39:16 [I] [service.go:166] http service listen on 0.0.0.0:8080
2019/02/25 15:39:16 [I] [service.go:187] https service listen on 0.0.0.0:8443
2019/02/25 15:39:16 [I] [root.go:204] Start frps success
2.2 设置 nginx 反向代理
vi /etc/nginx/sites-available/wx.your-domain.com.conf
server {
listen 80;
server_name wx.your-domain.com;
location / {
# 8080 设置为 frps 的 vhost_http_port
proxy_pass http://localhost:8080;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header Host $host;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
}
sudo ln -s /etc/nginx/sites-available/wx.your-domain.com.conf /etc/nginx/sites-enabled/wx.your-domain.com.conf
sudo systemctl reload nginx
记得配置下阿里云服务器的防火墙，放开7000端口。。
3. 客户端
3.1 先做个测试
修改 win10 的 hosts:
192.168.10.10 wx.your-domain.com，验证下：
ping wx.your-domain.com
本地已经有 Laravel 项目存在，打开浏览器测试 wx.your-domain.com，浏览正常。
3.2 配置 frpc
先从服务器下载： scp [email protected]:/root/frp_0.24.1_linux_amd64.tar.gz .，比从 github 下载快多了。。。
解压并编辑 frpc.ini:
[common]
server_addr = 1.2.3.4
server_port = 7000
auto_token = your-token
[web]
type = http
local_ip = 127.0.0.1
local_port = 80
custom_domains = wx.your-domain.com
启动
vagrant@homestead:~/code/frp_0.24.1_linux_amd64$ ./frpc -c ./frpc.ini
2019/02/25 15:54:27 [I] [service.go:214] login to server success, get run id [dacdb8f2e391b0f7], server udp port [0]
2019/02/25 15:54:27 [I] [proxy_manager.go:137] [dacdb8f2e391b0f7] proxy added: [web]
2019/02/25 15:54:27 [I] [control.go:143] [web] start proxy success
3.3 验证
修改 win10 的 hosts，删除之前添加的那行 192.168.10.10 wx.your-domain.com，验证下：
ping wx.your-domain.com
没问题，打开浏览器测试 wx.your-domain.com，浏览正常。
3.4 微信接口配置信息
使用了 overtrue/laravel-wechat:~4.0，路由为 Route::any('/wechat', 'WeChatController@serve');，看下 WeChatController@serve方法：
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Log;
class WeChatController extends Controller
{
public function serve(){
app('debugbar')->disable();
Log::info('wechat request arrived.');
$app = app('wechat.official_account');
return $app->server->serve();
}
}
再到微信测试号修改接口配置信息:
URL: wx.your-domain.com/wechat
，总算配置成功了！
Reference
- 内网穿透：在公网访问你家的 NAS
- frp
- frp_0.24.1_linux_amd64.tar.gz
- 使用frp内网穿透实现微信本地调试
- 使用frp微信本地调试
- 部署FRP服务 实现内网穿透
- nginx + frp 实现内网穿透进行微信本地开发
