chrome调试h5移动端

chrome调试(window+android)

需要条件:1.安卓开发人员需要对你页面调试得webview添加setWebContentsDebuggingEnabled得静态方法。

2.windows电脑可以爬~梯子或者安装chrome-inspect离线开发者工具包

梯~子工具:https://cp.greennode.info

chrome-inspect离线开发者工具包:http://www.cnblogs.com/slmk/p/7591126.html

3.手机连接电脑,开发者选项,打开usb调试,电脑正常安装手机驱动。

做好提前准备后,在手机chrome中访问网页或者打开开启setWebContentsDebuggingEnabledchrome方法得webview,chrome浏览器访问chrome://inspect/#devices

点击inspect,进入chrome调试界面出现空白(需要 梯~子)

chrome调试(window+iphone)

原文:https://github.com/RemoteDebug/remotedebug-ios-webkit-adapter

安装依赖项

1、 .NET Framework 4.5 及以上版本

2、powershell 5.1及以上版本( 注:可通过输入  $PSVersionTable 查看当前 powershell 版本 )

3、可正常访问  https://raw.githubusercontent.com/lukesampson/scoop/master/bin/install.ps1 此网站(需要~梯子)

4、安装  iTunes

5、安装  ios-webkit-debug-proxy ,安装前确保有  

1)powershell5.1+,

2).net Framework4.5+、

3)可访问 https://raw.githubusercontent.com/lukesampson/scoop/master/bin/install.ps1

根据文档,在windows下,首先需要安装scoop,而安装scoop需要电脑里有powershell。win10一般自带。

5.1 安装scoop(一个安装工具)

set-executionpolicy unrestricted -s cu #修改执行策略,选择是
iex (new-object net.webclient).downloadstring('https://get.scoop.sh')  #安装scoop

5.2 通过scoop安装ios_webkit_debug_proxy

scoop bucket add extras // 安装 bucket
scoop install ios-webkit-debug-proxy // 安装 ios-webkit-debug-proxy

报错如下

Couldn't find manifest for 'ios-webkit-debug-proxy'

注意:会有Couldn't find manifest for 'ios-webkit-debug-proxy'错误,主要原因还是scoop bucket add extras安装不太顺利

卸载 bucket 后重新安装

PS C:\Windows\system32> scoop bucket rm extras
PS C:\Windows\system32> scoop bucket add extras
Checking repo... ok
The extras bucket was added successfully.

再次执行:scoop install ios-webkit-debug-proxy

建议是否安装成功:scoop list

PS C:\Windows\system32> scoop install ios-webkit-debug-proxy
Installing 'ios-webkit-debug-proxy' (1.8.8) [64bit]
ios-webkit-debug-proxy-1.8.8-win64-bin.zip (3.5 MB) [=========================================================] 100%
Checking hash of ios-webkit-debug-proxy-1.8.8-win64-bin.zip ... ok.
Extracting ios-webkit-debug-proxy-1.8.8-win64-bin.zip ... done.
Linking ~\scoop\apps\ios-webkit-debug-proxy\current => ~\scoop\apps\ios-webkit-debug-proxy\1.8.8
Creating shim for 'ios_webkit_debug_proxy'.
'ios-webkit-debug-proxy' (1.8.8) was installed successfully!
PS C:\Windows\system32> scoop list
Installed apps:ios-webkit-debug-proxy 1.8.8 [extras]

6、连接测试~~连接方式(原理一样,启动代理端口)

#安装最新版本的 remotedebug-ios-webkit-adapter

npm install -g vs-libimobile
npm install remotedebug-ios-webkit-adapter -g

#在Safari中启用远程调试
为了显示您的iOS设备,您需要启用启用开发者模式进行调试。

Iphone => 设置 => Safari 浏览器 => 高级 => web检查器 => 启用

#手机连接电脑的itunes 或者 爱思助手(个人使用的是后者)

#打开命令行工具 ,运行以下命令,在PC端本地9000端口开启对苹果手机webview的监听(个人理解,不对请指正)

remotedebug_ios_webkit_adapter --port=9000

#打开chrome调试工具地址 :  chrome://inspect/#devices  ,点击Configure...  (打开网址的首页就能看到,我不截图了),在打开的弹窗中添加如下地址:

localhost:9000

然后点击Done,至此,你可以愉快的调试IOS端的webview了(亲测有效)。

真实效果如下图:

iphone+mac调试

需要条件:1.调试app内嵌webview必须是ios铜须使用xcode打的包,线上得不行

第一步:打开苹果手机 设置 > Safari浏览器 > 高级 ,打开javascript和Web检查器

安卓端chromd调试h5 https://blog.csdn.net/weixin_43307658/article/details/89341417

移动端调试工具 https://blog.csdn.net/hahahhahahahha123456/article/details/109527902

通过Debugx5在电脑端调试微信页面 https://blog.csdn.net/fengda2870/article/details/88831210

chrome调试h5移动端(含android,ios)相关推荐

  1. android手机联调,安卓手机联调Chrome调试H5页面

    欢迎访问我的博客https://qqqww.com/,祝码农同胞们早日走上人生巅峰,迎娶白富美~~~ 文章目录 1 前言 2 debugx5.qq.com 3 手机连接电脑并打开开发者选项和USB调试 ...

  2. 安卓手机联调Chrome调试H5页面

    欢迎访问我的博客https://qqqww.com/,祝码农同胞们早日走上人生巅峰,迎娶白富美~~~ 文章目录 1 前言 2 debugx5.qq.com 3 手机连接电脑并打开开发者选项和USB调试 ...

  3. 全平台知识付费系统源码 支持微信小程序+公众号+H5+PC端 含搭建部署教程

    分享一个全平台知识付费系统源码,支持微信小程序+微信公众号+H5+PC端,支持DIY风格装修,含完整程序包和详细的搭建教程. 系统特色功能一览: 1.支持视频课程.音频课程.图文课程.专栏课程等: 2 ...

  4. ios emjoi java_前端App开发,实际工作中三端(android,ios,前端H5)emoji表情显示解决方案...

    想起最近开发APP的时候,产品提的一个需求,用户的帖子正文还有评论内容里,要能够显示emoji表情,因为我们这款app是混合开发的,APP里的发贴,发评论是原生做的(android和ios),但帖子详 ...

  5. chrome调试、移动端调试

    chrome 32版本后,添加 DevTools for Mobile 插件就可远程手机调试 DevTools for Mobile插件安装 https://support.google.com/ch ...

  6. H5移动端文件下载在ios的适配

    大多是用a标签点击下载,遇到文件会先预览,在非safari浏览器,还会出现点击下载无反应的情况,用window.open(api),即可适配所有ios浏览器的下载

  7. window使用chrome调试ios设备的H5页面(Safari和APP)

    window使用chrome调试ios设备的H5页面(Safari和APP) 1:用管理员身份打开PowerShell,不同操作系统打开方式不太一样,win10的话在搜索栏搜索就能找到( 2:查看Po ...

  8. Android使用Chrome调试webview中的H5界面

    前言:我们的项目是使用的webview加载H5的应用类型,最近框架升级后项目出现问题.通过chrome进行调试,发现每次都忘记使用步骤.今天记录一下! 下面是调试步骤: 1.电脑下载的Chrom浏览器 ...

  9. pc端debugger微信、电脑debugger微信、电脑调试 微信支付、pc调试 微信支付、电脑 调试真机微信、通过电脑调试手机真机打开的微信H5页面、通过电脑chrome调试手机真机打开的微信H5

    pc端debugger微信.电脑debugger微信.电脑调试 微信支付.pc调试 微信支付.电脑 调试真机微信.通过电脑调试手机真机打开的微信H5页面.通过电脑chrome调试手机真机打开的微信H5 ...

最新文章

  1. 制作nginx和php的rpm包
  2. Python搭建Keras CNN模型破解网站验证码
  3. 重写 button 的创建方法
  4. Linux常用命令----压缩解压命令
  5. Qt Creator编辑MIME类型
  6. 计算机网络技术实验,计算机网络技术实验
  7. 《Python Cookbook 3rd》笔记(5.14):忽略文件名编码
  8. golang mysql 插入_Mysql学习(一)添加一个新的用户并用golang操作Mysql
  9. LeetCode002-两数相加(Add Two Numbers)-Rust语言实现
  10. @autowired注解注入为null_Java面试必备:依赖注入注解@Resource和@Autowired
  11. 程序员如何一键“Get”高清壁纸?
  12. 树莓派系统的安装、初步配置与远程访问
  13. exchange server 2013 owa界面语言修改为中文
  14. 用命令行方式写Android应用
  15. cc2430的中文资料
  16. 产品经理学习笔记-简约设计(1)
  17. 数字转日期 matlab,excel – 如何在MATLAB中将日期转换为数字并再返回
  18. Java程序员月薪20k的涨薪秘籍,没点绝活敢跳槽吗?
  19. java unrar 乱码_JAVA使用 java-unrar-0.3.jar 解压rar,并且解决中文乱码
  20. 微信带参二维码数据解析

热门文章

  1. 滚动截屏苹果_苹果为iPhone添加了“秘密”按钮,你学会使用了吗?
  2. 11月8-10日上海新国际博览中心 SFE第35届上海国际连锁加盟展归来
  3. jquery判断复选框选中状态以及区分attr和prop
  4. php中volist怎么循环,Thinkphp的volist标签嵌套循环使用教程_PHP
  5. 鸿蒙蕴含的哲理,蕴含哲理的感悟短语,意义深刻,耐人寻味
  6. 人的差别在于业余时间
  7. bat脚本运行 NetCore
  8. 希尔伯特旅馆里,住着AI的某种真相
  9. win7右下角音量控制图标、电池图标消失
  10. elemment ui tabs实现思路