huolalatech / page-spy-web Goto Github PK
View Code? Open in Web Editor NEWDebug remotely and easily like chrome devtools.
Home Page: https://www.pagespy.org
License: MIT License
Debug remotely and easily like chrome devtools.
Home Page: https://www.pagespy.org
License: MIT License
大部分的bug可能是线上运行时发生的,为了能偷偷调试用户页面, 建议增加隐藏页面上悬浮的图标的配置。另外为了防止信息泄露,房间列表增加账号密码登录功能
增加账号管理及权限
No response
No response
目前监控系统包含了以下内容
这些内容无法部分关闭, 但是在生产交付时, 并不是所有用户都愿意暴露这些数据, 可能有些不在意输出, 但是在意网络, 或者只在意缓存, 希望这些可以由开发者配置.
不止是提供初始化开启或者关闭这些功能, 还需要在运行时配置这些东西的开启或者关闭.
No response
No response
base: buildDoc ? '/page-spy-web/' : '/'
这个base路径能不能作为配置项,不是写死'/'
No response
any
No response
⇨ http server started on [::]:6752
希望能像vue等启动地址更友好些,起码可以terminal下直接点击打开
如
App running at:
docker 运行服务后,按“接入SDK”指引操作后,没有查询到房间数据?
html 代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<script crossorgin="anonymous" src="http://10.88.122.4:6752/page-spy/index.min.js"></script>
<script>
new PageSpy()
</script>
</head>
<body>
<div id="app"></div>
<script type="module" src="/src/main.ts"></script>
</body>
</html>
我这里服务端的协议是https
但是SDK在http
希望SDK配置api的时候可以同时设定protocol,而不是直接从document.currentScript?.baseURI拿
No response
System:
OS: macOS 12.7.1
CPU: (8) x64 Intel(R) Core(TM) i5-1038NG7 CPU @ 2.00GHz
Memory: 268.21 MB / 16.00 GB
Shell: 5.8.1 - /bin/zsh
Binaries:
Node: 18.16.1 - /usr/local/bin/node
Yarn: 1.22.10 - /usr/local/bin/yarn
npm: 9.5.1 - /usr/local/bin/npm
No response
Uniapp的APP模式 如何引入?
No response
uniapp app-plus webview
No response
建议置顶一个 issue 在里面更新二维码(issue 支持编辑),避免需要改代码
刚试了一个uniapp项目,在房间页面网页顶部显示 Please enable JavaScript to continue.
No response
win10 本机 chrome最新版
No response
alert是同步进程, 且需要手动去点确认. 其实是没必要的. 因为这里提示的目标只是通知, 而不是一个需要反馈的内容. 现在是增加了交互负担.
https://github.com/HuolalaTech/page-spy/blob/main/src/component/content.ts#L61
我看了sdk源码, 作为sdk的目的, 并没有引入任何 ui lib. 所以也只能是 alert. 那么能否修改个交互? 比如点击copy, 只是在copy旁边显示下复制成功即可?
No response
No response
服务器只用来建立链接,流量走 webrtc
Unsupport URL capacitor://localhost, web app running on capacitorjs
No response
System: iPhone/17.1.1
Browser: Unknown/Unknown
User Agent: Mozilla/5.0 (iPhone; CPU iPhone OS 17_1_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Mobile/15E148
Page Spy: 1.4.2
No response
房间一多就容易出现:客户端-查看设备信息没反应
No response
Android10 , Google Browser
No response
I just want to display the version of the page-spy-api
tool, but running page-spy-api --version
starts the PageSpy server directly.
In general, command-line tools commonly provide the following options:
--version
--help
No response
No response
移动端h5为单页应用,在钉钉或者飞书中,新开页面,单页应用,Device ID会变化
No response
ios,16.2
No response
当我在表单填写完内容后,在页面刷新视图,并不会看到表单内容;
Picker组件的弹出内容可以正常显示
No response
浏览器: Chrome
版本: 95.0.4638.50
No response
No response
Chrome 120.0.6099.109(正式版本) (x86_64)
No response
在原文中是'Storage', 看了下火狐的控制台中文翻译是存储. 实际上, '缓存'是'存储'的一项功能, 建议保持同步.
No response
1
No response
同样也是用于远程调试,不过是基于前端最熟悉的开发者工具实现的
在一些js效果中会显示大片空白 比如swiper
No response
OS: macOS 13.6
Browser: Firefox 117.0
No response
项目中 devtools 相关页面存在classnames
包的引用,但这个包并不在package.json
中声明,取而代之的是clsx
,推测可能是由于之前从classnames
包迁移到了clsx
包而遗留的问题。
当前是使用类似于uniqId的前四位来定位一个用户,实际上这个定位参数对用户可能没有意义。能否在初始化时增加一个自定义参数,比如extraId, 开发者可以填userId,email, username之类。这样当用户反馈时,我们只需要向用户提供账号信息我们就可以直连用户端。
目前产品中,想小范围的把这个插件放到线上产品作为用户侧跟踪问题的渠道,由用户通过按钮等入口主动操作。
谢谢,这个项目功能很牛
本地部署,接入sdk后,进入调试房间,看不到预期的Local Storage信息
npm install -g @huolala-tech/page-spy-api
page-spy-api
index.html
文件,代码如下<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<script
crossorigin="anonymous"
src="http://localhost:6752/page-spy/index.min.js"
></script>
</head>
<body>
hello world
<script type="module">
window.$pageSpy = new PageSpy();
window.localStorage.setItem("key", "hello world");
</script>
</body>
</html>
Device ID: 7d22
System: Mac/10.15.7
Browser: Chrome/120.0.0.0
Project: default
⇨ http server started on [::]:6752
INFO[0000] | 200 | 2.415544ms | ::1 | GET | /api/v1/ws/room/join?address=78a62594-c18c-4927-95d9-e02057ec4687.local&name=client%3A3u2pewxu8c7&userId=Client | - _module=middleware _request_id=be9018ed-a0b2-4d9e-873f-992aa46a9616
INFO[0002] | 200 | 1.0725ms | ::1 | GET | /api/v1/ws/room/join?address=78a62594-c18c-4927-95d9-e02057ec4687.local&userId=Debugger | - _module=middleware _request_id=22426541-4a1c-4fd6-a7d8-e1b55adceb56
INFO[0004] | 200 | 716.342µs | ::1 | GET | /api/v1/ws/room/join?address=78a62594-c18c-4927-95d9-e02057ec4687.local&userId=Debugger | - _module=middleware _request_id=e7b2af68-3476-47ee-b469-63f208c0fd74
INFO[0009] 创建local房间 room=85d7e486-35d4-4718-89e3-fcf922592525.local
INFO[0009] start 房间 room=85d7e486-35d4-4718-89e3-fcf922592525.local
INFO[0009] create group default room module=join
INFO[0009] | 200 | 527.058µs | ::1 | POST | /api/v1/room/create?name=Mac%2F10.15.7+Chrome%2F120.0.0.0&group=default&title= | - _module=middleware _request_id=bc8d69c9-7666-4e63-a80b-3a8ef47d92a4
INFO[0009] 创建remote房间 85d7e486-35d4-4718-89e3-fcf922592525.local local_room=85d7e486-35d4-4718-89e3-fcf922592525.local remote_room=043df95d-3041-45d2-97f3-454eb215b831.local
INFO[0009] start remote房间 85d7e486-35d4-4718-89e3-fcf922592525.local local_room=85d7e486-35d4-4718-89e3-fcf922592525.local remote_room=043df95d-3041-45d2-97f3-454eb215b831.local
INFO[0009] connection 043df95d-3041-45d2-97f3-454eb215b831.local join 房间 room=85d7e486-35d4-4718-89e3-fcf922592525.local
INFO[0012] | 200 | 4.239356ms | ::1 | GET | /devtools?version=Mac/10.15.7%20Chrome/120.0.0.0&address=78a62594-c18c-4927-95d9-e02057ec4687.local | - _module=middleware _request_id=8d05143c-7e9b-4244-ab4f-58359cc3a385
INFO[0012] | 200 | 979.847µs | ::1 | GET | /api/v1/ws/room/join?address=78a62594-c18c-4927-95d9-e02057ec4687.local&userId=Debugger | - _module=middleware _request_id=5798554c-28b3-407d-8117-7a322be7eec3
INFO[0018] | 200 | 701.274µs | ::1 | GET | /api/v1/room/list | - _module=middleware _request_id=5e1213df-bebc-4e3f-ba17-13a1461346a0
INFO[0019] | 200 | 86.105µs | ::1 | GET | /room-list | - _module=middleware _request_id=9a818ae7-eb87-41f2-a862-4624d4bd8ccb
INFO[0019] | 200 | 541.821µs | ::1 | GET | /api/v1/room/list | - _module=middleware _request_id=6322a43d-3959-4f02-99ff-aecf1b056f7a
INFO[0020] | 200 | 103.775µs | ::1 | GET | /devtools?version=Mac/10.15.7%20Chrome/120.0.0.0&address=85d7e486-35d4-4718-89e3-fcf922592525.local | - _module=middleware _request_id=a31b34e1-ce1d-4ab6-95b7-42b7c1888aea
INFO[0021] 创建remote房间 85d7e486-35d4-4718-89e3-fcf922592525.local local_room=85d7e486-35d4-4718-89e3-fcf922592525.local remote_room=efa23595-2395-48d7-a557-6f02a67c6114.local
INFO[0021] start remote房间 85d7e486-35d4-4718-89e3-fcf922592525.local local_room=85d7e486-35d4-4718-89e3-fcf922592525.local remote_room=efa23595-2395-48d7-a557-6f02a67c6114.local
INFO[0021] connection efa23595-2395-48d7-a557-6f02a67c6114.local join 房间 room=85d7e486-35d4-4718-89e3-fcf922592525.local
目前通过docker镜像+阿里云slb负载的方式部署,如果slb有负载多个容器实例,那么用户连接到room后,运维人员通过slb访问room list,有很大的概率是找不到这个用户的,应该是backend没有针对多实例负载均衡的场景进行设计。
能够支持多实例负载均衡的场景
No response
No response
Unexpected semicolons.
No response
all
No response
[Node 部署]
运行page-spy-api,起来的本地服务是http的,能通过配置改成https吗
能通过配置改成https吗
No response
No response
在Taro项目中图片路径404时会出现 TypeError: Cannot read properties of undefined (reading 'message')
@tarojs/components
的 <Image />
组件,填入一个不存在的图片路径(使图片请求报错)taro: 3.6.20
system: window10 22H2
browser: Microsoft Edge 版本 120.0.2210.77 (正式版本) (64 位)
// paste the log text here
index.min.js:1 Uncaught TypeError: Cannot read properties of undefined (reading 'message')
at index.min.js:1:84012
at emitEvent (vendors-node_modules_taro_h5_prebundle_chunk-4WTM3NLC_js._chunkhash_.js:7607:9)
at Object.emit (vendors-node_modules_taro_h5_prebundle_chunk-4WTM3NLC_js._chunkhash_.js:7596:20)
at push../node_modules/.taro/h5/prebundle/chunk-4WTM3NLC.js.proxyCustomElement.src.imageOnError (vendors-node_modules_taro_h5_prebundle_chunk-4WTM3NLC_js._chunkhash_.js:23010:22)
新建房间,点击提交无反应,走的是房间列表接口
npm install -g @huolala-tech/page-spy-api
page-spy-api
点击房间列表-新建房间,选择浏览器等,点击提交按钮,没反应
mac 谷歌浏览器
控制台无报错
希望增加日志台时间显示,类似:【2023-01-01 12:00:00】xxxx
空
No response
No response
"页面"这个模块里展示的页面是真机呈现出来的样式吗?因为移动端有很多要兼容,不同设备上,样式会有差别,所以这个样式很重要,如果我调试了一个真机上的页面,但是呈现的元素和真机不一样,那样式这块就没有参考意义了。
No response
No response
Duplicated error messages.
No response
System:
OS: macOS 12.7.1
CPU: (8) x64 Intel(R) Core(TM) i5-1038NG7 CPU @ 2.00GHz
Memory: 1.39 GB / 16.00 GB
Shell: 5.8.1 - /bin/zsh
Binaries:
Node: 18.16.1 - /usr/local/bin/node
Yarn: 1.22.10 - /usr/local/bin/yarn
npm: 9.5.1 - /usr/local/bin/npm
No response
加入房间失败会没有间隔无限重试。
如果后端出现抖动,可能导致一直打挂。
可以添加失败重试间隔,500ms 1s 2s 4s 这样,每次失败都是前面时间翻倍。
No response
-
No response
🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟
🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟 🌟
如果您和您的公司或组织使用了 PageSpy ,非常感谢您的支持,欢迎留下公司名,您的回复将成为维护者、社区用户和观望者的信心来源。无关回复将会定期删除。
推荐回复格式:
- 公司或组织:(如果可以)
- 使用心得:
We appreciate you support if you or your organization is using PageSpy. You are welcome to leave replies about your organization here, which could became the confidence of maintiners, communication and undecided watchers.
Recommended reply format:
- Company or Organization: (if any)
- Usage Experience:
麻烦删除下 已找到解决办法了。
不知道有没有兴趣给SDK加个初始化参数隐藏左下角的logo
PageSpy的输出控制台的console不能打印带样式的
console.log(
%cSYSTEM LOG
,
"999999999999999999999999",
@Hybrid: env =
,
env
);
System:
iPhone/13.2.3
Browser:
Safari/13.0.3
User Agent:
Mozilla/5.0 (iPhone; CPU iPhone OS 13_2_3 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0.3 Mobile/15E148 Safari/604.1
No response
可以考虑增加debug级别日志捕捉吗
我通常使用debug来打印日志,所以迫切需要想支持下这个
或者是考虑下日志级别筛选,包括debug级别的
No response
我在Vercel部署这个项目page-spy,由于page-spy-api
是一个独立的后台服务,我尝试了一些方式在Vercel的启动时加入yarn start:server
,但我的Vercel或者page-spy-web中的配置似乎总是错误的,页面调用接口的结果是404
。
page-spy在这个issue关闭前会被保留。
你们的团队是否有时间添加一键部署到Vercel(可能只需要几行代码),这个扩展可能有助于page-spy-web的快速传播和应用。
谢谢!
No response
No response
目前app端的webview内使用,实测无论是安卓还是ios,App切到后台30s后,调试端就断连了,即使此时App切回前台也无法继续调试,而因为sdk不允许重复初始化,只能刷新整个页面。因为没有断连监控,即使想主动刷新也不好做。
希望能在客户端提供断连时的监控回调以及主动重连方法,使得在上述异常状态下客户端能够自行恢复调试
No response
No response
使用ios手机 支付宝/钉钉 进入应用均显示 Browser: Unknown/Unknown 无法获取当前手机的浏览器种类以及版本
No response
iPhone/16.1.2
Browser:
Unknown/Unknown
No response
在 vue-class-component
项目中的 index.html
文件中新增以下配置,
<script crossorigin="anonymous" src="http://127.0.0.1:6752/page-spy/index.min.js"></script>
<script>
window.$pageSpy = new PageSpy();
</script>
但是当在本地使用 page-spy-api
启动后,在 http://127.0.0.1:6752/room-list
中房间列表为空
No response
电脑系统:macOS 13.0.1
浏览器版本:Opera 105.0.4970.21
page-spy-api
控制台并没有报错,正常请求 /api/v1/room/list
,日志如下:
INFO[0299] | 200 | 772.501µs | 127.0.0.1 | GET | /api/v1/room/list | - _module=middleware _request_id=ab2ea807-fe87-491f-9c76-a33a4660ffe5
INFO[0304] | 200 | 611.851µs | 127.0.0.1 | GET | /api/v1/room/list | - _module=middleware _request_id=5259308d-8b2a-45fa-ac6f-f96d9726e15b
INFO[0309] | 200 | 425.739µs | 127.0.0.1 | GET | /api/v1/room/list | - _module=middleware _request_id=17647d31-cc90-49ba-9c2a-6df452cb58de
INFO[0314] | 200 | 385.25µs | 127.0.0.1 | GET | /api/v1/room/list | - _module=middleware _request_id=5bd0fdb9-0366-424f-8210-d2b0f682da71
INFO[0319] | 200 | 605.52µs | 127.0.0.1 | GET | /api/v1/room/list | - _module=middleware _request_id=24cd2a80-fffd-44f2-b0a8-0a3f5a6562b7
INFO[0324] | 200 | 5.870929ms | 127.0.0.1 | GET | /api/v1/room/list | - _module=middleware _request_id=b1f59753-7f1a-410a-9455-07df89f81c96
INFO[0329] | 200 | 615.302µs | 127.0.0.1 | GET | /api/v1/room/list | - _module=middleware _request_id=ec3149b6-b946-4f6a-9f67-6058fc52ac5f
INFO[0334] | 200 | 640.223µs | 127.0.0.1 | GET | /api/v1/room/list | - _module=middleware _request_id=adfebe69-9926-4299-93ae-0567838b907c
INFO[0339] | 200 | 640.333µs | 127.0.0.1 | GET | /api/v1/room/list | - _module=middleware _request_id=2621dcaf-480d-4dc6-a350-44adb71ca691
INFO[0344] | 200 | 468.144µs | 127.0.0.1 | GET | /api/v1/room/list | - _module=middleware _request_id=4eedaec7-aac5-47a9-8204-abca7900b074
INFO[0349] | 200 | 615.904µs | 127.0.0.1 | GET | /api/v1/room/list | - _module=middleware _request_id=9e31b0e2-bd7a-4174-ba54-306bbb542e3f
INFO[0354] | 200 | 563.644µs | 127.0.0.1 | GET | /api/v1/room/list | - _module=middleware _request_id=563f68a3-58d1-412c-a66b-fe494dad06e9
INFO[0359] | 200 | 569.87µs | 127.0.0.1 | GET | /api/v1/room/list | - _module=middleware _request_id=b88a22c7-5096-4863-acfa-89ce7ca304a5
当从 Storage 面板切换到其他面板时,控制台会报 can't perform a React state update on an unmounted component
看文档 Menu 组件会采用二次渲染,猜测是由于这个原因导致的
我在本地用 Tabs 组件替换后没有这个问题
when it comes a new message, the scroll doesn't move.
add a button to toggle auto scrolling
No response
No response
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.