Prasyarat Buat bucket Amazon S3.Unggah konten ke ember Membuat Origin Access Control (OAC)Buat distribusi standar Perbarui kebijakan bucket S3 Anda Konfirmasikan penyebaran distribusi Akses konten Anda melalui CloudFront Bersihkan

Memulai dengan distribusi standar (AWS CLI)

Prosedur di bagian ini menunjukkan kepada Anda cara menggunakan AWS CLI with CloudFront untuk menyiapkan konfigurasi dasar yang melibatkan hal-hal berikut:

Membuat bucket Amazon S3 untuk digunakan sebagai asal distribusi Anda.
Menyimpan versi asli objek Anda di bucket S3.
Menggunakan kontrol akses asal (OAC) untuk mengirim permintaan yang diautentikasi ke asal Amazon S3 Anda. OAC mengirimkan permintaan CloudFront untuk mencegah pemirsa mengakses bucket S3 Anda secara langsung. Untuk informasi lebih lanjut tentang OAC, lihatBatasi akses ke asal Amazon S3.
Menggunakan nama CloudFront domain URLs untuk objek Anda (misalnya,https://d111111abcdef8.cloudfront.net/index.html).
Menjaga objek Anda di lokasi CloudFront tepi selama durasi default 24 jam (durasi minimum adalah 0 detik).

Sebagian besar opsi ini dapat disesuaikan. Untuk informasi tentang cara menyesuaikan opsi CloudFront distribusi, lihatBuat distribusi.

Prasyarat

Sebelum memulai, pastikan bahwa Anda telah menyelesaikan langkah-langkah dalam Siapkan Akun AWS.

Instal AWS CLI dan konfigurasikan dengan kredensil Anda. Untuk informasi selengkapnya, lihat Memulai AWS CLI dalam Panduan Pengguna AWS CLI .

Buat bucket Amazon S3.

Bucket Amazon S3 adalah wadah untuk file (objek) atau folder. CloudFront dapat mendistribusikan hampir semua jenis file untuk Anda ketika ember S3 adalah sumbernya. Misalnya, CloudFront dapat mendistribusikan teks, gambar, dan video. Tidak ada maksimum untuk jumlah data yang dapat disimpan di Amazon S3.

Untuk tutorial ini, Anda membuat bucket S3 dan mengunggah file HTML yang akan Anda gunakan untuk membuat halaman web dasar.


aws s3 mb s3://amzn-s3-demo-bucket/ --region us-east-1

Ganti amzn-s3-demo-bucket dengan nama bucket yang unik secara global. Untuk itu Wilayah AWS, kami sarankan memilih Wilayah yang secara geografis dekat dengan Anda. Ini mengurangi latensi dan biaya, tetapi memilih Wilayah yang berbeda juga berfungsi. Misalnya, Anda dapat melakukan ini untuk memenuhi persyaratan peraturan.

Unggah konten ke ember

Untuk tutorial ini, unduh dan ekstrak file konten sampel untuk halaman web “Hello World” dasar.


# Create a temporary directory
mkdir -p ~/cloudfront-demo

# Download the sample Hello World files
curl -o ~/cloudfront-demo/hello-world-html.zip https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/samples/hello-world-html.zip

# Extract the zip file
unzip ~/cloudfront-demo/hello-world-html.zip -d ~/cloudfront-demo/hello-world

Ini membuat direktori dengan index.html file dan css folder. Unggah file-file ini ke bucket S3 Anda.


aws s3 cp ~/cloudfront-demo/hello-world/ s3://amzn-s3-demo-bucket/ --recursive>

Membuat Origin Access Control (OAC)

Untuk tutorial ini, Anda akan membuat kontrol akses asal (OAC). OAC membantu Anda mengirim permintaan yang diautentikasi dengan aman ke asal Amazon S3 Anda. Untuk informasi lebih lanjut tentang OAC, lihatBatasi akses ke asal Amazon S3.


aws cloudfront create-origin-access-control \
    --origin-access-control-config Name="oac-for-s3",SigningProtocol=sigv4,SigningBehavior=always,OriginAccessControlOriginType=s3

Simpan ID OAC dari output sebagai variabel lingkungan. Ganti nilai contoh dengan ID OAC Anda sendiri. Anda akan menggunakan ini di langkah berikutnya.


OAC_ID="E1ABCD2EFGHIJ"

Buat distribusi standar

Buat file konfigurasi distribusi bernamadistribution-config.json. Ganti contoh nama bucket dengan nama bucket Anda untukId,DomainName, dan TargetOriginId nilai.


cat > distribution-config.json << EOF
{
    "CallerReference": "cli-example-$(date +%s)",
    "Origins": {
        "Quantity": 1,
        "Items": [
            {
                "Id": "S3-amzn-s3-demo-bucket",
                "DomainName": "amzn-s3-demo-bucket.s3.amazonaws.com",
                "S3OriginConfig": {
                    "OriginAccessIdentity": ""
                },
                "OriginAccessControlId": "$OAC_ID"
            }
        ]
    },
    "DefaultCacheBehavior": {
        "TargetOriginId": "S3-amzn-s3-demo-bucket",
        "ViewerProtocolPolicy": "redirect-to-https",
        "AllowedMethods": {
            "Quantity": 2,
            "Items": ["GET", "HEAD"],
            "CachedMethods": {
                "Quantity": 2,
                "Items": ["GET", "HEAD"]
            }
        },
        "DefaultTTL": 86400,
        "MinTTL": 0,
        "MaxTTL": 31536000,
        "Compress": true,
        "ForwardedValues": {
            "QueryString": false,
            "Cookies": {
                "Forward": "none"
            }
        }
    },
    "Comment": "CloudFront distribution for S3 bucket",
    "Enabled": true
}
EOF

Buat distribusi standar.


aws cloudfront create-distribution --distribution-config file://distribution-config.json

Simpan ID distribusi dan nama domain dari output sebagai variabel lingkungan. Ganti Contoh nilai dengan nilai Anda sendiri. Anda akan menggunakan ini nanti dalam tutorial ini.


DISTRIBUTION_ID="EABCD1234XMPL"
DOMAIN_NAME="d111111abcdef8.cloudfront.net"

Sebelum menggunakan bucket distribusi dan S3 dari tutorial ini di lingkungan produksi, pastikan untuk mengonfigurasinya untuk memenuhi kebutuhan spesifik Anda. Untuk informasi tentang mengonfigurasi akses di lingkungan produksi, lihatKonfigurasikan akses aman dan batasi akses ke konten.

Perbarui kebijakan bucket S3 Anda

Perbarui kebijakan bucket S3 Anda CloudFront agar dapat mengakses objek. Ganti contoh nama bucket dengan nama bucket Anda.


# Get your AWS account ID
ACCOUNT_ID=$(aws sts get-caller-identity --query 'Account' --output text)

# Create the bucket policy
cat > bucket-policy.json << EOF
{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "AllowCloudFrontServicePrincipal",
            "Effect": "Allow",
            "Principal": {
                "Service": "cloudfront.amazonaws.com"
            },
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::amzn-s3-demo-bucket/*",
            "Condition": {
                "StringEquals": {
                    "AWS:SourceArn": "arn:aws:cloudfront::$ACCOUNT_ID:distribution/$DISTRIBUTION_ID"
                }
            }
        }
    ]
}
EOF

# Apply the bucket policy
aws s3api put-bucket-policy \
    --bucket amzn-s3-demo-bucket \
    --policy file://bucket-policy.json

Konfirmasikan penyebaran distribusi

Setelah Anda membuat distribusi Anda, itu akan memakan waktu untuk menyelesaikan penerapan. Ketika status distribusi berubah dari InProgress keDeployed, lanjutkan ke langkah berikutnya.


aws cloudfront get-distribution --id $DISTRIBUTION_ID --query 'Distribution.Status'

Atau, Anda dapat menggunakan wait perintah untuk menunggu penyebaran distribusi.


aws cloudfront wait distribution-deployed --id $DISTRIBUTION_ID

Akses konten Anda melalui CloudFront

Untuk mengakses konten Anda CloudFront, gabungkan nama domain untuk CloudFront distribusi Anda dengan halaman utama untuk konten Anda. Ganti contoh nama CloudFront domain dengan nama Anda sendiri.


https://d111111abcdef8.cloudfront.net/index.html

Jika Anda mengikuti langkah-langkah sebelumnya dan membuat file HTML, Anda akan melihat halaman web yang mengatakan Hello world! .

Saat mengunggah lebih banyak konten ke bucket S3 ini, Anda dapat mengakses konten CloudFront melalui menggabungkan nama domain CloudFront distribusi dengan jalur ke objek di bucket S3. Misalnya, jika Anda mengunggah file baru yang diberi nama new-page.html ke root bucket S3 Anda, URL akan terlihat seperti ini:

https://d111111abcdef8.cloudfront.net/new-page.html.

Bersihkan

Jika Anda membuat bucket distribusi dan S3 hanya sebagai latihan pembelajaran, hapuslah agar Anda tidak lagi dikenakan biaya. Nonaktifkan dan hapus distribusi terlebih dahulu.

Untuk menonaktifkan dan menghapus distribusi standar (AWS CLI)

Pertama, nonaktifkan distribusi.


# Get the current configuration and ETag
ETAG=$(aws cloudfront get-distribution-config --id $DISTRIBUTION_ID --query 'ETag' --output text)

# Create a modified configuration with Enabled=false
aws cloudfront get-distribution-config --id $DISTRIBUTION_ID | \
jq '.DistributionConfig.Enabled = false' > temp_disabled_config.json

# Update the distribution to disable it
aws cloudfront update-distribution \
    --id $DISTRIBUTION_ID \
    --distribution-config file://<(jq '.DistributionConfig' temp_disabled_config.json) \
    --if-match $ETAG

Tunggu distribusi dinonaktifkan.


aws cloudfront wait distribution-deployed --id $DISTRIBUTION_ID

Hapus distribusi.


# Get the current ETag
ETAG=$(aws cloudfront get-distribution-config --id $DISTRIBUTION_ID --query 'ETag' --output text)

# Delete the distribution
aws cloudfront delete-distribution --id $DISTRIBUTION_ID --if-match $ETAG

Untuk menghapus bucket S3 ()AWS CLI

Hapus ember S3 dan isinya. Ganti contoh nama bucket dengan nama Anda sendiri.


# Delete the bucket contents
aws s3 rm s3://amzn-s3-demo-bucket --recursive

# Delete the bucket
aws s3 rb s3://amzn-s3-demo-bucket

Untuk membersihkan file lokal yang dibuat untuk tutorial ini, jalankan perintah berikut:


# Clean up local files
rm -f distribution-config.json bucket-policy.json temp_disabled_config.json
rm -rf ~/cloudfront-demo

Secara opsional, Anda dapat menghapus OAC yang Anda buat untuk tutorial ini.


# Get the OAC ETag
OAC_ETAG=$(aws cloudfront get-origin-access-control --id $OAC_ID --query 'ETag' --output text)

# Delete the OAC
aws cloudfront delete-origin-access-control --id $OAC_ID --if-match $OAC_ETAG

Awas Javascript dinonaktifkan atau tidak tersedia di browser Anda.

Untuk menggunakan Dokumentasi AWS, Javascript harus diaktifkan. Lihat halaman Bantuan browser Anda untuk petunjuk.

Konvensi Dokumen

Memulai dengan distribusi standar

Memulai dengan situs web statis yang aman