发新帖

[C#/ASP.NET] 用C#调用摄像头并在浏览器上实时显示图像

零下一度 2023-4-6 999

引用OpenCV库:在Visual Studio中创建一个新的C#项目,然后在项目中添加OpenCV库的引用。可以通过NuGet包管理器来安装OpenCV库。

初始化摄像头:使用OpenCV库中的VideoCapture类来初始化摄像头。可以使用摄像头的索引号或视频文件的路径来初始化摄像头。

读取摄像头帧:使用VideoCapture类的read()方法来读取摄像头帧。该方法返回一个Mat对象,其中包含摄像头帧的像素数据。

将帧转换为图像:使用OpenCV库中的MatToBitmap()方法将Mat对象转换为Bitmap对象。Bitmap对象可以在C#中直接使用。

在浏览器上显示图像:将Bitmap对象转换为Base64编码的字符串,并将其传递给前端页面。在前端页面上,可以使用JavaScript将Base64编码的字符串转换为图像并显示在页面上。

以下是一个简单的示例代码,用于调用摄像头并在浏览器上实时显示图像:


using System;
using System.Drawing;
using System.IO;
using System.Threading.Tasks;
using System.Web;
using System.Web.Mvc;
using OpenCvSharp;
namespace CameraCapture.Controllers
{
    public class CameraController : Controller
    {
        private Camera _camera;
        public CameraController()
        {
            _camera = new Camera(0); // use the first camera
        }
        public async Task<ActionResult> GetFrame()
        {
            var base64 = await _camera.GetFrameAsync();
            return Content(base64);
        }
    }
    public class Camera
    {
        private VideoCapture _capture;
        private Mat _frame;
        public Camera(int index)
        {
            _capture = new VideoCapture(index);
            _frame = new Mat();
        }
        public async Task<string> GetFrameAsync()
        {
            await Task.Run(() =>
            {
                _capture.Read(_frame);
            });
            var bitmap = _frame.ToBitmap();
            var base64 = BitmapToBase64(bitmap);
            return base64;
        }
        private string BitmapToBase64(Bitmap bitmap)
        {
            using (var stream = new MemoryStream())
            {
                bitmap.Save(stream, System.Drawing.Imaging.ImageFormat.Jpeg);
                var bytes = stream.ToArray();
                return Convert.ToBase64String(bytes);
            }
        }
    }
}


在前端页面上,可以使用以下JavaScript代码将Base64编码的字符串转换为图像并显示在页面上:

function updateImage(base64) {
    var img = document.getElementById('camera-image');
    img.src = 'data:image/jpeg;base64,' + base64;
}
function getFrame() {
    $.ajax({
        url: '/Camera/GetFrame',
        type: 'GET',
        success: function (data) {
            updateImage(data);
            setTimeout(getFrame, 1000 / 30); // 30 fps
        },
        error: function () {
            setTimeout(getFrame, 1000);
        }
    });
}
$(function () {
    getFrame();
});


在上面的代码中,updateImage()函数用于更新图像,getFrame()函数用于定期从服务器获取摄像头帧,并将其显示在页面上。在这个例子中,服务器端的GetFrame()方法返回Base64编码的字符串。








最新回复 (0)
返回
零下一度
主题数
931
帖子数
0
注册排名
1