在图像标签中显示图像时，有时由于上传不成功，我无法从azure blob存储中获取图像

本文关键字：图像 azure blob 不成功 获取 存储 显示图 显示 标签 | 更新日期: 2023-09-27 18:03:23

我正在使用Azure blob容器来上传和下载图像。并使用下面的方法，我试图上传图像在存储客户端

    UploadBlob(string strContainerName, string BlobName, string strContentType, Stream FileStream)
    {
        try
        {
            if (InitializeStorage(strContainerName))
            {
                CloudBlobContainer container = BlobClient.GetContainerReference(strContainerName);
                CloudBlockBlob blob = container.GetBlockBlobReference(BlobName);
                blob.Properties.ContentType = strContentType;
                blob.UploadFromStream(FileStream);
                return true;
            }
            return false;
        }
        catch (Exception ex)
        {
            return false;
        }
    }

和从html页面我发送base64string图像和处理下面的代码，我在其中转换为字节数组，然后流，如下所示:

            string newstrImage = updobj.Image.Replace("data:;base64,/", "/");
            byte[] imageData = Convert.FromBase64String(newstrImage);
            var stream = new MemoryStream(imageData);
            string fileName = System.Guid.NewGuid().ToString();
            var imgurl = string.Empty;
            var imgdata = BlobUtility.UploadBlob("triplecourtimages",fileName, "image/png", stream);
            if (imgdata)
                imgurl = BlobUtility.GetBlobUrl("triplecourtimages", fileName);

但是当我试图检索图像url保存在我的DB有时它不显示任何图像。当时我检查blob容器，发现图像大小为0字节。

请帮帮我。

在图像标签中显示图像时，有时由于上传不成功，我无法从azure blob存储中获取图像

从html页面上传的base64string图像

据我所知，base64string图像应该如下所示:

data:image/[png、jpg、jpeg等];base64、[base64编码的二进制图像内容]

请尝试修改后端代码

string newstrImage =Regex.Replace(updobj.Image,"^data:image/(png|jpg|jpeg|bmp|gif);base64,",string.Empty);而不是

string newstrImage = updobj.Image.Replace("data:;base64,/", "/");

文件成功上传到Azure Blob，但有时Blob(图像)大小为0字节

1。请确保你得到的updobj.Image不是空的您可以记录上传的base64编码图像内容的详细信息。

2。请确保上传流的位置属性设置为零。在构造MemoryStream之后，可以在其后面添加以下代码。示例:

var stream = new MemoryStream(imageData); stream.Seek(0, SeekOrigin.Begin);

这是我这边的代码示例，你可以照着看，看看它是否对你有帮助。

ImageUpload.js 

var app = angular.module('app', []);
app.controller("FileUploadCtrl", function ($scope) {
    $scope.fileInfo = {};
    var fileSelect = document.createElement("input");
    fileSelect.type = "file";
    $scope.UploadFile = function () {
        fileSelect.click();
    }
    fileSelect.onchange = function () {
        var file = fileSelect.files[0];
        var fr = new FileReader();
        fr.onload = function (e) {
            $scope.fileInfo.Base64 = e.target.result;
            $scope.$apply();
            //print log
            console.log($scope.fileInfo.Base64);
            //upload the file
            $.post("/Home/UploadFile", {
                base64Image: $scope.fileInfo.Base64
            }, function(data) {
                alert("Upload file with result:" + data);
            });
        }
        fr.readAsDataURL(file);
    }
});

HomeController.cs 

public JsonResult UploadFile(string base64Image)
{
    string result = string.Empty;
    try
    {
        string newstrImage = Regex.Replace(base64Image, "^data:image/(png|jpg|jpeg|bmp|gif);base64,", string.Empty);
        byte[] imageData = Convert.FromBase64String(newstrImage);
        var stream = new MemoryStream(imageData);
        stream.Seek(0, SeekOrigin.Begin);
        string fileName = System.Guid.NewGuid().ToString();
        var imgurl = string.Empty;
        var imgdata = BlobUtility.UploadBlob("triplecourtimages", fileName, "image/png", stream);
if (imgdata)
  imgurl = BlobUtility.GetBlobUrl("triplecourtimages", fileName);
        result = string.Format("Upload successfully,image path:'r'n{0}", imgurl);
    }
    catch (Exception ex)
    {
        result = string.Format("Error:{0}", ex.Message);
    }
    return Json(result, JsonRequestBehavior.DenyGet);
}

此外，您可以使用以下在线工具来转换您的图像:

Base64 To Image: http://codebeautify.org/base64-to-image-converter
Image To Base64: http://codebeautify.org/image-to-base64-converter

相关文章：