2012-06-05 2 views
1

Я пытаюсь создать видеопоток, захватывая и конвертируя jpeg-изображения в строку base64, а затем отправляя его с помощью websockets (Nodejs и socket.io) для рисования на холсте HTML5. Это код в C# для захвата экрана и отправить его с помощью SocketIO4Net библиотеки:Быстрая отправка base64 строк через веб-сокеты?

Client directSocket = new Client("http://IPHERE"); 
directSocket.Connect(); 

private void timer1_Tick(object sender, EventArgs e) 
{ 
    Rectangle bounds = Screen.GetBounds(Point.Empty); 
    Bitmap bitmap = new Bitmap(bounds.Width, bounds.Height); 

    using (Graphics g = Graphics.FromImage(bitmap)) 
    { 
     g.CopyFromScreen(Point.Empty, Point.Empty, bounds.Size); 
    } 

    pictureBox1.Image = bitmap; 

    // Convert the pictureBox into a byte[] array 
    System.IO.MemoryStream stream = new System.IO.MemoryStream(); 
    pictureBox1.Image.Save(stream, System.Drawing.Imaging.ImageFormat.Jpeg); 
    byte[] imageBytes = stream.ToArray(); 

    // Convert byte[] to Base64 string 
    string base64String = Convert.ToBase64String(imageBytes); 

    // Send using SocketIO4Net 
    directSocket.Emit("send", new { message = base64String }); 
} 

Это прекрасно работает и base64String отправляется на сервер узла, который излучает его. Это на стороне клиента Javascript код:

var socket = io.connect('IPHERE'); 

socket.on('receive', function (data) { 
    var canvas = document.getElementById('canvas'); 
    var context = canvas.getContext('2d'); 

    var img = new Image(); 
    img.onload = function() { 
     context.drawImage(img, 0, 0, canvas.width, canvas.height); 
    }; 

    img.src = "data:image/jpeg;base64," + data.message.message; 
}); 

Моя проблема заключается в том, что base64String большой и не излучается достаточно быстро для клиента, чтобы получить его и выводить изображение на холсте. Я не уверен, что это мой сервер узлов (это дешевый VPS), или строка слишком велика. Можно ли сжать base64String, а затем отправить его для распаковки при его получении? Или я могу это сделать другим способом? Спасибо за помощь.

ответ

1

Вы можете попробовать сохранить изображение как jpg с более низким качеством. Вы можете использовать переопределение Save, которое принимает параметры кодировщика и энкодера.

+0

Спасибо. Это работает, но я надеялся сохранить качество изображений. Нет ли способа сделать это и отправить его так же быстро? –

+0

Вам придется балансировать скорость с качеством. Вероятно, вы могли бы реализовать некоторые меры для расчета, если вы получаете достаточное количество FPS с сервера, а затем повышаете качество, если соединение достаточно быстро. –

+0

Очень полезно! Попробуем это сегодня! –

0

Если вам нужно только поддерживать современные браузеры, используйте элемент canvas и отправляйте эти данные как необработанные байты. Нажмите данные в элемент холста, используя объект ImageData.

Дополнительную информацию о создании объекта ImageData см. В статье "Pixel manipulation with canvas" MDN.

0

Вчера я тестировал его с помощью C# - to base64 - websocket - соединение с gwt (java script) img-объектом. Я использую его в интрасети, производительность потока хороша. Но если вы проверите это, вы увидите утечку памяти в Firefox. Поскольку Firefox кэширует все изображения. В моем случае 10pics в секунду. Один pic 200kb. Этот слабый я проверяю часть холста.

Смежные вопросы