没有页面刷新的 Azure 上传 Blob

Question

我正在关注 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);
       }

Answer 1

要避免回发，您需要使用 AJAX. Most of the common JavaScript frameworks like jQuery 支持。

现在开始使用 AJAX 将文件上传到 blob 存储中，基本上有两种方法可以做到这一点：

从用户的浏览器直接上传到 Blob 存储：如果您的用户使用支持 HTML5 的现代浏览器，那么他们可以直接上传文件从他们的本地计算机到 blob 存储。请参阅此 link 了解更多详情：https://msdn.microsoft.com/en-us/library/azure/hh824678.aspx. Essentially what you would do is create a Shared Access Signature with at least Write permission and allow cross-origin requests (CORS) from your web application to your storage account. This way the files are transferred directly received into your storage account. I have also written a blog post about the same that you may find useful: http://gauravmantri.com/2013/12/01/windows-azure-storage-and-cors-lets-have-some-fun/.
将文件从您的用户浏览器上传到您的网络服务器，然后将文件传输到 blob 存储。如果您搜索 AJAX 和文件上传，我相信您会找到很多资源，这些资源会告诉您它是如何工作的。

我的建议是选择选项 #1，因为它速度更快并且不会使您的网络服务器过载。

没有页面刷新的 Azure 上传 Blob

Azure Upload Blob without Page Refresh

c#

asp.net

file-upload

azure

azure-blob-storage