我对 C#/Asp.net/Razor HTML 的经验很少。我正在尝试将网络应用程序上的网络摄像头功能从使用旧的 jQuery 网络摄像头(带 Flash)项目更改为 jhuckaby/webcamjs(在 Github 上)项目。我认为现在的问题是 base64 图像保存不正确。我在下面的代码中看到了一些关于 String_To_Bytes2 的内容。这到底是做什么的,您对我如何调整它以从 JavaScript 端获取输入的 base64 图像数据保存在目录文件夹中是否有任何想法?
C#:
public ActionResult Capture(int id)
{
var uniqueFileName = id + ".png";
var uploads = Path.Combine(hostingEnvironment.WebRootPath, "images/photos/");
var path = Path.Combine(uploads, uniqueFileName);
var stream = Request.Body;
string dump;
using (var reader = new StreamReader(stream))
dump = reader.ReadToEnd();
if (System.IO.File.Exists(path))
{
System.IO.File.Delete(path);
System.IO.File.WriteAllBytes(path, String_To_Bytes2(dump));
}
else System.IO.File.WriteAllBytes(path, String_To_Bytes2(dump));
return RedirectToAction("ServiceHistory", new { Id = id });
}
private byte[] String_To_Bytes2(string strInput)
{
int numBytes = (strInput.Length) / 2;
byte[] bytes = new byte[numBytes];
for (int x = 0; x < numBytes; ++x)
{
bytes[x] = Convert.ToByte(strInput.Substring(x * 2, 2), 16);
}
return bytes;
}
JavaScript(带有一点 Razor HTML)
<script>
Webcam.set({
width: 320,
height: 240,
image_format: 'jpeg',
//enable_flash: false,
jpeg_quality: 80
});
Webcam.attach('#Camera');
</script>
<script>
function configure() {
Webcam.set({
width: 320,
height: 240,
image_format: 'jpeg',
//enable_flash: false,
jpeg_quality: 80
});
Webcam.attach('#Camera');
}
// preload shutter audio clip
var shutter = new Audio();
shutter.autoplay = false;
shutter.src = navigator.userAgent.match(/Firefox/) ? '@Url.Content("~/shutter.ogg")' : '@Url.Content("~/shutter.mp3")';
function take_snapshot() {
// play sound effect
shutter.play();
// take snapshot and get image data
Webcam.snap(function (data_uri) {
// display results in page
document.querySelector('#Camera').innerHTML =
'<img id="imageprev" src="' + data_uri + '"/>';
});
//Webcam.reset();
}
function saveSnap() {
// Get base64 value from <img id='imageprev'> source
var base64image = document.getElementById("imageprev").src;
Webcam.upload(base64image, '@Url.Action("Capture", "Guest", new { Id = @Model.Id })', function (code, text) {
console.log('Save successfully');
console.log('The server responded with a' +' '+ code);
// document.querySelector('#save-btn').style.border = "4px solid green";
configure();
});
}
</script>
任何想法或解释将不胜感激。我是一个菜鸟,我觉得我离让它工作很近了。到目前为止,我已经测试过了,我可以使用 console.log 将 base64 图像数据发送到控制台,它确实会生成图像。它还在文件夹目录中保存了一个 PNG 文件,但它是 0kb,所以我认为 C# 方面有些不对劲。
再一次,任何帮助都将是惊人的!如果您需要更多信息,请与我们联系。