标签：Web 调用 自定义 前端 接口 EasyNVR 页面

随着越来越多的用户使用EasyNVR，大家对EasyNVR的功能性需求也不断提高，比如需要更改一下EasyNVR平台Web前端的一些样式。当前EasyNVR为5.0.0版本，Web前端为了增加前端的运行效率和减小项目体积，使用的是vue+webpack进行打包，这样为那些需要自定义更改样式的用户增加了难度。 
 

EasyNVR的前端其实是通过调用我们流媒体软件接口的demo来实现的界面，为了方便更改，用户可以自主编译前端进行前端修改。

那么如何将自己现有EasyNVR前端版本界面配合5.0.0版本的EasyNVR使用起来？针对这个问题我们首先需要弄清楚EasyNVR软件包里的目录结构。软件包根目录下的www文件夹是我Web对外输出的界面存放的地方，我们的前端源代码都在该目录下（EasyNVR5.0.0版本该目录下存放的为webpack压缩后的文件）。因此只需要将自己前端代码包的前端界面替换到该目录下就可以。

如果直接替换的话，直接进入Web端直接访问会发现EasyNVR无法显示页面。按F12查看浏览器报错发现是前端页面的样式引用问题。

这个是由于前端Web页面的加载引用文件路径出现错误导致，只要修改文件的路径就会成功规避掉这个问题，但是随之而来的又是另外一个问题。

从浏览器的报错可以看出，是接口调用不成功的问题。EasyNVR默认的HTTP端口是10800。由于我们使用的是http-server启动的Web页面，而起的服务默认端口是8080，这就和我们调用接口的10800端口产生了冲突。因此需要注意的是，在Web前端代码中调用接口的端口。

对于Web端来说，样式完整的展示和接口的成功调用就已经完成，经过此番调用，有需要的小伙伴可以基于通俗易懂的html、js来进行自定义的页面修改了。

标签：Web,调用,自定义,前端,接口,EasyNVR,页面
来源： https://blog.csdn.net/EasyNVR/article/details/121084532

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。