一种跨设备页面调试方法和装置制造方法及图纸

本发明专利技术公开了一种跨设备页面调试方法和装置，涉及计算机技术领域。该方法的一具体实施方式包括：对第一设备浏览器中的页面进行姿态监听，得到页面在各个坐标轴的旋转角度，基于预定转换矩阵对旋转角度进行转换，得到四元数；传输四元数至服务端，通过服务端将四元数广播至第二设备，以在第二设备中对四元数进行虚拟现实全景渲染后，根据所述虚拟现实全景对所述页面的代码进行断点调试。该实施方式基于第二设备无法模拟第一设备的姿态，而第一设备的浏览器不具备调试能力的思路，通过分离数据的计算和渲染，将计算所得结果传输至第二设备，并在第二设备进行代码调试，以此解决第一设备上无法调试VR全景(H5)的问题。

【技术实现步骤摘要】
一种跨设备页面调试方法和装置
本专利技术涉及计算机
，尤其涉及一种跨设备页面调试方法和装置。
技术介绍
随着移动互联网的发展和智能手机的普及，许多应用使用手机的陀螺仪数据实现VR(VirtualReality，虚拟现实)全景H5效果。VR全景几乎覆盖了各个行业，包括居家、家装、教育、游戏等。在实现本专利技术的过程中，专利技术人发现现有技术至少存在如下问题：现有方式开发效率低，手机上的浏览器无法断点调试，查看日志不便，不利于错误排查；且手机机型较多、不同浏览器的标准不统一、内核版本不一致，导致调试困难，因此在开发VR全景(H5)时面临诸多不确定问题。
技术实现思路
有鉴于此，本专利技术实施例提供一种跨设备页面调试方法和装置，至少能够解决现有手持设备无法调试VR全景(H5)的问题。为实现上述目的，根据本专利技术实施例的一个方面，提供了一种跨设备页面调试方法，包括：对第一设备浏览器中的页面进行姿态监听，得到所述页面在各个坐标轴的旋转角度，基于预定转换矩阵对所述旋转角度进行转换，得到四元数；其中，所述四元数表示所述页面所处平面的姿态；传输所述四元数至服务端，通过所述服务端将所述四元数广播至第二设备，以在所述第二设备中对所述四元数进行虚拟现实全景渲染后，根据所述虚拟现实全景对所述页面的代码进行断点调试。可选的，在所述传输所述四元数至服务端之前，还包括：建立与所述服务端之间的长链接，通过所述长链接将身份标识传输至所述服务端，以在所述服务端识别所述身份标识为生产者身份标识时，将所述长链接确定为生产者长链接。可选的，在所述根据所述虚拟现实全景对所述页面的代码进行断点调试之后，还包括：通过与页面端之间的链接，对所述页面的代码是否变化进行监测，以在监测到所述页面的代码发生变化时，传输页面刷新请求至所述页面端；接收所述页面端反馈的对所述页面调试后的代码，基于所述代码对所述页面进行刷新。可选的，在所述根据所述虚拟现实全景对所述页面的代码进行断点调试之后，还包括：接收页面端传输的代码更新指令；其中，所述代码更新指令为所述页面端在接收到所述第二设备传输的代码后生成，所述代码为对所述页面调试后的代码；基于所述代码对所述页面进行刷新。可选的，在所述第二设备中对所述四元数进行虚拟现实全景渲染，还包括：所述第二设备基于正交投影方式，构建投影矩阵，结合所述四元数和全景模型进行虚拟现实全景渲染。为实现上述目的，根据本专利技术实施例的另一方面，提供了一种跨设备页面调试装置，包括：姿态监听模块，用于对第一设备浏览器中的页面进行姿态监听，得到所述页面在各个坐标轴的旋转角度，基于预定转换矩阵对所述旋转角度进行转换，得到四元数；其中，所述四元数表示所述页面所处平面的姿态；信息传输模块，用于传输所述四元数至服务端，通过所述服务端将所述四元数广播至第二设备，以在所述第二设备中对所述四元数进行虚拟现实全景渲染后，根据所述虚拟现实全景对所述页面的代码进行断点调试。可选的，还包括链接建立模块，用于：建立与所述服务端之间的长链接，通过所述长链接将身份标识传输至所述服务端，以在所述服务端识别所述身份标识为生产者身份标识时，将所述长链接确定为生产者长链接。可选的，还包括代码刷新模块，用于：通过与页面端之间的链接，对所述页面的代码是否变化进行监测，以在监测到所述页面的代码发生变化时，传输页面刷新请求至所述页面端；接收所述页面端反馈的对所述页面调试后的代码，基于所述代码对所述页面进行刷新。可选的，还包括代码刷新模块，用于：接收页面端传输的代码更新指令；其中，所述代码更新指令为所述页面端在接收到所述第二设备传输的代码后生成，所述代码为对所述页面调试后的代码；基于所述代码对所述页面进行刷新。可选的，还包括全景渲染模块，用于：所述第二设备基于正交投影方式，构建投影矩阵，结合所述四元数和全景模型进行虚拟现实全景渲染。为实现上述目的，根据本专利技术实施例的再一方面，提供了一种跨设备页面调试电子设备。本专利技术实施例的电子设备包括：一个或多个处理器；存储装置，用于存储一个或多个程序，当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现上述任一所述的跨设备页面调试方法。为实现上述目的，根据本专利技术实施例的再一方面，提供了一种计算机可读介质，其上存储有计算机程序，所述程序被处理器执行时实现上述任一所述的跨设备页面调试方法。根据本专利技术所述提供的方案，上述专利技术中的一个实施例具有如下优点或有益效果：基于第二设备无法模拟第一设备的姿态，而第一设备的浏览器不具备调试能力的思路，通过分离数据的计算和渲染，将第一设备计算所得结果传输至第二设备，并在第二设备进行代码调试，以此解决第一设备上无法调试VR全景(H5)的问题。上述的非惯用的可选方式所具有的进一步效果将在下文中结合具体实施方式加以说明。附图说明附图用于更好地理解本专利技术，不构成对本专利技术的不当限定。其中：图1是根据本专利技术实施例的一种跨设备页面调试方法的主要流程示意图；图2是对第一设备进行设备坐标系构建示意图；图3(a)～图3(c)是对第一设备坐标系中各个坐标轴的旋转瑰色示意图；图4是中转换与第一设备、第二设备的交互流程示意图；图5是利用正交投影方式构建投影矩阵的示意图；图6是在PC端渲染VR全景和代码调试示意图；图7是根据本专利技术实施例的一种跨设备页面调试装置的主要模块示意图；图8是本专利技术实施例可以应用于其中的示例性系统架构图；图9是适于用来实现本专利技术实施例的移动设备或服务器的计算机系统的结构示意图。具体实施方式以下结合附图对本专利技术的示范性实施例做出说明，其中包括本专利技术实施例的各种细节以助于理解，应当将它们认为仅仅是示范性的。因此，本领域普通技术人员应当认识到，可以对这里描述的实施例做出各种改变和修改，而不会背离本专利技术的范围和精神。同样，为了清楚和简明，以下的描述中省略了对公知功能和结构的描述。参见图1，示出的是本专利技术实施例提供的一种跨设备页面调试方法的主要流程图，包括如下步骤：S101：对第一设备浏览器中的页面进行姿态监听，得到所述页面在各个坐标轴的旋转角度，基于预定转换矩阵对所述旋转角度进行转换，得到四元数；其中，四元数表示页面所处平面的姿态；S102：传输所述四元数至服务端，通过所述服务端将所述四元数广播至第二设备，以在所述第二设备中对所述四元数进行虚拟现实全景渲染后，根据所述虚拟现实全景对所述页面的代码进行断点调试。上述实施方式中，对于步骤S101，本专利技术实施例适用H5中一切适用陀螺仪数据的场景，所涉及的第一设备可以为手机等手持设备，第二设备可以为PC端、平板电脑、台式电脑等。对第一设备定义X、Y、Z轴，具体参见图2所示。第一设备的坐标系定义于集成显示屏幕本文档来自技高网...

【技术保护点】
1.一种跨设备页面调试方法，其特征在于，包括：/n对第一设备浏览器中的页面进行姿态监听，得到所述页面在各个坐标轴的旋转角度，基于预定转换矩阵对所述旋转角度进行转换，得到四元数；其中，所述四元数表示所述页面所处平面的姿态；/n传输所述四元数至服务端，通过所述服务端将所述四元数广播至第二设备，以在所述第二设备中对所述四元数进行虚拟现实全景渲染后，根据所述虚拟现实全景对所述页面的代码进行断点调试。/n

【技术特征摘要】
1.一种跨设备页面调试方法，其特征在于，包括：
对第一设备浏览器中的页面进行姿态监听，得到所述页面在各个坐标轴的旋转角度，基于预定转换矩阵对所述旋转角度进行转换，得到四元数；其中，所述四元数表示所述页面所处平面的姿态；
传输所述四元数至服务端，通过所述服务端将所述四元数广播至第二设备，以在所述第二设备中对所述四元数进行虚拟现实全景渲染后，根据所述虚拟现实全景对所述页面的代码进行断点调试。


2.根据权利要求1所述的方法，其特征在于，在所述传输所述四元数至服务端之前，还包括：
建立与所述服务端之间的长链接，通过所述长链接将身份标识传输至所述服务端，以在所述服务端识别所述身份标识为生产者身份标识时，将所述长链接确定为生产者长链接。


3.根据权利要求1所述的方法，其特征在于，在所述根据所述虚拟现实全景对所述页面的代码进行断点调试之后，还包括：
通过与页面端之间的链接，对所述页面的代码是否变化进行监测，以在监测到所述页面的代码发生变化时，传输页面刷新请求至所述页面端；
接收所述页面端反馈的对所述页面调试后的代码，基于所述代码对所述页面进行刷新。


4.根据权利要求1所述的方法，其特征在于，在所述根据所述虚拟现实全景对所述页面的代码进行断点调试之后，还包括：
接收页面端传输的代码更新指令；其中，所述代...

【专利技术属性】
技术研发人员：何进萍，
申请(专利权)人：北京沃东天骏信息技术有限公司，北京京东世纪贸易有限公司，
类型：发明
国别省市：北京;11