nodejs教你搭建媒体服务器

作者:admin / 时间:1年前 (2018/11/11) / 分类:后端测试 / 阅读:397 / 评论:0

先简单介绍下这个媒体服务器有什么功能:可以上传图片,音乐和视频;音乐和视频提供在线播放,全屏播放,下载功能,与文件服务器互通;上传的媒体文件会自动归类到对应的媒体区域。

下面来看下效果图:

上传的媒体文件会自动归档到所属区域

音乐和视频提供下载

支持全屏播放

下面我们来看下代码:因为服务端的代码和文件服务器的大同小异,所以这里不再赘述,需要了解服务端或文件服务器的请移步文件服务器。

有了文件服务器的基础,媒体服务器就简单多了。

下面是html代码,依然很少,大部分还是js的内容。

媒体服务器的html代码

媒体服务器和文件服务器在代码上最大的不同就是动态创建dom标签的时候,下面的这段代码是创建公共的dom标签。科普一下,Dom标签不仅包括div标签,还包括下面的img标签,a标签,p标签等,所以这里直接说dom标签而不是div标签。

公共的dom标签

下面的这段是用来创建mp3音乐区的dom标签并挂载相应属性

创建mp3音乐区的dom标签

下面的这段是用来创建mp4视频区的dom标签并挂载相应属性

创建mp4视频区的dom标签

下面的这段是用来创建图片区的dom标签并挂载相应属性,支持上传的图片类型有jpg,png和gif。

创建图片区的dom标签

动态创建dom元素的逻辑有点绕,尤其是创建很多dom标签的时候,下面的这张图帮助你理清这些创建dom标签的逻辑,当你理清楚后会发现原来很简单。

控制台中的html

至此,一个家庭影院系统就创建完成了,大家有好资源一起上传分享哈。


没有评论,留下你的印记,证明你来过。


发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。