.NET Core 相当于 Uint8ClampedArray
.NET Core equivalent of Uint8ClampedArray
我正在使用 jpeg_camera 库从笔记本电脑上的网络应用程序获取快照,然后通过提取调用将其发送到我的控制器。
snapshot.get_image_data
returns 一个具有 3 个属性的对象(数据:Uint8ClampedArray,宽度,高度)。
当我执行提取调用时 sendPic(data)
我总是收到 400 错误,因为 ModelState
无效。
这意味着 Byte[]
不适合来自 JS 的 Uint8ClampedArray
。
那个对象的等价物是什么?
我还发现了一种 return base64 的方法,我可以在控制器内部将其转换为 Byte[]
,但我想避免这种解决方案。
JS代码:
function savePic() {
var test1 = snapshot.get_image_data((done) => {
var data = {
"Pic": done.data,
"IdActivity": idActivity,
"Instant": new Date().toISOString()
};
sendPic(data);
});
}
function sendPic(data) {
fetch(uriPicsEndPoint, {
body: JSON.stringify(data),
headers: {
"Content-Type": "application/json; charset=utf-8"
},
credentials: 'include',
method: 'POST'
});
}
API 控制器:
[Authorize]
[HttpPost]
public async Task<IActionResult> SavePic([FromBody] Selfie selfie)
{
if (ModelState.IsValid)
{
try
{
var storageAccount = CloudStorageAccount.Parse(_configuration["ConnectionStrings:Storage"]);
var blobClient = storageAccount.CreateCloudBlobClient();
var camerasContainer = blobClient.GetContainerReference("selfies");
await camerasContainer.CreateIfNotExistsAsync();
var id = Guid.NewGuid();
var fileExtension = ".jpeg";
var blobName = $"{selfie.IdActivity}/{id}{fileExtension}";
var blobRef = camerasContainer.GetBlockBlobReference(blobName);
await blobRef.UploadFromByteArrayAsync(selfie.Pic, 0, selfie.Pic.Length);
string sas = blobRef.GetSharedAccessSignature(
new SharedAccessBlobPolicy()
{
Permissions = SharedAccessBlobPermissions.Read
});
var blobUri = $"{blobRef.Uri.AbsoluteUri}{sas}";
var notification = new UpdateSelfieRequest()
{
UriPic = blobUri,
IdActivity = selfie.IdActivity,
Instant = selfie.Instant
};
string serviceBusConnectionString = _configuration["ConnectionStrings:ServiceBus"];
string queueName = _configuration["ServiceBusQueueName"];
IQueueClient queueClient = new QueueClient(serviceBusConnectionString, queueName);
var messageBody = JsonConvert.SerializeObject(notification);
var message = new Message(Encoding.UTF8.GetBytes(messageBody));
await queueClient.SendAsync(message);
await queueClient.CloseAsync();
return Ok();
}
catch
{
return StatusCode(500);
}
}
else
{
return BadRequest();
}
}
和 CLASS "Selfie":
public class Selfie
{
public Byte[] Pic { get; set; }
public int IdActivity { get; set; }
public DateTime Instant { get; set; }
}
当您使用 stringify 时,它在 JSON 中变为 {"0":255, "1":0, "2":0, "3":255, ...}
。
如果您将操作参数定义为 JObject selfie
,您可以使用 var pic = selfie["Pic"].ToObject<Dictionary<int, byte>>()
.
获取字节
或者您可以 post 数据作为表单值并将操作定义为 SavePic(Dictionary<int, byte> Pic, int IdActivity, DateTime Instant)
在浏览器中使用以下代码进行测试:
var ctx = document.createElement('canvas').getContext('2d');
ctx.fillStyle = 'red';
ctx.fillRect(5, 5, 5, 5);
$.post('SavePic', {
Pic: ctx.getImageData(5, 5, 5, 5).data,
IdActivity: 1,
Instant: new Date().toISOString()
});
然而,在 posting 数据之前将 Uint8ClampedArray 转换为常规数组可能更容易。
我正在使用 jpeg_camera 库从笔记本电脑上的网络应用程序获取快照,然后通过提取调用将其发送到我的控制器。
snapshot.get_image_data
returns 一个具有 3 个属性的对象(数据:Uint8ClampedArray,宽度,高度)。
当我执行提取调用时 sendPic(data)
我总是收到 400 错误,因为 ModelState
无效。
这意味着 Byte[]
不适合来自 JS 的 Uint8ClampedArray
。
那个对象的等价物是什么?
我还发现了一种 return base64 的方法,我可以在控制器内部将其转换为 Byte[]
,但我想避免这种解决方案。
JS代码:
function savePic() {
var test1 = snapshot.get_image_data((done) => {
var data = {
"Pic": done.data,
"IdActivity": idActivity,
"Instant": new Date().toISOString()
};
sendPic(data);
});
}
function sendPic(data) {
fetch(uriPicsEndPoint, {
body: JSON.stringify(data),
headers: {
"Content-Type": "application/json; charset=utf-8"
},
credentials: 'include',
method: 'POST'
});
}
API 控制器:
[Authorize]
[HttpPost]
public async Task<IActionResult> SavePic([FromBody] Selfie selfie)
{
if (ModelState.IsValid)
{
try
{
var storageAccount = CloudStorageAccount.Parse(_configuration["ConnectionStrings:Storage"]);
var blobClient = storageAccount.CreateCloudBlobClient();
var camerasContainer = blobClient.GetContainerReference("selfies");
await camerasContainer.CreateIfNotExistsAsync();
var id = Guid.NewGuid();
var fileExtension = ".jpeg";
var blobName = $"{selfie.IdActivity}/{id}{fileExtension}";
var blobRef = camerasContainer.GetBlockBlobReference(blobName);
await blobRef.UploadFromByteArrayAsync(selfie.Pic, 0, selfie.Pic.Length);
string sas = blobRef.GetSharedAccessSignature(
new SharedAccessBlobPolicy()
{
Permissions = SharedAccessBlobPermissions.Read
});
var blobUri = $"{blobRef.Uri.AbsoluteUri}{sas}";
var notification = new UpdateSelfieRequest()
{
UriPic = blobUri,
IdActivity = selfie.IdActivity,
Instant = selfie.Instant
};
string serviceBusConnectionString = _configuration["ConnectionStrings:ServiceBus"];
string queueName = _configuration["ServiceBusQueueName"];
IQueueClient queueClient = new QueueClient(serviceBusConnectionString, queueName);
var messageBody = JsonConvert.SerializeObject(notification);
var message = new Message(Encoding.UTF8.GetBytes(messageBody));
await queueClient.SendAsync(message);
await queueClient.CloseAsync();
return Ok();
}
catch
{
return StatusCode(500);
}
}
else
{
return BadRequest();
}
}
和 CLASS "Selfie":
public class Selfie
{
public Byte[] Pic { get; set; }
public int IdActivity { get; set; }
public DateTime Instant { get; set; }
}
当您使用 stringify 时,它在 JSON 中变为 {"0":255, "1":0, "2":0, "3":255, ...}
。
如果您将操作参数定义为 JObject selfie
,您可以使用 var pic = selfie["Pic"].ToObject<Dictionary<int, byte>>()
.
或者您可以 post 数据作为表单值并将操作定义为 SavePic(Dictionary<int, byte> Pic, int IdActivity, DateTime Instant)
在浏览器中使用以下代码进行测试:
var ctx = document.createElement('canvas').getContext('2d');
ctx.fillStyle = 'red';
ctx.fillRect(5, 5, 5, 5);
$.post('SavePic', {
Pic: ctx.getImageData(5, 5, 5, 5).data,
IdActivity: 1,
Instant: new Date().toISOString()
});
然而,在 posting 数据之前将 Uint8ClampedArray 转换为常规数组可能更容易。