さくらのウェブアクセラレータをオブジェクトストレージで利用する際の注意点

こんにちは、UOZUです!

今日はさくらのウェブアクセラレータとオブジェクトストレージを連携して利用する際の注意点を記事にしてみます。

さくらのウェブアクセラレータ
【国産CDN】低コストで高速・安定配信 | さくらのウェブアクセラレータ 【500GiB分無償でお試し】導入実績多数の安心国産CDN。簡単導入で、アクセス集中時の安定性強化・表示速度改善・SEO対策・ユーザー離脱防止を実現。
高性能・低価格クラウドサーバーは...
オブジェクトストレージ | さくらのクラウド Amazon S3互換のAPIを利用できる、定額従量制のストレージサービスです。
目次

ウェブアクセラレータの利用イメージ

さくらのウェブアクセラレータ、先にSSL証明書の自動更新の記事でも触れられていますが、コンテンツ配信元サーバに代わり、コンテンツキャッシュを配信してくれるマネージドサービスです。

ウェブアクセラレータの概要
あわせて読みたい
さくらのウェブアクセラレータにおけるSSL自動更新 今回は、さくらのウェブアクセラレータへのSSL証明書アップロードを自動化してみます。前提として、ウェブアクセラレータの標準機能として、Let's EncryptによるSSL証明...

通常はさくらのクラウドの仮想サーバなどをコンテンツ配信元サーバ=「オリジン」として設定しますが、ウェブサーバー以外でも、さくらのオブジェクトストレージのバケット名、S3エンドポイント、S3リージョンを指定することで、ウェブサーバーを構築しなくても、ウェブサイトを公開できるようになります。

ウェブアクセラレータのオリジン設定画面

ブラウザからアップロードした際の注意点

オブジェクトストレージへのアップロードはブラウザからも可能です。試しに中身に「uozu」と書かれたindex.htmlファイルを作成し、アップロードしてみます。

オブジェクトストレージへindex.htmlをアップロード

ウェブアクセラレータのドメイン名にアクセスしてみますが・・・なぜかページは表示されず、何かがダウンロードされました。

ブラウザからウェブアクセラレータのドメインにアクセス
ダウンロードされたindex.htmlの表示

ちょっと予想と違いますね・・・なぜでしょうか。UOZUの大好きなcURLで確認してみます。

$ curl http://4e6k84cb.user.webaccel.jp/
uozu

cURLからはしっかりと「uozu」の表示が確認できています。では、なぜダウンロードされたのでしょうか。

Content-Typeヘッダの仕組みと挙動

もう少し詳しく挙動を見るため、cURL-vオプションをつけ、詳細出力させて再確認してみます。

$ curl -v http://xxxxxx.user.webaccel.jp/
*   Trying 203.0.113.20...
* TCP_NODELAY set
* Connected to 4e6k84cb.user.webaccel.jp (203.0.113.20) port 80 (#0)
> GET / HTTP/1.1
> Host: xxxxxx.user.webaccel.jp
> User-Agent: curl/7.61.1
> Accept: */*
>
< HTTP/1.1 200 OK
< Server: nginx
< Date: Sun, 21 Jun 2026 07:33:02 GMT
< Content-Type: application/octet-stream
< Content-Length: 4
< Connection: keep-alive
< Accept-Ranges: bytes
< ETag: "e4a5d92f5bc2eda9b5b7a05ce1d3d065"
< Last-Modified: Sun, 21 Jun 2026 07:20:07 GMT
< x-amz-id-2: 3fc20d6d1a41b4fa6e12
< x-amz-request-id: 3fc20d6d1a41b4fa6e12
< Cache-Control: s-maxage=3600
< Age: 100
< Via: http/1.1 sv06-osk03-jp (ApacheTrafficServer-second [uScHs f p eN:t cCHp s ]), http/1.1 sv19-osk03-jp (ApacheTrafficServer-first [uScMsSfWpSeN:t cCMpSs ])
< X-Cache: HIT
<
* Connection #0 to host 4e6k84cb.user.webaccel.jp left intact
uozu

詳細出力のうち、 > はcURLから送られたヘッダ(リクエストヘッダ)、 < はサーバ(ウェブアクセラレータ)から送られたヘッダ(レスポンスヘッダ)を出力しています。

ここで注目してしいのは、レスポンスヘッダ < に含まれているContent-Type: application/octet-streamの部分です。ブラウザ(クライアント)では通常、URLのパスやドメインに関係なく、このContent-Typeで指定された内容で、「ブラウザで表示させる」「表示させずダウンロードする」といった判定を行っています。

ブラウザ(クライアント)の処理の流れ

つまり今回、Content-Type: text/htmlで出力されるべきContent-Typeが、なぜかapplication/octet-streamで出力された、ブラウザで表示されず、ダウンロードされたということになります。

また、ウェブアクセラレータはあくまでも「コンテンツ配信元サーバ」のキャッシュになるので、オブジェクトストレージ側のContent-Typeに何らかの設定が不足していたと思われます。

あわせて読みたい
Content-Type ヘッダー - HTTP | MDN HTTP の Content-Type は表現ヘッダーで、コンテンツへのエンコードが適用される前の、リソースの元のメディア種別を示すために使用します。

オブジェクトストレージ上ファイルのContent-Typeの変更方法

ブラウザ上でオブジェクトストレージのMIMEタイプは2026年6月時点では確認や変更が出来ないようなので、先の記事を参考に、aws s3コマンドで確認と変更をしていきましょう。

あわせて読みたい
さくらのクラウドオブジェクトストレージを aws s3 コマンドで操作する オブジェクトストレージにファイルを保管したいと思ったことはありますか? 以前UOZUにてマウントする記事を投稿していますが、今回はマウントせず使う方法(タイトルにも...

aws s3 コマンドでContentTypeの確認と変更

aws s3 コマンドでindex.htmlのContentTypeを確認します。やはりapplication/octet-streamが指定されていました。

$ aws s3api head-object \
 --endpoint-url https://s3.tky01.sakurastorage.jp \
 --region jp-east-1 \
 --bucket xxxxxx \
 --key index.html \
 --query '{ContentType:ContentType}' \
 --output json
{
"ContentType": "application/octet-stream"
}

というわけで、text/htmlに修正を行います。文字コードはUTF-8を指定しておきます。

$ aws s3api copy-object \
 --endpoint-url https://s3.tky01.sakurastorage.jp \
 --region jp-east-1 \
 --bucket xxxxxx \
 --key index.html \
 --copy-source xxxxxx/index.html \
 --content-type 'text/html; charset=utf-8' \
 --metadata-directive REPLACE
COPYOBJECTRESULT "e4a5d92f5bc2eda9b5b7a05ce1d3d065" 2026-06-21T08:20:04.610000+00:00
 aws s3api head-object \
 --endpoint-url https://s3.tky01.sakurastorage.jp \
 --region jp-east-1 \
 --bucket xxxxxx \
 --key index.html \
 --query '{ContentType:ContentType}' \
 --output json
{
"ContentType": "text/html; charset=utf-8"
}

ブラウザ上での挙動確認

では早速ブラウザ上で確認してみましょう!・・・またダウンロードされましたね。

ダウンロードされた状態が解消しない

当然ですが、これはウェブアクセラレータが前回のコンテンツ情報をキャッシュしてしまい、ブラウザ上での挙動が変わっていないためです。ウェブアクセラレータの設定画面から、全件またはURLを指定してキャッシュを削除します。

キャッシュ削除画面

無事、ブラウザ上からも正常な表示が確認できました!

ブラウザ上からの正常な表示を確認

また、もしキャッシュ削除後も挙動が変わらない際は、ブラウザ上でキャッシュが残っている可能性もあります。プライベートウィンドウやシークレットウィンドウで表示を確認してみましょう。

さいごに

今回、ウェブアクセラレータをオブジェクトストレージで利用する際の注意点を書いてみました!

もしキャンペーンサイトや画像配信で利用する際に、記事がお役に立てれば幸いです。

さいごまでお読みいただき、ありがとうございました。

お問い合わせ

この記事をシェアする
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

ネットアシスト運用チーム10年目の運用エンジニア
ベーシック試験 | さくらのクラウド検定
AWS Certified Solutions Architect - Associate

目次