管理员
   
论坛积分
分
威望 点
贡献值 个
金币 枚
|
|
主要使用 webstocket1 g- s6 e' {6 ?1 M6 u1 ]& Q8 ~! ]
上代码 前端 观看页面 - <script type="text/javascript">
+ ~0 `- v3 S7 R3 v+ O/ [ - var ws = new WebSocket('ws://192.168.0.150:9502');
( `5 c, R: {, j' Q4 Q - - s7 W0 J5 Q* X! U) w: D$ A
- ws.onopen = function() {4 T0 |2 `) r3 i4 r7 s5 m, B( l, e
- console.log("连接成功");3 d- M2 N3 D9 ]# V' E7 K" T# c7 K. O
- };
, S/ y# ~( Y9 P" h6 [7 K - ws.onmessage = function(e) {& Y/ M; c+ W% ?' {. p1 F1 V0 K9 Q
- console.log(e);
l1 l# P+ z: `. k; a
; m' l2 z! n' \6 @/ Z- var data = e.data;
( X, }& A" y _3 _/ N' s6 C - document.getElementById('player').src=data;# ^/ d0 M2 P# ?
- };4 a, o: W* J, [
- ws.onerror = function() { {3 M6 z. `/ I4 d
- console.log("关闭连接");
) P' ~2 Y5 M7 Z' B3 s- A& c - };9 o. H. g0 g: B2 ?' w: m
- </script>
复制代码录像页面 $ l9 [! j0 O" i) L
最好用火狐测试。 - <canvas id="output" style="display:none"></canvas>
2 I2 U" |( B$ l5 { - : n1 b: c8 V M& G
- * b$ ?8 \7 y" I! k2 o* Y
9 _7 l$ K4 r7 `( i" ~$ j* O* j- <script type="text/javascript" charset="utf-8">+ C$ q& a5 B" ^7 O5 b4 h# Q5 o' y6 H& W
" p8 y9 O& {- m-
0 t# A1 o$ y$ q1 g; Y - var socket = new WebSocket('ws://192.168.0.150:9502');
; d( Z+ K5 I$ E' U% y# g: C+ t - //socket.send("嗨我登陆了");
" O: T( H+ ], Z4 T" |
2 K6 u' Y6 y9 {6 r2 k- C0 y- var back = document.getElementById('output');$ o, y' Y7 n" W8 K* t z) [7 c# D
- var backcontext = back.getContext('2d');5 A+ p+ T) x$ p7 B
- var video = document.getElementsByTagName('video')[0];
2 j. S) w( j) S' @ -
: C8 ~$ A, ^2 T* ]+ a! O - var success = function(stream){
9 x) \! i5 J S4 h - video.src = window.URL.createObjectURL(stream);
- e1 j2 v/ y% O) w - }
4 D0 ]$ O: c. a* w( T- ^
& j( R+ C# W) x m2 G- socket.onopen = function(){; j A9 \" x3 y; j* [/ w8 W
- draw();
1 F. H5 O' e1 s' i: ]- ~6 N - }, U& y% p. G# B( Y' Z
' F2 D& t3 ]' g0 E; X% y! C+ w, b/ `- var draw = function(){( X3 n" G3 Y( M) U
- try{
( w: o4 T+ Q# X) N! J3 W: X0 T - backcontext.drawImage(video,0,0, back.width, back.height);
* l( b! N& q# `) i - }catch(e){
: S6 ^! f! ~% b0 W - if (e.name == "NS_ERROR_NOT_AVAILABLE") {
4 L2 c, m5 j% w - return setTimeout(draw, 100);) E! l4 G% ]7 T% C6 C2 N4 q( S
- } else {
0 Y# k T6 b0 k# D" X! _ - throw e;8 Z5 D3 b. q( D$ W6 {
- }
. M& n- f2 S* N0 }- k- N% D, K: R - }
3 C2 d" O W, a! { - if(video.src){2 u V5 l$ P, S% j" `7 l
- socket.send(back.toDataURL("image/jpeg", 0.5));
- q3 l$ H l3 v1 _; a - }
$ z+ _! T; l& a% b9 { - setTimeout(draw, 100);
3 D i: {3 j& v' p( U, w/ D0 r - }
: s. f; P+ {: [' m4 a8 u/ Z( q7 x) r - navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia ||9 D* \# c( f7 h6 `/ k- k
- navigator.mozGetUserMedia || navigator.msGetUserMedia;
: k( u' b7 e2 |/ T6 |# E, r% J - navigator.getUserMedia({video:true, audio:false}, success, console.log);
; V2 I: r2 k& W) u9 ` - </script>
复制代码- php
5 k- [$ k7 w7 o* @+ u
, |$ T) @& V! P/ J! x/ |4 F& @4 A- $server = new swoole_websocket_server("0.0.0.0", 9502);
: T) f9 s$ C' N; Q7 E) l - * H0 C6 O! H2 H' l$ A& f
- $server->on('open', function (swoole_websocket_server $server, $request) {- s1 O$ z9 q* ]- C
- ' _* I+ B3 N& a2 x0 c) F! u* H1 d8 Y
- echo "新用户id:{$request->fd}加入了\n";
o6 X/ i. N( s3 Y - // echo "server: handshake success with fd{$request->fd}\n";
# w3 }6 l, [: n" o" n3 j K - });* b! P7 Z5 o0 _; G- i
1 |1 l. y2 E: y& A y, u6 P3 H- $server->on('message', function (swoole_websocket_server $server, $frame) {9 E" B+ m ?# k3 a+ [
' J% I& I+ |5 \2 A' ~/ J3 l- //循环所有数据/ w% j/ m) D t4 y. U, s/ I6 a
- foreach($server->connections as $fd) {; J" V, `5 I, _$ A
- //返回数据
7 z$ n" b2 I: S6 ]6 ~( o - $server->push($fd, $frame->data);
$ c' b: V. }$ f: I - }0 x2 @" o/ d' C& x
- ' U5 H/ W# G$ V+ @! W; z
- });
1 O$ ^: t' e0 p' J2 J7 |0 Z
, D* S! P% q6 a" h* H$ Y- $server->on('close', function ($ser, $fd) {5 @+ \2 k- I1 b$ @; }
- echo "用户id: {$fd} 退出\n";$ ?& u. C- L6 x3 D y
- });
, y4 p5 Q- j5 g
m9 Q1 p/ o1 w! y: \- $server->start();
复制代码 # q3 Q! x8 }# E, J0 ~
; \0 r+ G) t1 e! Q( Z
( M6 j8 T5 j/ b! J- l1 q2 r1 ~* G5 E( c
/ e* O& m6 k5 J9 i* L" C3 H
) [1 S, w! P+ F! G6 I( {) ]% v9 ~4 t3 e! \5 h
0 W# A) `3 ^1 h: }. j1 @
' S0 i9 N, b0 i) w
p) d4 y$ m3 e( B- p
( T7 M+ c5 H0 A" D/ K2 N/ s2 c) b$ T: U$ C+ R7 y
|
|