0
我有一个视频在我的页面中播放,我试图捕获帧并通过websocket将它们发送到服务器。得到一个类型错误,说我的websocket变量是undefined
我已经成功建立了与服务器的连接,并且还完成了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.");
};
}
当我点击以下
<button onclick="startRecording(video)" class="recordbutton">Turn camera on</button>