HOST A STATIC WEBSITE ON AZURE BLOB STORAGE IN 5 MINUTES (No VMs)
HOST A STATIC WEBSITE ON AZURE BLOB STORAGE IN 5 MINUTES (No VMs)
5 分钟在 Azure Blob Storage 上托管静态网站（无需虚拟机）
Have you ever wanted to put up a website without worrying about managing a web server, paying for hosting or wrestling with some complex configurations? There’s good news: Azure Storage can host a static website for almost nothing, and you can get your hands on it. In this blog post, I will tell you exactly what a static website is, I will introduce you to Azure Storage and its different types and tell you why Blob storage is a really good fit, and then walk you through the steps to get your static website hosted. Are you ready… Let’s get started!!! 你是否曾想过搭建一个网站，却又不想操心如何管理 Web 服务器、支付昂贵的托管费用，或者处理复杂的配置？好消息来了：Azure Storage 几乎可以免费托管静态网站，而且你完全可以轻松上手。在这篇博文中，我将详细解释什么是静态网站，介绍 Azure Storage 及其不同类型，说明为什么 Blob Storage 是最佳选择，并带你一步步完成静态网站的托管。准备好了吗……让我们开始吧！！！
WHAT IS A STATIC WEBSITE
什么是静态网站
A static website is a collection of fixed files - HTML, CSS, JavaScript and images - that your browser downloads and displays exactly as they are. Every visitor to the site gets to see the same content, and no database or server-side code is running behind the scenes. A good example includes Business Brochures, Documentation and Knowledge Bases, Landing Pages, and Personal Portfolios. Because static sites are just files, they load really fast and are very secure (there is no database to hack), and can be hosted on simple storage services like the Azure Blob Storage. 静态网站是一组固定的文件（HTML、CSS、JavaScript 和图像），浏览器会下载并按原样显示这些文件。每个访问者看到的内容都是相同的，后台没有运行任何数据库或服务器端代码。典型的例子包括企业宣传册、文档和知识库、落地页以及个人作品集。由于静态网站只是文件，它们的加载速度非常快，安全性也很高（没有数据库可被黑客攻击），并且可以托管在像 Azure Blob Storage 这样简单的存储服务上。
AZURE STORAGE - THE CLOUD HARD DRIVE
AZURE STORAGE - 云端硬盘
Azure Storage is Microsoft’s cloud service for storing all kinds of data. When you create a storage account, you get a suite of services, each built to handle a specific type of data storage task. Here’s a simple breakdown of each: Azure Storage 是微软用于存储各类数据的云服务。当你创建一个存储账户时，你将获得一套服务，每项服务都旨在处理特定类型的数据存储任务。以下是各项服务的简单分类：
🚀 Blob Storage: Handles unstructured data - images, website files, videos, backups 🚀 Blob Storage： 处理非结构化数据，如图像、网站文件、视频、备份。 🚀 Azure files: Handles Cloud file shares 🚀 Azure Files： 处理云文件共享。 🚀 Azure Tables: A NoSQL Key-value store for semi-structured data. 🚀 Azure Tables： 用于半结构化数据的 NoSQL 键值存储。 🚀 Azure Queues: Message queuing for decoupling app components. 🚀 Azure Queues： 用于解耦应用程序组件的消息队列。
WHAT IS AZURE BLOB STORAGE
什么是 AZURE BLOB STORAGE
Blob stands for Binary Large Object. It’s designed to store massive amounts of unstructured data – think of it as a giant, super‑reliable folder in the cloud. Within Blob Storage, you create containers (like folders) and upload blobs (your files). Blobs come in three flavours: Blob 代表“二进制大对象”（Binary Large Object）。它旨在存储海量的非结构化数据——你可以把它想象成云端一个巨大且极其可靠的文件夹。在 Blob Storage 中，你可以创建容器（类似于文件夹）并上传 Blob（即你的文件）。Blob 有三种类型：
✅ Block blobs – ideal for text and media files (perfect for websites) ✅ 块 Blob (Block blobs) – 适用于文本和媒体文件（非常适合网站）。 ✅ Page blobs – used for virtual machine disks ✅ 页 Blob (Page blobs) – 用于虚拟机磁盘。 ✅ Append blobs – optimised for logging ✅ 追加 Blob (Append blobs) – 针对日志记录进行了优化。
For a static site, you’ll use block blobs. 对于静态网站，你将使用块 Blob。
Why Azure Blob Storage Is a Great Fit for Static Websites
为什么 Azure Blob Storage 是静态网站的绝佳选择
You might wonder, “Why not just use a traditional web host?” Here’s what makes Blob Storage special for static sites: 你可能会问：“为什么不直接使用传统的 Web 主机？”以下是 Blob Storage 适合静态网站的独特之处：
🎯 No server to manage – You don’t install, patch, or secure any operating system or web server software. 🎯 无需管理服务器 – 你无需安装、修补或保护任何操作系统或 Web 服务器软件。 🎯 Incredibly low cost – You pay only for the storage your files use and the requests they generate. The static website feature is free to enable. 🎯 成本极低 – 你只需为文件占用的存储空间和产生的请求付费。静态网站功能是免费启用的。 🎯 Built‑in HTTPS – Azure gives you a *.web.core.windows.net URL with an automatic SSL certificate, so your site is secure from the start. 🎯 内置 HTTPS – Azure 会为你提供一个 *.web.core.windows.net 的 URL，并附带自动 SSL 证书，确保你的网站从一开始就是安全的。 🎯 Global scale – Azure’s infrastructure is massive. If your site goes viral, Blob Storage handles the traffic without breaking a sweat. 🎯 全球规模 – Azure 的基础设施非常庞大。如果你的网站流量激增，Blob Storage 可以轻松应对。 🎯 99.9%+ durability – Microsoft automatically replicates your files to protect against hardware failure. 🎯 99.9%+ 的持久性 – 微软会自动复制你的文件，以防止硬件故障。 🎯 Easy custom domains – You can map your own domain (like www.your-site.com) to the Azure endpoint. 🎯 轻松配置自定义域名 – 你可以将自己的域名（如 www.your-site.com）映射到 Azure 端点。
⚠️ One small limitation: Because there’s no web server, you cannot run server‑side code (PHP, Node.js, etc.). If you need authentication or custom headers, look at Azure Static Web Apps – a more powerful (but still serverless) option. ⚠️ 一个小限制： 由于没有 Web 服务器，你无法运行服务器端代码（如 PHP、Node.js 等）。如果你需要身份验证或自定义标头，请查看 Azure Static Web Apps——这是一个更强大（但仍然是无服务器）的选择。
STEP BY STEP WALK THROUGH: HOST A STATIC WEBSITE ON AZURE BLOB STORAGE
分步指南：在 Azure Blob Storage 上托管静态网站
STEP ONE - Create a Storage Account in Azure
第一步 - 在 Azure 中创建存储账户
1️⃣ Sign in to your Azure Portal 1️⃣ 登录 Azure 门户。 2️⃣ In the search bar, type in Storage Account and click on it in the drop-down suggestion. 2️⃣ 在搜索栏中输入“Storage Account”，并在下拉建议中点击它。 3️⃣ Inside the Storage centre, click on Create to create an Azure blob storage 3️⃣ 在存储中心内，点击“Create”以创建 Azure Blob 存储。 4️⃣ Fill in the basics 4️⃣ 填写基础信息： 🔲 Resource group: Create a new resource group by clicking on create new and providing your resource group name. 🔲 资源组： 点击“Create new”并提供名称来创建一个新的资源组。 🔲 Storage account name: Must be globally unique -try mynewstaticsite (lowercase letters and numbers only) 🔲 存储账户名称： 必须全局唯一，尝试使用 mynewstaticsite（仅限小写字母和数字）。 🔲 Region: Pick one close to your audience 🔲 区域： 选择一个靠近你受众的区域。 🔲 Preferred Storage type: Azure Blob Storage or Azure Data Lake Storage. 🔲 首选存储类型： Azure Blob Storage 或 Azure Data Lake Storage。 🔲 Performance: Standard (perfect for a static site) 🔲 性能： 标准（Standard，非常适合静态网站）。 🔲 Redundancy: Locally redundant storage (LRS) 🔲 冗余： 本地冗余存储 (LRS)。 5️⃣ Click Review + Create and then Create. Deployment takes a few seconds. Once it is done, click Go to Resource. 5️⃣ 点击“Review + Create”，然后点击“Create”。部署只需几秒钟。完成后，点击“Go to Resource”。
STEP TWO - ENABLE STATIC WEBSITE HOSTING
第二步 - 启用静态网站托管
1️⃣ In your storage account’s left menu, under Data Management, click Static Website 1️⃣ 在存储账户的左侧菜单中，在“Data Management”下点击“Static Website”。 2️⃣ Set Static website hosting to Enabled 2️⃣ 将“Static website hosting”设置为“Enabled”。 3️⃣ Enter: 3️⃣ 输入： 🔘 Index document name: index.html (this is your home page) 🔘 索引文档名称： index.html（这是你的主页）。 🔘 Error document path: 404.html 🔘 错误文档路径： 404.html。 4️⃣ Click Save above. 4️⃣ 点击上方的“Save”。
After saving, Azure automatically creates a special container named $web – this is where all your website files will live. Azure also shows you a Primary endpoint URL like https://yourstorageaccount.z22.web.core.windows.net/ – it’s your site’s address. 保存后，Azure 会自动创建一个名为 $web 的特殊容器——这就是你所有网站文件的存放位置。Azure 还会显示一个主端点 URL，例如 https://yourstorageaccount.z22.web.core.windows.net/——这就是你网站的地址。
STEP THREE – Download a Free Template from Tooplate.com
第三步 - 从 Tooplate.com 下载免费模板
1️⃣ Go to Tooplate.com and browse the free templates. For this example, I’ll use “2137_barista_cafe” 1️⃣ 前往 Tooplate.com 浏览免费模板。在本例中，我将使用“2137_barista_cafe”。 2️⃣ Click the Download button to get a ZIP file. 2️⃣ 点击下载按钮获取 ZIP 文件。 3️⃣ Extract the ZIP on your computer. You’ll see folders like css, js, images and an index.html file. 3️⃣ 在电脑上解压 ZIP 文件。你会看到 css、js、images 等文件夹以及一个 index.html 文件。
STEP FOUR – Upload Your Template Files to the $web Container
第四步 - 将模板文件上传到 $web 容器
1️⃣ In your storage account, go to Containers (under Data storage). 1️⃣ 在存储账户中，转到“Containers”（在 Data storage 下）。 2️⃣ Click on the $web container to open it. 2️⃣ 点击 $web 容器将其打开。 3️⃣ Click the Upload button to add the content of the static website to the $web container 3️⃣ 点击“Upload”按钮，将静态网站的内容添加到 $web 容器中。 4️⃣ Drag the extracted files and folders from your computer into the upload window, or click to browse. 4️⃣ 将电脑上解压的文件和文件夹拖入上传窗口，或点击进行浏览。 5️⃣ After the upload completes, you should see all your files inside $web 5️⃣ 上传完成后，你应该能在 $web 中看到所有文件。
STEP FIVE – Test Your Live Website
第五步 - 测试你的在线网站
1️⃣ Go back to the Static website page in your storage account. 1️⃣ 回到存储账户中的“Static website”页面。 2️⃣ Click the Primary endpoint URL (or paste it into your browser). 2️⃣ 点击主端点 URL（或将其粘贴到浏览器中）。 3️⃣ Congratulations – your Tooplate template is now live on the internet, served directly from Azure Blob Storage! You’ll see the beautiful, responsive website just like it looks on your computer. 3️⃣ 恭喜——你的 Tooplate 模板现在已在互联网上发布，直接由 Azure Blob Storage 提供服务！你将看到与电脑上显示效果一致的精美响应式网站。
Now you can give this a try. Pick a template you love, upload it to Azure Blob Storage, and share your new site with the world! 现在你可以亲自尝试一下了。挑选一个你喜欢的模板，上传到 Azure Blob Storage，然后与世界分享你的新网站吧！