开发者社区> 向善的灯> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

【开源项目】基于Nodejs的Express框架开发的VIP视频网站项目及源码分享

简介: 基于NOdeJS开发的一个视频网站项目,目前实现的功能包括用户主页,登录页面,注册页面,电影/电视列表首页,搜索页面,播放页面。
+关注继续查看

首先直接来看下最终的效果图吧:
网站首页:
index_2_

play.jpgtv

播放页面:

play

评论页面:
comment

搜索页面:
search

登录页面:
login

注册页面:
register

用户中心:
user

项目名称:VIP视频网站项目
开发语言:HTML,CSS(前端),JavaScript,NODEJS(expres)(后台)
数据库:MySQL
开发环境:Win7,Webstorm
上线环境:Linux服务器
在线演示站点:http://vip.52tech.tech
Github源码:https://github.com/xiugangzhang/vip.github.io

VIP视频网站项目基本介绍

程序安装方法

  • 确保电脑已经安装了NodeJS环境,运行版本尽量保持最新(V8以上吧),然后下载此安装包后解压到你的系统任意盘符下面的目录;
    在当前解压文件夹的主目录(包含package.json的那个文件夹)运行命令:npm install, 系统就会自动安装该程序的依赖包;
  • 登录你的网站数据库管理界面(PHPAdmin),如果是在本地测试的话,就使用Navicat等MYSQL数据库连接工具连接数据库,连接完成之后创建数据库名为video,设置数据库登录名root, 登录密码为123456。如果需要配置其他用户名或者密码,请进入到modes/db.js文件下面,修改代码11行/12行的位置,user和password改为你自己的用户名个密码就行;
  • 数据库环境配置完成之后,打开解压文件夹里面的video.sql数据库脚本文件,进入Navicat等数据库管理工具,运行执行脚本文件,脚本执行成功之后就会在已经创建好的数据库下面创建程序运行所需要的数据表文件;
  • 在以上的步骤都执行完成且正确的情况下,就可以在程序主目录下面(有app.js的那个目录),先打开app.js文件,然后找到代码:server.listen(8080, ‘192.168.1.101’, function () {}),修改为你自己的主机相应的IP地址和端口号,然后执行命令,node app.js,在以上的配置都没出错的情况下,这里就会正常启动程序了,然后进入浏览器,输入IP地址和端口号,就会进入到程序的主页了。
  • 初次进入到网站首页后,由于数据库中没有数据的原因,首页或者其他页面可能会出现变形格式不正常等其他问题,大家可以向数据库中添加一些测试数据,然后再测试一下。这里也可以直接添加我这里提供的一些测试数据,参见相关文件夹下面的video.sql 文件(直接导入数据表结构),如果是需要导入内容文件,这里也提供了另外一个SQL文件(包含部分内容的数据表movies.sql和tvs.sql),直接使用数据库管理工具,导入SQL文件数据到数据库即可完成数据的导入。

当前版本 V1.0.0

主要功能

  • 用户主页的搭建:
    实现了主页轮播图的显示和切换,用户可以从数据库中自由配置和切换轮播图的显示

实现了主页电影列表的显示:从数据库文件读取电影和电视剧列表信息并在前台显示
用户登录和注册页面的搭建:
实现了用户的登录和注册功能
用户注册和登录验证码提示功能
用户登录注册验证码机制

  • 电影播放页面的搭建
    对于其他页面的任意可以展现电影列表的页面,用户可以直接点击列表,直接进入播放页面

播放页面电影详细信息的展现
对于加载速度较慢的视频,用户可以自由切换播放接口进行加速
弹幕功能(特色功能):类似于B站等其他视频网站的弹幕功能,用户在登录之后可以实现在线发言
用户可以在相应的播放页面查看其他用户已经发表的评论,同时也可以在登录之后自由发表评论
电影收藏和取消功能

  • 用户中心的管理
    对于已经注册的用户,实现用户基本信息的修改

用户密码的修改
用户评论记录的查看
用户收藏电影的查看和播放
用户登录日志的查看

  • 电影搜索功能(特色功能)
    实现了根据视频播放地址和视频名称全网视频的搜索和播放功能

实现了正在热映,即将上映和TOP250的电影列表的展示

  • 其他
    页面整体的风格模仿了Discuz等论坛网站的布局

网站首页的轮播图效果模仿了优酷、爱奇艺、腾讯视频等主流视频网站的轮播图效果
电影底部的的友情链接,使用了大部分网站的分栏布局,用户可以添加自己的QQ群以及微信公众号方便增加自己网站的人气
主要列表的分页功能,对于一些内容显示较多的不能再一页显示完整的页面,使用了ajax无刷新分页对数据进行多条展示,提高了用户的体验
目前主流浏览器中也做了相应测试,建议大家使用谷歌或者火狐浏览器,效果可能会更好

其他说明

  • 总的来说吧,自己就是一个对前端技术有着较高热情的小白吧,没事的时候喜欢瞎折腾,对一些有意思的技术平时也比较喜欢研究一下吧。因此就在这股热情的鼓励下,怀着满腔热血,写下了这个VIP视频网站项目程序。因为发现有些东西一旦落下来,后面就也没有太多的激情去继续完善这个程序了,就把这个程序贡献给开源社区吧,供大家学习交流使用,在这里也希望大家能够多多支持。
  • 最后,也请大家尊重原创,转载请注明出处。此外,由于时间原因以及个人能力有限等其他原因,目前程序中可能也会存在一些潜在的bug,对于程序中的一些技术细节或者其他问题,也欢迎大家多多交流,也欢迎大家提出来,后面也可以抽时间继续维护这个项目,如果可以的话后面大家可以继续维护吧。有什么问题或者建议也欢迎大家在下面留言。

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
Express 基于 Node.js 平台,快速、开放、极简的 Web 开发框架
Express 基于 Node.js 平台,快速、开放、极简的 Web 开发框架
64 0
node.js使用express框架进行文件上传
node.js使用express框架进行文件上传 关于node.js使用express框架进行文件上传,主要来自于最近对Settings-Sync插件做的研究。 目前的研究算是取得的比较好的进展。 Settings-Sync中通过快捷键上传文件,其实主要还是请求后端接口。
2153 0
Expression.Blend.4 Chapter 图片和视频的使用
原文:Expression.Blend.4 Chapter 图片和视频的使用 翻译的地方可能有错误,欢迎大家指正。但是里面每一个程序都是亲自测试过,并加了点自己的看法。 我翻译的是Expression.Blend.4.Step.by.Step,大家有疑问的可以去看看英文原版。
814 0
零元学Expression Blend 4 - Chapter 11 用实例了解布局容器系列-「Border」
原文:零元学Expression Blend 4 - Chapter 11 用实例了解布局容器系列-「Border」 将教大家以实做案例认识Blend 4 的布局容器,此章介绍的布局容器是Blend 4 里的专情王子-「Border」。
1074 0
OpenWrt for vmware 从openwrt.org下载10.03.1 或是自己下载最新的源码进行编译生成x86 vmdk格式
1,直接从OpenWrt.org官网下载 http://downloads.openwrt.org/backfire/10.03.1/x86_generic/ 更新OpenWrt在线软件源 opkg update http://downloads.
1304 0
使用 PVRTC 压缩格式创建纹理(Creating textures in the PVRTC compression format)
使用 PVRTC 压缩格式创建纹理(Creating textures in the PVRTC compression format) 太阳火神的美丽人生 (http://blog.csdn.net/opengl_es) 本文遵循“署名-非商业用途-保持一致”创作公用协议 转载请保留此句:太阳火神的美丽人生 -  本博客专注于 敏捷开发及移动和物联设备研究:iOS、Android、Html5、Arduino、pcDuino,否则,出自本博客的文章拒绝转载或再转载,谢谢合作。
1104 0
使用 PVRTC 压缩格式创建纹理 Creating textures in the PVRTC compression format
转自:https://developer.apple.com/library/ios/qa/qa1611/_index.html Technical Q&A QA1611 Creating textures in the PVRTC compression format ...
1555 0
艾伟_转载:完美解决在ModalPopupExtender中使用CalendarExtender时被层遮挡的问题
  ASP.NET AJAX Control Toolkit是一组非常不错的基于asp.net的ajax控件,它建立在asp.net 3.0的ScriptManager组件之上,提供了很多非常实用的效果和功能。
904 0
+关注
53
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期:MySQL数据库进阶实战
立即下载