微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

如何使用.NET Core和ReactJs上传和获取存储在AWS S3上的图像?

如何解决如何使用.NET Core和ReactJs上传和获取存储在AWS S3上的图像?

我将.NET Core 3.1用于我的Web API项目,并将ReactJs用作前端。我想从ReactJs上传图像并将其传递到Web API。 .Net Core会将映像上传到AWS S3。现在我的问题是我还有一些其他信息以及要存储在数据库中的图像。因此,从前端开始,我想将图像与其他详细信息一起传递,并且在GET请求期间,我希望图像与其他详细信息一起传递。以下是我要处理的属性

public class CategoryDto
{
    public int CategoryId {  get; internal set; }
    [display(Name ="category name")]
    [required]
    [StringLength(50)]
    public string CategoryName { get; set; }
    public IFormFile CategoryImage { get; set; }
    [required]
    public bool HasSubCategory { get; set; }
}

我面临以下问题:

  1. 如何从ReactJs发送图像以及其他类别详细信息?我读了几篇文章,其中一些建议使用表单数据,而另一些则建议将图像转换为base64并进行处理。因为我不希望在客户端和服务器端在base64上对图像进行编码和解码的开销,所以我更喜欢使用form-data,但是API将不再是REST。我是否可以通过其他方式通过REST API发送图像(我不想使用两种不同的API,即一种用于发送详细信息,另一种用于发送图像)?

  2. 到目前为止,我已经使用了表单数据,并且在服务器端,我将图像存储在AWS S3上。现在,我应该如何将类别详细信息和图像一起发送给客户端?我知道一种简单的方法来传递存储在AWS S3上的图像的URL,并且只需使用<img src="url">。为此,我必须公开存储在存储桶中的图像。另外,一次在客户端上会渲染很多图像,所以这可能会影响性能,因为我们必须直接从S3渲染图像。是否还有其他方法可以将图像以及其他详细信息作为响应从Web API发送出去,然后在客户端呈现图像?

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。