導入

サンドボックス化された HTML ランナーは、コードを実行するための安全な環境を提供します。サンドボックスはコードをページの残りの部分やシステムから隔離し、悪意のあるコードやバグのあるコードであってもプレビュー パネルを超えて害を及ぼすことがないようにします。

サンドボックスとは何ですか?

Web 開発では、サンドボックスは分離された実行環境です。サンドボックス内で実行されているコードは、Cookie、ローカル ストレージ、他のブラウザ タブ、オペレーティング システムなど、サンドボックスの外部のリソースにアクセスできません。私たちの HTML サンドボックスは、HTML5 iframe サンドボックス属性を使用してこの分離を作成します。

セキュリティ層

  • Iframe サンドボックス属性 — 埋め込みコンテンツの機能を制限します
  • Blob URL の分離 — コードはメイン ドメインからではなく、一時的な BLOB URL から読み込まれます。
  • サーバー送信なし — コードがブラウザから離れることはありません
  • 自動クリーンアップ — BLOB URL は使用後に取り消されます

サンドボックスでできること

  • JavaScript の実行 (インタラクティブなプレビュー用)
  • モーダル ダイアログ (アラート、確認、プロンプト)
  • CSS レンダリング (アニメーションとトランジションを含む)
  • 画像とメディアのレンダリング
  • 外部リソースの読み込み (フォント、CDN ライブラリ)

サンドボックスがブロックするもの

  • 親ページのナビゲーション
  • フォームの送信
  • ポップアップウィンドウ
  • 親ページの Cookie またはストレージへのアクセス
  • 他のタブまたはウィンドウへのアクセス

もっと詳しく知る

詳細な技術的な説明については、方法論 ページをご覧ください。

よくある質問

いいえ。サンドボックスは、コードを親ページおよびブラウザーのデータから分離します。

サンドボックスは重要な保護を提供しますが、完璧なサンドボックスはありません。信頼できるソースからのコードのみを実行してください。

無限ループはサンドボックス化された iframe 内で実行されます。タブを閉じるか、ページをリロードして停止できます。