管理员
论坛积分
分
威望 点
贡献值 个
金币 枚
|
主要使用 webstocket9 D' P1 n' c( w A/ n) M: R
上代码 前端 观看页面 - <script type="text/javascript">
( e% I3 ^) E% j - var ws = new WebSocket('ws://192.168.0.150:9502');
% \0 ?$ `: \1 n5 M b/ u - ) f8 J/ V2 R9 ~3 ^
- ws.onopen = function() {+ J5 D* v/ D& P( q# j& a+ J
- console.log("连接成功");' U g! T# v: ]/ h4 V# W
- }; a. ^/ J+ s2 w0 [/ b4 f4 C
- ws.onmessage = function(e) {
; x/ V/ k+ O( p# d0 j7 I2 S+ K, ~ - console.log(e);
! h, ]% m5 T2 W& t# l; _& h - & ~9 `& {6 }/ `8 m6 ~
- var data = e.data;% Z! k/ Q- \) [8 G6 v
- document.getElementById('player').src=data;/ J6 a2 }2 K9 `+ K+ [' @9 U
- };$ N" U$ y& F! x: Y4 X
- ws.onerror = function() {$ ?' w7 K) _+ R0 e' q* ~
- console.log("关闭连接");) O6 Z( W3 r- W8 U, x) A: q5 ]9 L
- };) j9 e1 r$ c2 g' Y
- </script>
复制代码录像页面 6 a) }6 K K( l5 r. @- D& d
最好用火狐测试。 - <canvas id="output" style="display:none"></canvas>
# [+ w) _ Z8 d. V
+ [% J% y2 a- r: w% w. {1 D4 A. o
7 F# `0 q% g* `$ }' r- " U: Q, _ \, k/ H, O2 V
- <script type="text/javascript" charset="utf-8">, x- f0 h* y5 t2 X
9 p6 ^# M. ^- Y4 X) A+ b$ W4 y2 O3 u- . V9 D: |; Z+ X, d8 b0 ^. ^
- var socket = new WebSocket('ws://192.168.0.150:9502');
7 u1 Z8 k& y+ p3 D( e; L' r# \ - //socket.send("嗨我登陆了");/ b- q# L. q: c3 U+ F9 a& P! c
- 1 z$ ?6 ^9 M ?0 L; v
- var back = document.getElementById('output');$ y: [# G& \. k) [8 d1 l
- var backcontext = back.getContext('2d');
+ h* ]- e7 S. |' o7 s- v5 \9 g - var video = document.getElementsByTagName('video')[0];+ n+ E. c1 {6 m6 h# g0 f( X: |
-
) _; G! i/ V- N' `3 ] - var success = function(stream){/ b: B9 k& i5 P! g' u5 E) W5 X
- video.src = window.URL.createObjectURL(stream);( I+ p* Q$ m+ y% B3 {5 A
- }
% u! Q( x8 w8 R8 Z. Y
5 k; Y+ J3 M. r0 ?1 w8 C* E- socket.onopen = function(){# E( g6 X& e" k! C0 w
- draw();
" ?; ^2 x/ a" r* w% |+ z2 q n - }/ F# }0 U3 {2 R( X
# ?) z; V" ~- I0 d- var draw = function(){
# ~6 i( y3 b" W, w" Q - try{, w+ D# \& _# b9 ?
- backcontext.drawImage(video,0,0, back.width, back.height);: J- x5 v1 `0 x# K. j5 j# X
- }catch(e){
3 d9 c5 R3 B( M2 O8 ?: J/ {3 F* h5 m - if (e.name == "NS_ERROR_NOT_AVAILABLE") {) |( T( R, t3 R; K5 ?2 }2 y( ~
- return setTimeout(draw, 100);! R, X* A# P2 j# ]0 M& a
- } else {, @; E, a6 A7 U- U1 T0 z' N$ O
- throw e;
- g5 U1 L) s& u( C, W - }
- Q0 B* Q1 W; z0 U: z) W* R - }/ [' P0 B& e" t+ x4 i" @$ v
- if(video.src){
+ k6 _ c/ b0 [ - socket.send(back.toDataURL("image/jpeg", 0.5));
~! s6 g0 f# r! K8 i4 _5 l - }, s4 e, Y% Q/ ?2 u$ }
- setTimeout(draw, 100);8 W6 Z* l8 x, `% z0 j4 w
- }! R9 B, k3 F6 p* `
- navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia ||( a$ W% d& Z5 W! `* ]- u: T
- navigator.mozGetUserMedia || navigator.msGetUserMedia;* H% b3 ?2 {! h9 D) W1 ^- [# X' W% Z$ l
- navigator.getUserMedia({video:true, audio:false}, success, console.log);; ~/ ]4 c/ b U% c: U3 ~
- </script>
复制代码- php
' L% c7 P$ }4 s
3 u3 _2 c7 E* ~- $server = new swoole_websocket_server("0.0.0.0", 9502);5 X$ E- K9 n1 P& g- [0 N; g
( S! ?+ [3 T* r) r& z- $server->on('open', function (swoole_websocket_server $server, $request) {1 e+ y! B- Q1 g0 W/ I, |
- $ H. X/ p- s" V- G
- echo "新用户id:{$request->fd}加入了\n";
+ f0 R1 ]% g; @+ m3 X, Q - // echo "server: handshake success with fd{$request->fd}\n";
2 U% n9 `( l/ G8 V: P' { - });. ^! Q0 e' }$ @3 t1 [/ d+ U2 t
- o1 i( K, q- r P- $server->on('message', function (swoole_websocket_server $server, $frame) {
! ^+ @/ W, ^" o- w: a9 L
1 F) b# y7 c6 O5 ~- a9 h6 y- //循环所有数据
: {6 ]5 h7 ?5 N- y - foreach($server->connections as $fd) {
$ y+ M3 {) v' z+ u, f z. B - //返回数据
% u3 C6 [# }* [9 K5 I) } - $server->push($fd, $frame->data);! X& C8 l& ]2 I# _6 e
- }
3 o- B |' b9 W; L# }
' d' v, B5 C: s. W( O+ I2 A- });
+ {! Z& F/ @# j% j - # U7 H, X3 O% G" u1 X% e) E
- $server->on('close', function ($ser, $fd) {
- x3 m) ~1 x( E8 k4 F" Z' s - echo "用户id: {$fd} 退出\n";+ o, n9 g+ }* q: p! m7 E: }
- });3 Z9 u$ i4 G1 y. ^: y* P/ q2 @
- t0 P+ L, Y9 d6 A& ]- $server->start();
复制代码 7 ?6 m' Q3 d7 {! V. O: m2 B# p( q
/ H& |8 T$ Y9 I8 N3 I7 A6 Z7 R. H l2 h% s8 [- L) x: n9 U
6 Q1 u8 `& ~/ a8 W
$ s4 b1 ?5 ^2 p6 M
8 e0 W$ F W7 m
- }) ~% e* w8 I( Z$ I! J7 @$ _( _+ Y6 C! u( h5 i( S h8 {4 }0 w0 _2 c
: [% c; D- x/ @% w! c( w. ?4 C) C( w: [8 V K$ l
5 w& F( e0 p% H) @; ~1 O7 t. H
1 }; n* m# U$ Q% x% w |
|