技术摘要：
本发明提供一种网页开发时自动刷新网页的方法，属于网络技术领域，本发明包括：利用Node.js实现服务器端进行文件监听；使用websocket实现网页端与服务器端数据连接；手动设置当前网页文件路径；网页端通过封装好的脚本进行自动刷新。可以节省开发时间，提升开发效率。
背景技术：
在进行web前端开发网页时，程序员需要进行代码编写，然后在浏览中查看编写的 页面效果。但是代码编写不是一次完成的，而是不断的增加功能，修改细节，所以在网页开 发时，需要频繁的查看网页效果以验证开发的正确性。 在现实开发工作中，程序员需从代码编辑器界面切换到浏览器页面，然后设置网 页焦点，再进行刷新，然后滑动页面至上次开发的位置查看效果。当前网页开发的方式有以 下缺陷： 1.用户开发时需要频繁切换代码编辑器与浏览器，需要手动刷新才能查看效果。 2.用户手动刷新，每次会返回浏览器顶部，需要开发人员滑动到上次浏览位置。 3.重复性操作浪费开发人员的时间和精力。
技术实现要素：
为了解决以上技术问题，本发明提供了一种监测网页代码变化从而自动进行刷新 的方法，节省开发人员的精力和时间，提升开发效率。 本发明的技术方案是： 一种网页开发时自动刷新网页的方法，包括以下步骤： 1)网页端设置当前网页的文件路径，并通过websocket与后端实现数据连接； 2)网页与服务器端建立websocket连接，服务器端监听文件变化； 3)用户编写代码，保存代码后服务器端推送消息； 4)页面自动刷新模块启动，当前页面自动刷新，显示新的页面效果； 5)完成自动刷新功能，再次进入下一次监听循环操作。 6)在文件关闭后，取消服务器端对文件的监听；当页面代码编辑完成或需要退出 前，通知服务器端对当前websocket连接进行关闭。 进一步的，网页端根据服务器端的websocket地址进行连接，连接成功后网页将设 置的文件路径通过websocket传输给服务器端，Node.js服务器在本机上根据此路径查找到 文件，随即对文件进行变化监听。 进一步的，操作成功后，在进行代码开发时，Node.js会检测到此文件每一次的变 化，并通过websocket将变化消息发送给网页； 而网页端在接收到后端推送的"fileChanged"标识后，使用刷新模块进行自动刷 新功能。 进一步的，在后续编写网页代码时，每次保存网页文件，Nodejs服务器端都可以检 测到文件的变化。在文件变化发生后，通过websocket的回调函数，推送给网页端" fileChanged"的消息。 3 CN 111597483 A 说　明　书 2/4 页 进一步的，页面在接收到"fileChanged"消息后，会启动自动刷新模块功能； 首先获取本页面滚动的位置，然后通过js脚本将此值存储在浏览器的cookie中； 保存完cookie后，页面自动进行刷新，会显示最新的页面效果。 进一步的，每次页面刷新后，浏览器会自动将当前页面返回至页面顶部；不符合自 动刷新的设计初衷，所以需要自动将页面滑动到上次浏览位置。从浏览器Cookie中读取到 本页面上次浏览位置的值，取出值然后通过js脚本将页面滚动至历史位置，完成本次文件 监听自动刷新功能。 进一步的，在完成本次刷新功能后，因为已经在页面上设置过本地文件地址，页面 会自动进入到4)步骤，重新与后端建立连接，进行下一次文件监听服务；由此系统可以循环 进行文件变化监听，从而完成网页开发时自动刷新功能。 将上述过程中的代码进行封装，用户在开发新页面时，只需要引入固定js资源并 设置新网页的路径，就可以实现网页的自动刷新效果。 本发明的有益效果是 1 .监听网页文件变化，自动进行刷新，开发人员不用再频繁手动操作查看页面效 果 2.自动记录上次页面浏览位置，自动将网页滚动至历史位置 3.去除重复操作，可以节省开发时间，提升开发效率 4.简单高效，占用资源较小。 附图说明 图1是自动刷新插件整体设计流程示意图； 图2是网页端自动刷新模块工作流程示意图。