0
私のページでビデオが再生されていて、フレームをキャプチャしてwebsocketを通してサーバーに送信しようとしています。WebSocket変数が定義されていないというエラーが発生しました
私はwebsocketハンドシェイクを成功させて正常にサーバーとの接続を確立しました。
は、しかし、私は私のpostVideoToServer()機能で次のエラーを取得する：
"TypeError: clientSocket is undefined" index.html:60:5
clientsocketが実際にクライアントがサーバーとの通信に使用するソケットです。私はすでにclientSocket.onopenにこの変数を使用して、サーバーにデータを正常に送信しました。
私はいくつかの調査を行い、値が期待されるタイプではないことを知っていました。それはまだ私には意味をなさない。どんな説明も感謝します。
ここに私のjsコードの一部です。もっと必要なら、教えてください。
var bStop = true;
var bOldBrowser = false;
var video;
var streamRecorder;
var webcamstream;
var clientSocket;
function postVideoToServer(clientSocket,frame)
{
clientSocket.send(frame);
}
function draw(v, cc, w, h, c, clientSocket)
{
cc.drawImage(v, 0, 0, w, h); //draw video frame on canvas
var frameData =c.toDataURL(); //turn canvas to raw png format
postVideoToServer(clientSocket,frameData);
if(!bStop)
setTimeout(function() { draw(v, cc, w, h, c, clientSocket) }, 40); //40 * 25 = 1000 ==> draw canvas every 40 ms to have 25FPS
}
function startRecording(video, clientSocket)
{
video = document.querySelector('video');
var canvas = document.getElementById('canvas');
var canvasContext = canvas.getContext('2d');
var width = video.videoWidth;
var height = video.videoHeight;
canvas.width = width;
canvas.height = height;
bStop = false;
//establish connection with server
establishSocketConnection(clientSocket,"ws://localhost:3000/web/project/Server.php");
draw(video, canvasContext, width, height, canvas, clientSocket)
}
function establishSocketConnection(clientSocket,URL)
{
clientSocket = new WebSocket(URL); //create socket to server
clientSocket.onopen = function (e)
{
console.log("socket open");
}
clientSocket.onclose = function (e)
{
console.log("Socket connection closed : "+e);
}
clientSocket.onerror = function(error)
{
alert("Failed to connect to server...Please try again later.");
};
}
私はあなたがすべての関数からclientSocketパラメータを削除し、単にグローバル変数を使用するneeed
<button onclick="startRecording(video)" class="recordbutton">Turn camera on</button>