使用node.js搭建一个从0到1的简易版直播功能(局域网内都可以观看,有条件可以搭建线上版),入门级别的哈

最近几年直播是火的不得了,越来越多的人也投身直播中,我们也很有多程序员也会出现在直播中教其他的人编程知识,我也想着等我的知识和经验够得时候也开个直播试试看哈哈,当然现在也就想想可以。
经常看我的博客的童鞋,可能知道我每次写博客的时候总会扯些闲话,因为不管写什么直接进入状态可能有点难度哈。容我慢慢进入,

现在的直播功能,分为推流和拉流。 说俗点就是 主播那端是推流 通过屏幕捕捉或者是 摄像头捕获主播的 面前的东西或者是电脑桌面的东西。然后通过流的方式将数据传输到服务器端,然后服务器端在发送到客户端,客户端那边 也就是观众的那边需要拉流,然后就可以展示到 客户端了。当然 这些东西都是需要我们程序员 来完成了。

你可以选择 腾讯云的 云直播作为 服务器端,
使用node.js搭建一个从0到1的简易版直播功能(局域网内都可以观看,有条件可以搭建线上版),入门级别的哈_第1张图片
顺便提一下 推流使用的协议 不再是 http 而是 rtmp
但是之后 我为什么没有选择使用呢,虽然上线 松了20G流量 腾讯的直播 他需要你的 拉流客户端 必须是 有备案通过的域名作为客户端的,这里我没有, 所以 就弃用了,而且 还有时间限制,他规定了一次只能直播多长的时间,你用人家的东西 确实挺舒服的 但是 就得听人家的安排,如果不想这样 就只能 自己搞一个 服务器了。

这个时候就选择 node.js,还有有大神把直播的插件给开发出来了。
1.安装
npm install node-media-server --save
2.配置启动
node index.js

//  index.js 
const NodeMediaServer = require('node-media-server');
 
const config = {
  rtmp: {
    port: 1935,
    chunk_size: 60000,
    gop_cache: true,
    ping: 30,
    ping_timeout: 60
  },
  http: {
    port: 8000,
    allow_origin: '*'
  }
};
 
var nms = new NodeMediaServer(config)
nms.run();

启动成功的效果
在这里插入图片描述

3.就是下载 推流的工具 相信 很多玩过直播的小伙伴可能知道 虎牙和斗鱼直播的工具应该都是用的这个
OBS
https://obsproject.com/ // 下载地址
不知道为什么我的下载的特别慢 下面 我也附上了 网盘地址 怕你们也下载很慢
链接:https://pan.baidu.com/s/1FOdzPRQ-rwPS7Z2wwyFk0A
提取码:nte1
4.下载完成 安装上Obs 开始进行配置
看过一些游戏直播的童鞋可能知道,是不是在主播下播的时候 会看见下面的情况是吧。
使用node.js搭建一个从0到1的简易版直播功能(局域网内都可以观看,有条件可以搭建线上版),入门级别的哈_第2张图片
这个有个问题就是 OBS的 显示器桌面 捕捉 必须 得是集成显卡 要不你挣开的就是 黑屏情况,这个问题 你可以去设备管理器 哪里 先把 独显 给 禁用了 就可以了 ,然后播完之后 再把独显关闭了,这个好像就是 windows10的 笔记本会出现这种情况。

点击左下边 来源的 加号 然后 选择 桌面捕获
就会出现上图的这种情况了,然后就是 开始推流了 上面我们已经用node.js搭建好了 流服务器了。点击右下边的 设置
服务器是 rtmp://192.168.0.4/live/
我这里使用的是 ip地址 因为一会我要让 手机看到 所以不能用 localhost 进行设置
下面的 流秘钥 你可以自定义 就好像是主播的房间号似得
我定义了是 zyc
使用node.js搭建一个从0到1的简易版直播功能(局域网内都可以观看,有条件可以搭建线上版),入门级别的哈_第3张图片
配置完后 保存 点击开始推流
服务器端 有变化 就说明了 你的推流成功了 。
使用node.js搭建一个从0到1的简易版直播功能(局域网内都可以观看,有条件可以搭建线上版),入门级别的哈_第4张图片
这下 我们要配置 客户端的拉流了
有关拉流的知识 因为我也是菜鸟 不懂那么多
使用过 flv 的方式 进行拉流的,下面是客户端了拉流代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		
		<script src="https://cdn.bootcss.com/flv.js/1.4.0/flv.min.js"></script>
		<video id="videoElement" style="width: 100%;" controls="controls"></video>
		<script>
		    if (flvjs.isSupported()) {
		        var videoElement = document.getElementById('videoElement');
		        var flvPlayer = flvjs.createPlayer({
		            type: 'flv',
					url:'http://192.168.0.104:8000/live/zyc.flv'
		        });
		        flvPlayer.attachMediaElement(videoElement);
		        flvPlayer.load();
		        flvPlayer.play();
		    }
		</script>
	</body>
</html>

然后 打开浏览器哈
刚好看到就是 我刚刚在做的动作 这个很正常哈 因为直播就是会有延迟的。
使用node.js搭建一个从0到1的简易版直播功能(局域网内都可以观看,有条件可以搭建线上版),入门级别的哈_第5张图片
这个时候还没有完 我们还要测试 在手机上 会不会成功
因为要在手机上测试 你就不能 在本地打开这种方式了,你要在你的电脑上建立一个本地服务器才行哈
我就安装了 一个 http-server
npm install http-server -g
然后就是 启动 http-server
监听 8080端口
我查了下 ip 地址 http://192.168.0.4:8080/index.html
在手机上 浏览器上输入上面的地址 访问
下面的是 手机上看到的效果。
虽然中间出现了一些挫折 ,但是最后还是成功了 很开心了,对直播有兴趣的童鞋也可以搞搞看哦
使用node.js搭建一个从0到1的简易版直播功能(局域网内都可以观看,有条件可以搭建线上版),入门级别的哈_第6张图片

你可能感兴趣的:(node,直播,nodejs)