|
|
51CTO旗下网站
|
|
移动端

3.3.6 网站跨域上传文件

《Microsoft Azure 管理与开发(下册)平台服务PaaS》本书由世纪互联蓝云Microsoft Azure 开发技术支持团队的资深工程师们编写,主要阐述MicrosoftAzure PaaS 服务的开发应用,涉及计算服务、集成认证服务、数据存储服务、大数据服务等方面的内容。本节为大家介绍网站跨域上传文件。

作者:世纪互联蓝云公司来源:电子工业出版社|2018-07-13 12:26

3.3.6 网站跨域上传文件

用户在Azure 上构建B/S 程序时,有很多场景需要存储海量的文件,比如图片、文档及视频等,按照传统的方式,通常会将这些文件存储到Web 应用的宿主服务器上。不过目前大部分的Azure 计算服务在一定程度都有容量限制,比如虚拟机可附加的磁盘数量和单块磁盘容量也只能支撑几十TB 的总容量。PaaS 的计算服务,如Web App、Cloud Service、Service Fabric 等因无法附加磁盘,所支撑的存储容量更是少之又少,往往支持到几十或几百GB。

因此,对于云端B/S 应用产生的文件存储,需一种有效的存储方式。将应用文件托管到Azure Blob Storage 服务,是最为有效的方式。存储单个账户规模可以支撑500TB 容量,通过配置多个账户,可以支撑应用文件的海量存储,达到线性扩展的目的。

B/S 应用如何将文件上传到存储服务呢?通常有以下两种做法。

(1) 第一种方式:使用传统逻辑将文件从浏览器端(Client)上传到虚拟机(Server),然后在调用存储接口,将文件从虚拟机(Server)上传到存储(Azure Storage),如图3.3.6-1所示。

(2) 第二种方式:将文件从浏览器端(Client)直接跨域上传到存储(Azure Storage),同时在发起Ajax 请求到虚拟机(Server),在虚拟机(Server)接收上传的文件信息,进行后续逻辑处理,比如写入数据库等,如图3.3.6-2 所示。

第二种方式基于Ajax 技术,不涉及服务器中转,建议选择这种方式实现此类业务。由于这种方式是在客户端直接将文件上传到存储服务,因此这个过程涉及跨域。同时,Web传输文件大小也是受到一定限制,为此也需要考虑分块上传来实现文件传输。以下提供了一个Javascript 跨域上传大文件到存储服务的示例。

1) 跨域配置:

2) 连接目标存储账户,在“Blob Containers”上单击右键,在弹出的菜单项中选择“Configure CORS Settings…”,如图3.3.6-3 所示。

3) 在上一步操作弹出的界面,单击“Add”,配置CROS 规则,如图3.3.6-4 所示(这里使用*进行宽范围的域权限设置,生产环境要结合需求进行限定)。

4) 更多关于存储的CROS 设置参考:https://docs.microsoft.com/en-us/rest/api/ storageservices/cross-origin-resource-sharing--cors--support-for-the-Azure-storage-services

5) 完整代码示例:https://github.com/hello-Azure/Azure-storage-Javascript

使用Storage Explorer 在目标容器上生成一个具有Write 权限的SAS 签名URI,如图3.3.6-5 所示。

下载后,在浏览器中直接打开页面,填写上步的SAS URI,选择文件上传即可,如图3.3.6-6 所示。


喜欢的朋友可以添加我们的微信账号:

51CTO读书频道二维码


51CTO读书频道活动讨论群:365934973

【责任编辑:book TEL:(010)68476606】

回书目   上一节   下一节
点赞 0
分享:
大家都在看
猜你喜欢

读 书 +更多

SQL Server 2005数据挖掘与商业智能完全解决方案

本书以BI解决方案的体系结构为中心,以SQL Server 2005为载体,将着眼点放在数据挖掘和商业智能上,详细讲解了数据报表、数据分析和数据挖...

订阅51CTO邮刊

点击这里查看样刊

订阅51CTO邮刊