没有页面刷新的Azure上载Blob

本文关键字:Azure 上载 Blob 刷新 | 更新日期: 2023-09-27 18:01:04

我遵循官方Azure Blob上传文档,并成功实现了Blob上传功能。然而,页面在上传后会刷新,我需要在不刷新页面的情况下上传图像。基本上没有回邮。

到目前为止,我拥有的是:

       if (profile_pic_input.HasFile)
       {
                var image = Request.Files["profile_pic_input"];
                CloudStorageAccount storageAccount = CloudStorageAccount.Parse(ConfigurationManager.AppSettings["StorageConnectionString"]);
                CloudBlobClient blobStorage = storageAccount.CreateCloudBlobClient();
                CloudBlobContainer container = blobStorage.GetContainerReference("photos");
                if (container.CreateIfNotExists())
                {
                    // configure container for public access
                    var permissions = container.GetPermissions();
                    permissions.PublicAccess = BlobContainerPublicAccessType.Container;
                    container.SetPermissions(permissions);
                }

                String tempName = GeneratePictureName();
                string uniqueBlobName = string.Format("photos/image_{0}{1}", tempName, Path.GetExtension(image.FileName));
                CloudBlockBlob blob = container.GetBlockBlobReference(uniqueBlobName);

                blob.Properties.ContentType = image.ContentType;
                blob.UploadFromStream(image.InputStream);
       }

没有页面刷新的Azure上载Blob

为了避免回发,您需要使用AJAX。大多数常见的JavaScript框架(如jQuery(都支持这一点。

现在开始使用AJAX将文件上传到blob存储中,基本上有两种方法可以做到:

  1. 从用户浏览器直接上传到Blob存储:如果您的用户使用的是支持HTML5的现代浏览器,那么他们可以直接将文件从本地计算机上传到Blob存储器。有关更多详细信息,请参阅此链接:https://msdn.microsoft.com/en-us/library/azure/hh824678.aspx.基本上,您要做的是创建一个至少具有Write权限的Shared Access Signature,并允许从web应用程序到存储帐户的跨来源请求(CORS(。通过这种方式,文件将直接传输到您的存储帐户中。我还写了一篇关于这件事的博客文章,你可能会觉得很有用:http://gauravmantri.com/2013/12/01/windows-azure-storage-and-cors-lets-have-some-fun/.

  2. 将文件从用户浏览器上载到web服务器,然后将文件传输到blob存储。如果你搜索AJAX和文件上传,我相信你会找到很多资源,告诉你这将如何工作。

我的建议是选择#1,因为它速度更快,不会让你的网络服务器过载。