对于 request 和 response 你是怎么和前端联调的?

对于前端来说,只需F12 打开,request和response一目了然。

这里模拟一下前后端联调时的情景

前端:我请求了

后端: 前端请求了啥,返回了啥?

此时后端心中有一个大大的问号。

后端: 我打个日志,你重新请求下。

\Log::info($request->all());

然后

git add .
git commit -m'log request'
git push

Login Server

git pull
tail -f xxxxx.log

后端:咋感觉有点麻烦呢

于是,找到了一把利器

composer require itsgoingd/clockwork

visit http://yourdomain.com/clockwork/app#

会心一笑

后端:前端你请求吧

前端:我请求了,你看下response不对。

后端 扒拉半天itsgoingd/clockwork

后端:该死,怎么看不到 response

难道又要

 \Log::info($response);
 git add .
此处省略一万字~

long long ago... 相信大家都经历过这样的情况。

有没有这样一把调试利器,可以像前端一样requestresponse一目了然。

这样双端信息就对等了

前端:我请求了

后端: 我看到了,请求少了一个参数

前端: 我又请求了,返回数据了,但数据有点不对

后端:看到了,稍等,我改下

前端:我又请求了

后端:看到了

前端:done

后端:done

基于 swoole 我实现了一个简单的requestresponse,也可以作为内网穿透使用。

安装swoole

pecl install swoole

下载代码 代码很潦草,请关注功能~

运行

进入到解压文件夹

配置

$local_ip = '127.0.0.1';//可以监听任何ip,也可以是外网域名,这里默认本地
$local_port = 10080;//只需换成你自己的端口即可

运行

php proxy_client.php

终端会输出

效果预览

1

怎么80端口访问?

server {
    listen 80;
    server_name  yourdomain.com;//你自己的域名

    location / {
      proxy_pass http://xxxx:9503;//填写终端输出的域名
      proxy_set_header    Host             $host;#保留代理之前的host
      proxy_set_header    X-Real-IP        $remote_addr;#保留代理之前的真实客户端ip
      proxy_set_header    X-Forwarded-For  $proxy_add_x_forwarded_for;
      proxy_set_header    HTTP_X_FORWARDED_FOR $remote_addr;#在多级代理的情况下,记录每次代理之前的客户端真实ip
#      proxy_redirect      default;#指定修改被代理服务器返回的响应头中的location头域跟refresh头域数值

    }
    access_log /var/log/nginx/yourdomain.access.log;
    error_log  /var/log/nginx/yourdomain.error.log;
}

其他

  • 我之前自己用的比较多的是 yapi,可以和yapi配合着使用,效果会更加理想。

  • 这只是我平常用的比较多的模式,没有尽善尽美的,只有最适合的,request 和 response 你是怎么和前端联调的呢?

源码

https://gitee.com/wpjscc/penetrate https://github.com/wpjscc/penetrate

Posted in http || 后端 || on Aug 31, 2021


Octobercms交流群