swoole视频直播（记录用未测试）

admin · 发表于 2020-3-29 18:53:53

服务器代码

$serv=new swoole_websocket_server("0.0.0.0",9501);
. M" \+ r1 |+ u2 l4 w, o7 {& i
$client=array();7 k& |6 B- Z8 ]! f' Z. ~
$serv->on("open",function($serv,$req)use($client){
. J4 m" {) I4 E: K: _% u
//echo 'connect'.$req->fd;2 O1 I% j& }# u' Z, k' V& K
$client[]=$req;
2 f9 J) T6 q# |7 Y
//var_dump($client);5 Y6 z r8 E1 @+ g/ s/ k9 f- Z
$serv->push($req->fd,'aa');9 W7 r0 ^ K0 w. r; O
});
7 l6 f1 R, c: b+ y+ r" A' M
" c7 M9 J& X- }% x
$serv->on("message",function($serv,$frame)use ($client){& V' {7 z: ?1 [0 L- Y
/*var_dump($frame->data);
# t; r* y, I( r/ C' Q! A- ^
foreach($client as $key =>$val){
: d% R( b5 C: R
$serv->push($val->fd,'aa');
( g: K- I' e4 w# F/ n$ x# @
}*/3 c6 |9 J( m+ V2 a% D9 M
$client=$serv->connection_list();
- t/ r o$ U3 I. o$ J$ K
var_dump($client);
g5 S% U5 \& J' L5 ?( ^
foreach($client as $key =>$val){
! `% |9 h" I2 \! y4 A- H
if($val!=$frame->fd){+ Z H9 {2 \ e6 ~ M1 X4 ^
$serv->push($val,$frame->data);, B6 P/ e9 I- M+ l7 h: ?
}$ O4 t! h! p) B8 I7 p t4 M
}$ r, \+ g( r. \7 l
) I; |" ?. q( [( P( ~
});
) G n( z- J$ y% ?4 j) d
4 A2 O/ O9 D& ?5 V6 P2 K9 w
$serv->on("close",function($serv,$fd){/ X7 ]2 u' k+ d8 v5 Z
echo 'close';8 X! G0 |4 ?9 u+ q
});4 z9 q3 ^9 i0 E0 a6 F
% R X0 Q; ]! I; |1 k5 X! Y
$serv->start();9 n% V: O' }$ k% [
4 }3 z1 T/ o3 X8 `

复制代码

主播客户端

<!doctype html># i4 O1 ?( g: v6 D, E
<html>
! N0 R3 @$ h- w+ l; I. \
<head>
" o) J I, _. _: `" T& ]& K& n
<meta charset="utf-8">' K* C% M0 j R
4 G) N/ W, ]0 O
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
$ p3 T: v; q5 k
<title>404</title>
. [* j2 O: z# g9 ?. V
<style>3 o2 Z' |9 u* c) j, T
body{
3 O# a6 K Y" [" k
background-color:#444;$ N6 O+ T& v8 j' W5 ^0 u
font-size:14px;
0 H( g( \4 N4 f9 O3 F& D
}
; Q7 s- ~4 D; Z$ F# N
h3{, A! }1 J3 L3 i2 K d
font-size:60px;
8 J9 C4 V7 C; s( q/ t" S: j0 A
color:#eee;8 E; D+ m9 L9 d, W+ q
text-align:center;
5 G/ A& T9 h7 r: {
padding-top:30px;* B2 L# Q. k6 {* q8 u$ N2 r
font-weight:normal;
# C+ j# W9 z7 h- t v
}
. ?3 L0 u/ o$ K6 D0 \' y
</style>) t1 {7 w: L9 |7 R
</head>
. `0 q! I2 P! Z* \: }
3 Y# j, B% P1 T" q
<body>5 [) T& s- e4 {( J9 S" i
<video src="test.mp4" width="400" id="video" autoplay="true" controls="true"></video>7 L4 e& b" o: N( X) H' Y: D
<canvas width="400" id="canvas" height="400" style="display:none"></canvas>& U k2 m& j q/ {
<canvas width="400" id="canvas2" height="400" ></canvas>
4 W/ w( O" D) v1 V' [
<script>/ C/ m; i. T- M
var video=document.getElementById('video');
2 X3 L5 t1 d, s
var canvas=document.getElementById('canvas');
" I1 ]5 [5 u# S x& I/ R
var canvas2=document.getElementById('canvas2');3 W, w. X" R9 Q; q
var context=canvas.getContext('2d');
0 Y Y) w2 r$ H: F- ~/ h$ B$ }
var context2=canvas2.getContext('2d');
% d% Q) _' g# a4 U; S, k4 V+ M
function draw(){
; @% e7 @0 v6 |& `# {
context.drawImage(video,0,0,400,400);* L x, k/ b1 f0 `& D$ k# v; h" s
ws.send(canvas.toDataURL('image/jpeg',0.8));" C# j/ r: B& t9 m7 s6 |; M
setTimeout(draw,800);. d! c8 Q5 o9 P6 G Z) b5 z
}
# g; K5 u2 l: h- {' Q& N
. `, N/ l* k! p2 A
//客户端跟服务端通讯7 E! z2 e% A# P* }
if (window.MozWebSocket). h1 c) R9 B& r& z: S, `2 Y! ~( [
{
- c& C5 h6 ^1 _' O6 c; ?) Q
ws = new MozWebSocket("ws://182.61.42.187:9501");: U+ Q0 D$ y6 y- [) [4 ~7 f" o; A
} else
2 C/ ?3 k: ?7 [* n" s$ m4 ^
{$ P' e- n! J" m; y8 G# J
ws = new WebSocket("ws://182.61.42.187:9501");+ e' ^( M+ M5 u* f
}
/ t: G: D d! D# f9 F- g4 m. y
/ ?( t- Q9 H# C+ a6 a: d5 w
ws.onopen=function(event){
) K. X4 p- q& [4 M& i
alert('连接成功');6 a" g7 h1 f. t: I' y" d7 ]) @% k
ws.binaryType = 'arraybuffer';1 a; e6 I/ R; D _* C
draw();
+ P. Z1 n" }# g, m5 i2 L/ N
}
8 s1 i2 c# j+ Q/ P/ Y
ws.onmessage=function(event){: _2 ^/ N Y |. }
//alert(event.data);
: @' F# n9 q$ l( f9 o
//ws.send(event.data+"client");
+ h* _% N& t" h1 l% P
qrCodeImg = new Image();
( |- s: n+ p5 B; _* _! s
qrCodeImg.src = event.data;
7 o" w% {" n: {; x* g# Y
context2.drawImage(qrCodeImg, 0, 0, 400, 400);
/ v# J6 w, h+ d1 L3 w5 `/ Q( f
! K7 d) E [ d4 V F9 Q6 u# t
}! Y/ x- `2 @/ b6 I
ws.onclose=function(event){
7 N0 p8 r$ z* H6 I
alert('close');7 g/ f3 p9 J( G ?7 i
}' x. W' ~3 _( \: Q0 l) r
ws.onerror=function(event){7 C, s+ `0 x& D9 {, I6 t
alert('error');& u8 B" a2 |4 r, |' N* Q
}9 y/ D; T; C- G F+ V0 n/ M
//video，标签模拟视频
+ n# _) d) E1 V2 K' w
: F7 S3 S& K# D% F5 S4 V" ?4 P& C
</script>' F, Z1 `3 D" z0 m7 E% P
</body>2 g0 e! i& x8 R% b! @. E
</html> ~3 e6 B, ]' g
3 B# i8 \" `4 o& S* j% y

复制代码

客户端：

<html>0 ~6 y) O2 R- {7 p8 C8 S
<head>
3 M$ e j8 J6 M) ?1 P: u1 S
<meta http-equiv="content-type" content="text/html; charset=utf-8">
( \. V7 j% S4 B8 {* D. a! `- x n
<title>客户端直播页面</title>0 T1 r6 d1 l' p Q) w
</head># N9 z" n+ ?1 X2 f, @
<body>
$ B! I5 t* ~, O5 D4 r
<img id="receiver" style="width:720px;height:480px">+ [" F C' c2 B- _
0 n; c5 l+ z1 Q$ f# z, B
<script type="text/javascript" charset="utf-8">) j# E2 J) a3 G
var receiver_socket = new WebSocket("ws://182.61.42.187:9501");9 n! |6 f7 S/ L* L) r% u" v4 c- k+ R
var image = document.getElementById('receiver');
: o* J( g: ]: H6 J/ g
receiver_socket.onmessage = function(data) {
/ t) E# d2 A% p1 q+ V, {
console.log(data.data);
t& C0 w) F$ q: R
image.src = data.data;
/ h8 M5 S- d9 ~
}
6 b" I5 \* `# l8 J& T5 p
</script>" K$ O* M0 B! A! X1 W8 k
</body>/ }8 e7 Y6 {& j0 g$ C( W
</html>6 M: i8 F8 a8 O) g2 I& f* a
3 J) W+ j) y8 @" y

复制代码

帐号		自动登录	找回密码
密码			立即注册

[swoole] swoole视频直播（记录用未测试）

浏览过的版块

[swoole] swoole视频直播（记录用 未测试）

浏览过的版块

[swoole] swoole视频直播（记录用未测试）