【超爆速】Cloudflare Dropで静的サイトを即時プレビュー！公開手順と注意点を解説

Cloudflareから、静的サイトをフォルダやZIPファイルのアップロードだけでデプロイできる「Cloudflare Drop」が追加されました。

Cloudflare Changelog：https://developers.cloudflare.com/changelog/post/2026-07-08-cloudflare-drag-and-drop/
Cloudflare Drop：https://cloudflare.com/drop

公式のChangelogによると以下のような機能になります。

静的サイト（HTML、CSS、JavaScript、画像、フォント）のフォルダまたはZIPファイルをアップロードすると、1時間有効な一時ライブプレビューが得られます。その間にサイトの動作確認やプレビューURLの共有ができ、デプロイをClaimして保持することもできます。

今回は、Cloudflare Dropがどのような機能なのか、どのように使うのかを検証していこうと思います。

Cloudflare Dropは、HTML、CSS、JavaScript、画像、フォントなどの静的ファイルを含むフォルダまたはZIPファイルをアップロードするだけで、一時的なライブプレビューURLを発行できる機能です。
大きな特徴は、Cloudflareアカウントがなくても、まずは静的サイトをアップロードしてプレビューできる点です。発行されたプレビューURLは1時間有効で、その間にサイトの動作確認や共有ができます。
一時プレビューで問題がなければ、ClaimすることでCloudflareアカウントに紐づけて保存できます。

Cloudflare Dropでは、以下のような使い方ができます。

• ●静的HTML/CSS/JSサイトの一時プレビュー
• ●デザインモックやLPの確認URL作成
• ●社内・顧客への簡易共有
• ●Git連携前の動作確認
• ●必要に応じた正式デプロイへの移行

「まずは画面を見せたい」「一時的に共有したい」といった、手軽さが求められる場面で活用しやすい機能です。

Cloudflareで静的サイトやWorkersを公開する方法は、これまでにもいくつか用意されています。
代表的なのが「wrangler deploy」と「Workers Builds」です。
Cloudflare Dropは、これらと比べて「準備の手軽さ」に特化した位置づけになります。

方法	必要なもの	特徴
Cloudflare Drop	アカウント不要（後からClaim）／ブラウザのみ	フォルダやZIPをアップロードするだけ。 1時間の一時プレビューを発行
wrangler deploy	Cloudflareアカウント＋CLI（wrangler）の導入と コマンド操作	ターミナルからコマンドでデプロイ。 スクリプト化・CI/CDに組み込みやすい
Workers Builds	Cloudflareアカウント＋Gitリポジトリ（GitHub/GitLab）連携	pushを起点に自動でビルド＆デプロイ。 継続的な運用に向く

wrangler deployは、CLIツール（wrangler）をインストールし、ターミナルからコマンドでデプロイする方法です。細かい設定やCI/CDへの組み込みには向きますが、事前のセットアップとコマンド操作が必要です。
Workers Buildsは、GitHubやGitLabのリポジトリを連携し、pushを起点に自動でビルド・デプロイする仕組みです。継続的な運用には便利ですが、Gitリポジトリとの連携が前提になります。
これに対してCloudflare Dropは、コマンドもGit連携も不要で、そもそもアカウントすら用意せずにブラウザでフォルダ・ZIPをアップロードするだけで動作を確認できます。「まず動くものを見せたい」「一時的に共有したい」という最初の一歩に特化した手軽さが、既存の方法との一番の違いです。

プレビューしたサイトを継続して使いたい場合は、Claimボタンからサインイン（または新規アカウント作成）することで、そのデプロイをCloudflareアカウントに紐づけて保存できます。
Claim後は、以下のような設定が可能になります。

• ●独自ドメインの追加（既存ドメインの接続、または新規購入）
• ●Observability（パフォーマンスや利用状況の監視）の有効化
• ●Markdown for Agentsの有効化（AIエージェントがMarkdownでコンテンツを取得可能に）
• ●アクセス制御による非公開化

そのため、単なる一時共有だけでなく、必要に応じて本番利用に近い形へ進めることもできます。

フォルダにコードの用意

`drop-test` というディレクトリに以下のファイルを配置しました。

今回は検証なので、シンプルなWEBページの用意をしました。

Cloudflare Dropにファイルをアップロードしてプレビューサイトの公開

https://www.cloudflare.com/drop/ にアクセスします。

`Browse folders` をクリックして用意した`drop-test`フォルダを指定してアップロードをします。

Cloudflareの利用規約に同意するか確認されますので、Acceptします。

※デプロイすることにより、Cloudflareの利用規約およびプライバシーポリシーに同意したものとみなされます。

Acceptをすると以下のようにコンテンツをWEBサイトの公開に向ける準備が始まります。



準備が完了すると、以下の画面が表示されます。
Claim部分に生成されたURLの有効な残り時間が表示されており、その下に公開されているURLが表示されてます。

生成されたURLにアクセスしてみると、`drop-test`に格納したコンテンツが表示されていることを確認できました。

Javascriptも問題なく動いていました。

Cloudflareにデプロイ

上記まででプレビューサイトの準備までできましたので、このままCloudflareにデプロイして永続的にサイトの公開をするようにします。
※事前にCloudflareのアカウントを持っていることが前提となります。

Cloudflare Dropの以下画面から`Claim`をクリックします。

Cloudflareにログインする画面が表示されますのでログインしていきます。

dropで公開しているソースをアカウントにデプロイするために`取得`をクリックします。

デプロイするアカウントを選択して確認を選択します。

しばらくすると、以下のような画面になりWorkersの開発者用のURLからサイトが見れるようになります。

Workersの画面からも、Dropで作成したページが追加されていることが確認できます。

あとはこのWorkersをカスタムドメインに追加して公開していきます。
※公開するドメインは既にDNSに登録済みである必要があります。

Dropで作成したWorkersの`ドメイン`から`ルートを追加`を選択します。

公開するドメインを選択します。

ルーティングするFQDNの場所を指定します。
※環境に合わせて指定して下さい。

無事に追加できれば、以下のようにCloudflareのドメインからDropで作成したコンテンツが見れるようになります。

Cloudflare Dropは静的サイト向けの機能です。サーバーサイド処理が必要なアプリケーションには向きません。
また、一時プレビューは1時間で期限切れになるため、継続利用したい場合はClaimが必要です。
アップロード前には、.env やAPIキー、認証情報などの機密情報が含まれていないか確認しておくと安全です。

簡単ですがCloudflare Dropの機能を整理してみました。
これまで静的サイトを共有するには、サーバーへのアップロードやホスティングサービスへのデプロイなど、いくつかの準備が必要でした。Cloudflare Dropを使えば、アカウントすら用意せずに、フォルダやZIPをアップロードするだけでプレビューURLを発行できます。
「まずは画面を見せたい」「一時的に共有したい」「Cloudflare Pagesなどに載せる前に確認したい」といった場面で、とても手軽に使える機能だと感じました。
そしてCloudflareなら上記以外でも、

• ●・パフォーマンスの向上
• ●・サイトの信頼性の向上
• ●・セキュリティの向上

が、一つのサービスで実現できますので非常におすすめです。

アクセリア自社CDNの開発と運用は、20年以上にわたります。それらの経験とノウハウを駆使したプロフェッショナルサポートをパッケージしたサービスが、［Solution CDN］と［Solution GateCore］です。
移行支援によるスムーズな導入とともに、お客様の運用負担を最小限に​とどめながら、WEBサイトのパフォーマンスとセキュリティを最大限に高めます。運用サポートはフルアウトソーシングからミニマムサポートまで、ご要望に合わせてご提供します。

また、Cloudflare Workers® 向け開発・構築支援サービスを開始しました。

2026年9月3日NEWSCloudflare Workers® 開発・構築支援サービス提供開始
－要件定義からスクラッチ開発、本番適用・運用保守まで専門チームが代行－›

Cloudflare（クラウドフレア）の導入や運用について、またそれ以外のことでもなにか気になることがございましたらお気軽にご相談下さい。