c# – AngularJS .Net WebAPI上传图像并保存到数据库(MSSQL)

2023年7月4日 215次阅读

我正在尝试从UI上传一个
Image(可以绑定到具有数据类型byte []的模型)并将其保存在数据库中.

我正在使用AngularJS将其连接到.NET WebAPI并将其保存到MSSSQL Server

我无法找到使用这些技术的好例子.

题：
什么方法更好用？像ng-upload,FormData,ArrayBuffer,将图像转换为字节等等,你将如何从WebAPI中捕获它？

谢谢！

最佳答案 这些天我正在研究这个功能.我分享我的经验(显然它可以改进).

我使用的关键组件是：

> angular-file-upload
> .NET ImageResizer：用于缩小原始图像的缩略图(Nathanael Jones的优秀作品)

堆栈是：

Angular.js图像上传器

正如我所说,我使用angular-file-uploader.没有太多可以添加到官方文档中,但my uploader configuration是：

$scope.uploader = $fileUploader.create({
    scope: $scope,
    url: DisciturSettings.apiUrl + 'User/Image',
    queueLimit: 1,
    formData: [{ UserId: AuthService.user.userid }],
    headers: AuthService.getTokenHeader()
});

为了将用户id发送到http请求并授予对授权路由的访问权限

WebApi 2动作

该服务完成了主要工作.这是code.
正如您所看到的,在此阶段,我对传递的图像进行了两次调整(一个用于用户个人资料图片,另一个用于用户缩略图).除此之外,我转换字符串中的byte []并为下一次检索准备字符串.这样做我在前面添加了这个部分“data：image / gif; base64”,所以,在下一个实体读数中(通过EntityFramework)我不再需要操作结果,我可以将它们直接放在角度模板中：

<img ng-src="{{local.user.image}}" />

显然它可以有所不同,但这是我的情况.

数据库

目前我只是使用nvarchar来存储图像.

这是我的第一次尝试,所以它可以肯定地改进(如果你有提示,不要犹豫).

点赞