混合开发之H5在移动端如何调试界面

Posted 2023-03-23

参考技术A

在平时工作中，APP端使用前端界面并进行相应的交互，在此过程中，经常会遇到一些问题，但是由于界面是在APP端打开，就会产生一个问题：当界面报错或者需要调试时，很难进行相应的调试工作，在经过一些尝试之后，发现使用vorlon进行调试比较方便（在Vue多页面工程中，单页面未尝试，但是原理应该一样），以下记录使用过程：

1.首先进行全局安装vorlon（cnpm install -g vorlon）;

2.然后在index.html（需要监控的界面）添加<script src="http://192.168.1. : /vorlon.js"></script>

3.打开cmd，输入vorlon执行

4.在浏览器中打开http://192.168.1. : （你配置的监控ip和端口）进行监控

5.手机端打开界面，浏览器中vorlon就会显示相应的调试区域

注意：手机需要和电脑在同一个局域网内

经过个人测试，使用该方法调试APP内使用的H5界面，虽然不及在Chrome中直接进行调试，但是还是能解决移动端调试的问题的

如何在 iPhone 上以调试/开发模式运行我的混合移动应用程序？

【中文标题】如何在 iPhone 上以调试/开发模式运行我的混合移动应用程序？

【英文标题】：How can I run my hybrid mobile app in debug/development mode on an iPhone?

【发布时间】：2017-02-02 13:10:48

【问题描述】：

TL;DR：我可以通过 VS2015 在开发模式下运行我们的应用程序，并在我拥有的 iPhone 5c 上进行远程调试，但我不能在 iPhone 4s 上做同样的事情。

---

我在将 Cordova 驱动的混合应用程序部署在我的开发环境中的一台特定设备上时遇到了一些困难……但是我不确定这是否是我做错了，或者这里是否存在一些兼容性问题。在这里发布一个问题，希望有人可以帮助我弄清楚发生了什么。

只是为了了解一些背景：有问题的应用是使用英特尔 XDK 创建的，然后在英特尔最近删除了一些 XDK 的“调试”功能时移植到了 Visual Studio 2015。需要调整一些东西，但该项目仍然包含一些英特尔的 JS 代码，就像在原始项目中一样。

我的环境包括：

Windows 10 专业版（主桌面） 带有 OSX“El Capitan”10.11.6 的 Apple Mac Mini（在网络上作为构建服务器） 装有 iOS 8.3 的 iPhone 5c 装有 iOS 9.0.2 的 iPhone 4s

在配置这个环境时，我遵循了instructions here。 remotebuild 代理配置为使用 http 只是为了保持简单，因为无论如何这都包含在公司网络中。

在此之后，我可以在 iPhone 5c 上运行我们的应用程序而没有任何问题，但尝试在 iPhone 4s 上运行它会在 VS2015 中显示错误：

Failed to deploy iOS remote for <project_path>\bld\ios\Debug\buildInfo.json to http://10.66.7.23:3000/cordova: Error from http get [object Object]: Error: socket hang up

注意：Mac 上的remotebuild 控制台输出中没有错误，VS 构建项目正确，但随后未能部署它。

我还在两台设备上尝试了多个配置文件，使用 iTunes、Xcode 或 Apple Configurator 2 安装；但由于配置文件没有出现在 iOS 8 或更高版本的设备上，我什至无法验证它们是否已安装。

这两种设备都可以安装和运行这个应用程序的早期版本（可在应用商店中获得），但我需要能够实时检查 DOM，因为即使它们具有相同的屏幕尺寸，响应式断点的行为有所不同。

所以，在我拔掉我剩下的那一点头发之前，请有人帮我弄清楚这到底是怎么回事？我已经为此奋斗了一个多星期，我觉得我在兜圈子。

【问题讨论】：

远程机器出现问题，其他用户登录，但需要构建的用户没有活动会话。这是socket挂断部分。如果这是您的情况，请告诉我。

为什么一定要远程调试？这是义务吗？

@user3344236，很抱歉，我不明白你的意思：Mac 坐在我的 Windows 机器旁边的桌子上，而我是唯一使用其中任何一个的人目前..

@Ryad，不幸的是，由于应用程序最初的设计方式（我被告知我不允许重写它），这是需要的，所以我可以看到任何我们应用程序的重要观点是让它在手机上运行，​​并通过蓝牙连接到我们自己的专有硬件：这里没有模拟数据源。这意味着我需要能够在 DOM 在 iPhone 上运行时直接检查它。 :'(

@ZaLiTHkA 我可能无法为您的问题提供解决方案，因为我没有参与此设置。但是经过一番搜索，我可以给你的指针是，当服务器没有响应时，会抛出“sockt hang up”错误。其次，它可能无法在 iphone 4 中运行，因为它使用的是 iOS9，并且某些安全策略可能会导致此问题。 iphone 5s可以升级到ios9并测试一次吗？这就是我现在能提供的所有帮助。对不起

【参考方案1】：

在 iPhone 4s 前后颠簸之后，事实证明设备本身确实有问题。不知何故，这已转化为未正确安装的 iOS 版本，从而导致设备上运行的应用出现软件问题。

这对我们来说并没有立即显现出来，因为不幸的是我们没有可以访问的设备进行测试，但由于我设法拿到了 9.3.5 的 iPad Mini 和 10.2.1 的 iPhone 6，我们'已成功验证我们的应用与较新的操作系统版本的兼容性。

---

无论如何，最后我只想对我在问题 cmets 中得到的所有建议和想法说声谢谢（尤其是@Gandhi，对赏金故事感到抱歉，我仍然觉得你应该得到它只是因为如此乐于助人）。

尽管我的特定问题在 SO 上无法解决，但在此过程中我仍然学到了很多东西，我非常感激。

【讨论】：

很高兴您解决了这个问题。正如预期的那样，该设备是罪魁祸首。赏金的大小姐。保重

【参考方案2】：

即使提问者本人已经发布了答案，我仍然会发布我的答案以供他人使用。

当构建部署在运行 iOS 8 的设备上而不是运行在 iOS 9 上的设备上时，这可能是由于安全性更改导致的 iOS 版本问题，也可能是设备兼容性问题。

在这种情况下，缩小问题范围的快速方法是在具有相同版本（iOS 9）的其他设备上测试构建。但不幸的是，在@Zalithka 的情况下，他有设备可以测试。但是如果有人遇到这样的问题，请尝试在不同的设备上快速缩小问题范围并解决问题。