AWS入门实践-利用S3构建一个静态网站

news2024/11/18 6:20:38

使用Amazon S3托管静态网站是一个流行的选择,因为它简单、成本效益高,并且易于维护。静态网站由不含服务器端脚本的文件组成,如HTML、CSS和JavaScript文件。下面是使用S3托管静态网站的操作步骤:

如果大家没有AWS免费账号,请参考下面链接来创建:

想学习云计算么?教你如何免费白嫖微软和AWS的云资源一年_免费使用azure一年-CSDN博客

步骤 1:创建S3存储桶

  1. 登录到AWS管理控制台,并打开Amazon S3控制台。
  2. 点击“创建存储桶”。
  3. 为存储桶命名,这个名称必须全球唯一。
  4. 选择存储桶所在的区域。
  5. 点击“创建”完成存储桶的创建。

步骤 2:启用静态网站托管

  1. 在S3控制台中,选择你刚创建的存储桶。
  2. 转到“属性”选项卡。
  3. 在“静态网站托管”部分,选择“启用”。
  4. 输入你的首页文档(通常是index.html)和错误页面(例如:error.html)的名称。
  5. 记下S3为你的静态网站提供的终端节点URL。

步骤 3:上传网站内容

  1. 转到你的存储桶,并打开“对象”选项卡。
  2. 点击“上传”并选择你的静态网站文件(HTML、CSS、JavaScript等)。这里有一个简单的index.html供参考:
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>静态网页示例</title>
        <style>
            body {
                font-family: Arial, sans-serif;
                text-align: center;
                margin: 0;
                padding: 0;
            }
            
            h1 {
                font-size: 3em;
                margin-top: 1em;
            }
            
            img {
                max-width: 100%;
                height: auto;
            }
        </style>
    </head>
    <body>
        <h1>S3静态网页展示</h1>
        <img src="https://picsum.photos/1200/800" alt="随机图片">
    </body>
    </html>
    
  3. 设置文件的权限,使其对公众可读。你可以在上传时选择“设置权限”,然后选择“公开读取”。
  4. 完成上传。

步骤 4:设置存储桶策略

首先将公共权限打开,如下图:

然后在存储桶的“权限”选项卡下,点击“存储桶策略”。

输入一个策略,允许任何人访问存储桶中的对象。例如:

{"Version":"2012-10-17",
    "Statement":[
    {   "Sid":"PublicReadGetObject",
        "Effect":"Allow",
        "Principal":"*",
        "Action":"s3:GetObject",
        "Resource":"arn:aws:s3:::test-static-website2024/*"}
    ]
}

test-static-website2024替换为你的存储桶名称。

步骤5:验证静态网站

在浏览器键入刚才保存的URL
http://test-static-website2024.s3-website-ap-southeast-1.amazonaws.com

显示如下图:一个简单的静态网站就创建好了。 

步骤 6:(可选)配置自定义域名

如果你有自己的域名,你可能想要使用该域名而不是S3提供的终端节点URL来访问你的网站。

  1. 在你的DNS提供商处创建一个CNAME记录,指向你在步骤2中记下的S3网站终端节点URL。
  2. 如果使用Amazon Route 53作为DNS服务,你可以创建一个别名记录来实现相同的目的。

示例

假设你有一个静态网站,主页是index.html,有一个样式表style.css和一个JavaScript文件script.js。你希望通过www.example.com域名访问你的网站。

按照上述步骤,你将创建一个名为www.example.com的S3存储桶,启用静态网站托管,设置index.html作为首页。然后,你上传index.htmlstyle.cssscript.js到存储桶,并设置它们为公开读取。接着,你添加一个存储桶策略,允许公共访问。最后,你在你的DNS提供商处设置一个指向S3终端节点URL的CNAME记录。

这样,当用户访问www.example.com时,他们将看到由你的S3存储桶提供服务的静态网站。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1573609.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【C++】背包问题

目录 背包问题01 背包背包不装满问题背包必须满问题 完全背包 背包问题 背包问题属于动态规划的一类题型 01 背包 背包不装满问题 背包必须满问题 #include <iostream> using namespace std; const int N 1010; #include <vector> int main() {int n , V;int v[…

AJAX —— 学习(三)(完结)

目录 一、jQuery 中的 AJAX &#xff08;一&#xff09;get 方法 1.语法介绍 2.结果实现 &#xff08;二&#xff09;post 方法 1.语法介绍 2.结果实现 &#xff08;三&#xff09;通用型的 AJAX 方法 1.语法介绍 2.结果实现 二、AJAX 工具库 axios &#xff08…

批量导入svg文件作为图标使用(vue3)vite-plugin-svg-icons插件的具体应用

目录 需求svg使用简述插件使用简述实现安装插件1、配置vite.config.ts2、src/main.ts引入注册脚本3、写个icon组件4、使用组件 需求 在vue3项目中&#xff0c;需要批量导入某个文件夹内数量不确定的svg文件用来作为图标&#xff0c;开发完成后能够通过增减文件夹内的svg文件&a…

C++高频面试知识总结 part2

C高频面试 1.sizeof是什么&#xff1f;sizeof一个class大小怎么确定&#xff1f;是在编译期还是在运行期确定?2.函数重载的机制&#xff0c;重载是在编译期还是在运行期确定&#xff0c;重载有额外开销吗3.函数重写在编译还是运行时确定&#xff1f;4.如何找到虚函数表&#x…

MySQL复制拓扑4

文章目录 主要内容一.启用GUID并配置循环复制1.其中&#xff0c;UUID用来唯一标识每一个服务器&#xff0c;事务的编号记录了在该服务器上执行的事务的顺序。使用SELECT server_uuid\G命令可以查看服务器的UUID&#xff0c;sever1的UUID值显示如下&#xff1a;代码如下&#xf…

架构图设计

我们了解了软件架构后&#xff0c;方便了我们理解软件各方面的解读&#xff0c;但是如果我们开发中有必要自己设计架构图吗&#xff1f;有&#xff0c;但是不会轮到你。这里浅浅讲一下软构图的设计&#xff0c;相信当你用一张或几张图来描述系统时&#xff0c;是不是经常遇到以…

域控报错:Windows无法创建对象 XX,因为目录服务无法分配相对标识符。

当域控制器报告错误“Windows无法创建对象&#xff0c;因为目录服务无法分配相对标识符”时&#xff0c;这通常是指在Active Directory环境中尝试创建新用户、计算机或其他安全主体时&#xff0c;域控制器无法从预先分配给每个域的RID&#xff08;Relative Identifier&#xff…

Fire Smoke - Dynamic Nature

烟雾、火灾和爆炸预制件、着色器的集合。粒子支持HD、URP和标准渲染,自然制造风,因此它们对风速、方向和颤抖做出反应。 包装支持: Unity 2021.2及更高版本 Unity 2021.2 HD RP Unity 2021.2 URP Unity 2021.3及更高版本 Unity 2021.3 LTS HD RP Unity 2021.3 LTS URP Unity…

【SkyWorking】服务追踪工具

使用 Jar 启动时添加 VM 参数 -javaagent:/path/to/apache-skywalking-apm-incubating/agent/skywalking-agent.jar -Dskywalking.agent.application_codeYOUR_APP_NAME或 -javaagent:D:\city\skywalking-agent\skywalking-agent.jaragent.service_namemy-service,agent.instan…

贪心算法|45.跳跃游戏II

力扣题目链接 class Solution { public:int jump(vector<int>& nums) {if (nums.size() 1) return 0;int curDistance 0; // 当前覆盖最远距离下标int ans 0; // 记录走的最大步数int nextDistance 0; // 下一步覆盖最远距离下标for (int i 0;…

YoloV8实战:使用YoloV8实现水下目标检测(RUOD)

摘要 水下目标检测技术在生态监测、管道检修、沉船捕捞等任务中发挥着重要作用。常用的检测方法包括高清视像、侧扫声呐等。光学图像检测因高分辨率和灵活性&#xff0c;在近距离检测中优势显著。但水下图像受水体吸收、衰减、光源分布等影响&#xff0c;呈现蓝绿色&#xff0…

拾光坞N3 ARM 虚拟主机 i茅台项目

拾光坞N3 在Dcoker部署i茅台案例 OS&#xff1a;Ubuntu 22.04.1 LTS aarch64 cpu&#xff1a;RK3566 ram&#xff1a;2G 部署流程——》mysql——》java8——》redis——》nginx mysql # 依赖 apt update apt install -y net-tools apt install -y libaio* # 下载mysql wg…

太阳能自动气象站讲解

TH-QC10随着科技的不断进步和环保意识的日益增强&#xff0c;太阳能自动气象站逐渐成为了气象观测领域的新宠。这种结合了清洁能源与先进技术的装置&#xff0c;不仅为气象数据的获取提供了更为便捷、高效的方式&#xff0c;同时也为环保事业贡献了自己的力量。 一、太阳能自动…

PCI总线学习笔记:读写篇

前言 最近在写E1000网卡的驱动&#xff0c;这其中涉及到了PCI总线的相关内容。但是网上大部分关于PCI的文章都只局限在概念上的描述&#xff0c;并没有给出具体的例子来解释。这其实也是情理之中的&#xff0c;因为PCI总线规范就像是一个抽象的接口&#xff0c;其具体怎么实现…

[LeetCode][LCR133]位 1 的个数——快速从右边消去1

题目 LCR 133. 位 1 的个数 编写一个函数&#xff0c;输入是一个无符号整数&#xff08;以二进制串的形式&#xff09;&#xff0c;返回其二进制表达式中数字位数为 ‘1’ 的个数&#xff08;也被称为 汉明重量).&#xff09;。 提示&#xff1a; 请注意&#xff0c;在某些语言…

CTF之矛盾

这一题就是php的弱比较“” 这里要求输入的不是数字&#xff0c;并且输入要为1才打印flag 那我们就输入一个1后面接随便什么字符&#xff0c;因为php的弱比较将字符与数字进行比较的时候&#xff0c;会把字符转换成数字再比较&#xff0c;当转换到字符时后面便都为空了 flag{…

蓝桥杯 经验技巧篇

1. 注意事项 &#x1f468;‍&#x1f3eb; 官方通知 &#x1f468;‍&#x1f3eb; 资料文档 时间&#xff1a;4月13日 9:00~13:00 &#xff08;时长 4小时&#xff09;物品 准考证&#xff08;赛前一周开放下载&#xff0c;自行打印&#xff09;学生证身份证笔、水、外套&a…

层次式架构设计-体系结构概述

层次式架构是软件体系结构设计中最为常用的一种架构形式&#xff0c;它为软件系统提供了一种在结构、行为和属性方面的高级抽象。其核心思想是将系统组成为一种层次结构&#xff0c;每一层为上层服务&#xff0c;并作为下层的客户。 层次式架构设计技术&#xff1a; 表现层中间…

LeetCode刷题之31.下一个排列

文章目录 1. 题目2.分析3.解答3.1 先排序&#xff0c;后交换3.2 先交换&#xff0c;后排序 1. 题目 整数数组的一个 排列 就是将其所有成员以序列或线性顺序排列。 例如&#xff0c;arr [1,2,3] &#xff0c;以下这些都可以视作 arr 的排列&#xff1a;[1,2,3]、[1,3,2]、[3…

C——找单身狗2

题目内容&#xff1a; 在一个数组中&#xff0c;室友两个数字出现了一次&#xff0c;其他所有数字都出现了两次。找出只出现一次的数字。 如&#xff1a;1&#xff0c;2&#xff0c;3&#xff0c;4&#xff0c;5&#xff0c;1&#xff0c;2&#xff0c;3&#xff0c;4&#xff…