管理员
论坛积分
分
威望 点
贡献值 个
金币 枚
|
主要使用 webstocket2 R0 Q6 O7 ?$ U/ ?# V
上代码 前端 观看页面 - <script type="text/javascript">
; S: l; S9 f5 C2 V3 Q( c; B2 v$ n - var ws = new WebSocket('ws://192.168.0.150:9502'); D0 ?# i4 R( D* M. @1 [+ e
- $ P1 Q! L% O0 ^$ t N$ Q
- ws.onopen = function() {
5 A+ I! |* n! J+ q. T- ^) u H% e - console.log("连接成功");7 b* ~) S% ?0 T* R1 N
- };5 d% |5 J2 H6 H5 P! L! E
- ws.onmessage = function(e) {
* R* O# ^+ \2 v3 B$ Z1 W - console.log(e);
- ~$ e, q& I/ n* C2 y# [' a - : I3 I a" b$ I4 ^4 Q
- var data = e.data;7 A8 S4 A8 s1 C3 s9 @
- document.getElementById('player').src=data;
/ [3 B( \; z F; C* _ - };
( I. P0 Q( o" ? - ws.onerror = function() {
3 a1 j4 `. ^- H - console.log("关闭连接");/ S p7 u! Y' \0 |( r8 Z: m: A
- };7 k7 e3 K' y: e3 D0 _) e, m7 `6 p' S
- </script>
复制代码录像页面
- J1 A, O7 ]1 ^" x9 x最好用火狐测试。 - <canvas id="output" style="display:none"></canvas>
8 T0 ]2 e N# P$ _0 k
" ]( H7 J; ]% o! y+ n" T- 6 ]" O* j1 ` r$ t# g
$ V' D1 H5 d9 L) R+ a' V; ?/ i- <script type="text/javascript" charset="utf-8">
* @6 O. e! S$ T e0 f' u9 |3 P - : Y9 Y5 L/ @, t/ z4 k" O
- 6 l7 l* v+ Z" B: t2 l1 a# t; a
- var socket = new WebSocket('ws://192.168.0.150:9502');
6 G8 _4 u+ E9 R9 S( g' [ - //socket.send("嗨我登陆了");
9 G: e8 ?5 I' Z3 J6 J8 @( t
) j: u* v |) S# D8 [" J* b4 F- var back = document.getElementById('output');8 f" ~. e# Z' ~; c9 M; s
- var backcontext = back.getContext('2d');# n9 Z7 r8 Q# v& U
- var video = document.getElementsByTagName('video')[0];) e! m0 i; t: e$ z' `
- ( p9 @9 g4 z" @6 k$ P% ^ j
- var success = function(stream){
. E2 _- w6 Z, _. c* | - video.src = window.URL.createObjectURL(stream);; g: S. j# s2 m% m& t: b/ V
- }' t5 \9 z( z6 \
- u7 q5 b) J: P3 I4 h- socket.onopen = function(){+ @8 o$ F" L9 V: i, \3 E0 G" E/ q, b# |! x
- draw();
0 r) M* S5 V3 I6 g( y& w" m R - }' v+ y/ z2 Y( g2 F0 N7 l k
- " O3 V, ?# o& W: ^# [& ~
- var draw = function(){7 x7 @& K/ f' |, D7 g, W; L- d* v8 P
- try{
8 z% V, a% V) W; X - backcontext.drawImage(video,0,0, back.width, back.height); z1 U2 {! J* c6 T2 v/ x; O5 e
- }catch(e){
6 T6 r0 E" c- n" V - if (e.name == "NS_ERROR_NOT_AVAILABLE") {
8 B4 w: a! b4 o5 t$ u - return setTimeout(draw, 100);9 P6 n: e9 c4 J; o p# m5 v3 i
- } else {
+ c" r# a- e$ R% ~. v% { - throw e;1 e: g2 O# n1 \$ N
- }
$ J' j4 m6 F9 g) \. ?1 b& X, n - }
6 |, v4 x% a# G' F) }5 x- T* e - if(video.src){4 t5 v+ `; ?0 D0 o( v% q
- socket.send(back.toDataURL("image/jpeg", 0.5));
! Y, E) P* @5 H9 Q8 p( x% m: y - }0 X! y' n$ x3 e# Q, m* W
- setTimeout(draw, 100);
6 K8 u. P2 b" D1 F# ~ - }
( K+ W% L# L/ t9 X- C) w - navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia ||
; v- Y; w2 l& d' _ - navigator.mozGetUserMedia || navigator.msGetUserMedia;
: @* H1 O0 z2 |5 O - navigator.getUserMedia({video:true, audio:false}, success, console.log);
* y. v; G$ s8 K* z - </script>
复制代码- php- H1 o4 _0 }7 e+ k. ^# u* W8 H* V
- : h+ V# A, o! \( z( d
- $server = new swoole_websocket_server("0.0.0.0", 9502);
5 r) i6 w. Y8 c" ~, k+ ^( B1 W
) X5 `# A/ [4 [# W- $server->on('open', function (swoole_websocket_server $server, $request) {
9 M- i3 r4 @6 @' l4 {) V" T3 E
1 N* C: Z6 a$ ~! Q- echo "新用户id:{$request->fd}加入了\n";
5 ^! d) N1 N% x* r( w - // echo "server: handshake success with fd{$request->fd}\n";" r5 Q$ Y _5 W& N' F
- });
* [) _: |+ d/ u2 t: W+ F0 T - " i" C5 f1 D3 |5 `7 Z* o
- $server->on('message', function (swoole_websocket_server $server, $frame) {
: X3 h8 r9 T! q9 R& ` - 4 d* p. Q% K* z" x% l
- //循环所有数据
, L4 Z$ i( Z6 X# c - foreach($server->connections as $fd) {
( [. [ j2 K; }7 _6 \7 P1 l' |6 F - //返回数据% |' R! c1 {$ a% V4 U* R4 \
- $server->push($fd, $frame->data);
* i- n+ E+ Z0 ]0 _/ u - }9 R3 {8 d7 ]/ n7 F
+ j9 y" k6 o' p" t3 q- });9 C# x) v5 C; Y
. ~3 k! D9 f3 g# M% D- $server->on('close', function ($ser, $fd) {
7 U* ]$ n: K1 Y9 j3 f - echo "用户id: {$fd} 退出\n";# [9 h* `0 J" N7 l: g6 Y8 V8 x
- });) W6 R$ |' M8 t/ M" O
$ t5 u0 P) p& x4 i- $server->start();
复制代码
; y( k3 R3 B2 F, {- G9 {3 Z( M6 ~! N; ~; {0 F" T
' a; ~0 y: `8 P# S2 [) R
8 v1 i( R2 ?% B U5 I# _: t( t, U! l0 [. m6 E
: A4 {, Z! o t E+ Z/ }1 I
" }; F0 ~3 n2 ]! N( t& t: x1 j- |
, i0 N! N# l9 T5 g9 i; M A, A' J
! h/ U( g* x( s; n. C
7 Y+ j& m& J6 o6 G4 A N% D) J2 l) w5 e
* y) Q3 n9 ]- q8 e( V) d
|
|