对于 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 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

终端会输出

效果预览

对于 request 和 response 你是怎么开发调试的?

怎么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 你是怎么和前端联调的呢?

源码

gitee.com/wpjscc/penetrate
github.com/wpjscc/penetrate

本作品采用《CC 协议》,转载必须注明作者和本文链接
Make everything simple instead of making difficulties as simple as possible
《L01 基础入门》
我们将带你从零开发一个项目并部署到线上,本课程教授 Web 开发中专业、实用的技能,如 Git 工作流、Laravel Mix 前端工作流等。
《L04 微信小程序从零到发布》
从小程序个人账户申请开始,带你一步步进行开发一个微信小程序,直到提交微信控制台上线发布。
讨论数量: 3

laravel/telescope 用起来!

2年前 评论
jcc123 (楼主) 2年前

postman

2年前 评论
jcc123 (楼主) 2年前

apizza

2年前 评论
jcc123 (楼主) 2年前

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!