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

Question

我正在尝试从 UI 上传图像(可以绑定(bind)到数据类型为 byte[] 的模型)并将其保存在数据库中。我正在使用 AngularJS 将其连接到 .NET WebAPI 并将其保存到 MSSSQL Server我找不到使用这些技术的好例子。

问题:哪种方法更好用？例如 ng-upload、FormData、ArrayBuffer、将图像转换为字节等，您将如何从 WebAPI 捕获它？

谢谢!

Answer 1

这几天我正在研究这个功能。我分享我的经验(显然它可以改进)。我使用的关键组件是:

• angular-file-upload
• .NET ImageResizer : 用于调整缩略图原始图像的大小(Nathanael Jones 的出色工作)

堆栈是:

Angular.js 图片 uploader

正如我所说，我使用 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)，我不必再操作结果，我可以将它们直接放在 Angular 模板中:

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

显然，它可以做成不同的，但这就是我的情况。

数据库

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

这是我的第一次尝试，所以肯定可以改进(如果您有提示，请不要犹豫)。