---
title: "HttpOnly Cookieとは？HTML共有・AI生成サイトでの意味をやさしく解説"
description: "HttpOnly Cookie属性の意味とAI生成HTML共有時のセキュリティ上の意味を解説。XSS対策として何が守られ何が守られないかを、Web公開の初心者にも分かりやすく整理しています。"
image: "https://giga-site.com/og-image.png"
canonical: "https://giga-site.com/articles/what-is-httponly-cookie-html-share"
markdown: "https://giga-site.com/articles/what-is-httponly-cookie-html-share/index.md"
category: "用語解説"
publishedAt: "2026-06-25"
updatedAt: "2026-06-25"
readingMinutes: 5
---
# HttpOnly Cookieとは？HTML共有・AI生成サイトでの意味をやさしく解説
Cookieに「HttpOnly」属性を付けると、JavaScriptからその値を読み取れなくなります。XSS（クロスサイトスクリプティング）攻撃でスクリプトが注入されてもCookieが盗まれにくくなる重要なセキュリティ対策です。AI生成HTMLをプレビュー共有する際に、このHttpOnly属性が正しく付いているかどうかを確認することで、意図しない情報漏洩を防げます。
> Source HTML: https://giga-site.com/articles/what-is-httponly-cookie-html-share
> Article index: https://giga-site.com/articles/index.md
## ひとことで言うと
HttpOnly属性はCookieに付けるフラグで、Set-CookieヘッダーにHttpOnly;と書くだけで有効になります。この属性が付いたCookieは`document.cookie`経由でJavaScriptから読み書きできなくなり、HTTPリクエストの際にのみサーバーへ自動送信されます。セッションIDや認証トークンをHttpOnly Cookieに格納しておけば、XSSでスクリプトを注入された場合でも値を外部に漏らされるリスクを大幅に下げられます。
HttpOnly属性はあくまでJavaScriptからのアクセスを防ぐだけで、ネットワーク上の盗聴は防げません。HTTPS通信と組み合わせて初めて十分な保護になります。AI生成HTMLのコードがCookieを扱う場合は、HttpOnlyとSecureの両属性がセットで付いているか確認する必要があります。
- 相手がログインなしで開ける状態か確認する
- PCとスマホで最低1回ずつ表示を確認する
- 内部情報・個人情報・不要な外部送信が残っていないか見る
- レビュー期限と修正時の差し替え方を決めておく
## HTML共有で関係する場面
AIで生成したHTMLにバックエンドAPIへのフェッチコードが含まれ、認証はCookieベースで行う設計の場合、HttpOnly属性付きのCookieを前提にしていると静的HTMLのみを共有しても認証が成立しません。認証部分をサーバー側で処理する構成は静的共有と相性が悪いため、プレビュー用にはモックデータや認証バイパスモードを別途用意しておくとスムーズです。
ギガサイト便のような静的HTML配信サービスはHTTPレスポンスヘッダーをHTMLから制御できないため、Set-CookieヘッダーでHttpOnly属性を付けることができません。Cookieを使いたい場合はJavaScriptからdocument.cookieを操作する形になり、必然的にHttpOnly保護が使えません。このような制約がある共有サービスでは、センシティブな情報をCookieに保存するコードは除去してから配信することを推奨します。
## よくある誤解
「HttpOnly CookieはJavaScriptから完全に見えない」は正しいですが、「HttpOnly Cookieは絶対に安全」は誤りです。HTTPSを使わなければ通信経路で傍受される可能性があり、CSRF攻撃ではCookieの内容を知らなくてもリクエストを偽造できます。HttpOnlyはXSS経由の盗難には有効ですが、それ単独では万全ではありません。
「AI生成HTMLがCookieを読めないならHttpOnlyは関係ない」と思われることがありますが、AIが生成したHTMLに悪意あるサードパーティスクリプト（CDN経由）が含まれた場合、それらのスクリプトもdocument.cookieを読もうとします。HttpOnly属性が付いていれば読み取りを防げるため、共有前にCookieの設定方法を確認することには意味があります。
## 安全に使うための注意点
外部に共有するHTMLのコードにCookieを扱う記述がある場合、ブラウザ開発者ツールの「Application」→「Cookies」でHttpOnlyチェックが付いているかを確認します。HttpOnlyがついていないCookieにセッションIDが格納されている場合は、XSS脆弱性があれば即座に盗まれるリスクがあります。AIが生成したコードには属性が省略されやすいため、レビュー項目として明示的にチェックリストに加えておきましょう。
静的HTMLの共有ではサーバー側のCookie設定ができないため、認証情報はCookieではなくURLのクエリパラメータや署名付きトークンで扱うことを検討してください。ただしクエリパラメータはブラウザ履歴やサーバーログに残るリスクがあるため、機密度の高いプレビューにはパスワード付きURLやメール認証を提供するサービスを使うのが安全です。
## よくある質問
### HttpOnly属性を付けるとブラウザのCookie確認画面からも見えなくなりますか？
いいえ、開発者ツールの「Cookies」タブからは引き続き値を確認できます。HttpOnlyはJavaScriptのdocument.cookieからのアクセスを防ぐものであり、開発者ツールには影響しません。
### 静的HTMLをギガサイト便でアップした場合、HttpOnly Cookieは使えますか？
使えません。HttpOnly属性はSet-CookieサーバーヘッダーでのみでCookieが設定できます。静的HTML配信ではJavaScript経由でしかCookieを操作できないため、HttpOnly保護は付けられません。
### AI生成HTMLにCookieのコードがあるかどうかを素早く確認するには？
HTMLソースをテキストエディタで開き「document.cookie」「Set-Cookie」「cookieName」などのキーワードを検索してください。またはブラウザ開発者ツールの「Application」→「Cookies」で実際に保存された値を確認する方法もあります。
## 関連記事
- [SameSite Cookieとは？HTML共有・AI生成サイトでの意味をやさしく解説](https://giga-site.com/articles/what-is-cookie-samesite-html-share/index.md)
- [Secure Cookieとは？HTML共有・AI生成サイトでの意味をやさしく解説](https://giga-site.com/articles/what-is-secure-cookie-html-share/index.md)
- [サードパーティCookieとは？HTML共有・AI生成サイトでの意味をやさしく解説](https://giga-site.com/articles/what-is-third-party-cookie-html-share/index.md)
- [SRI（Subresource Integrity）とは？HTML共有・AI生成サイトでの意味をやさしく解説](https://giga-site.com/articles/what-is-sri-html-share/index.md)
- [Referrer-Policyとは？HTML共有・AI生成サイトでの意味をやさしく解説](https://giga-site.com/articles/what-is-referrer-policy-html-share/index.md)
- [Permissions-Policyとは？HTML共有・AI生成サイトでの意味をやさしく解説](https://giga-site.com/articles/what-is-permissions-policy-html-share/index.md)
```json
{
"@context": "https://schema.org",
"@type": "Article",
"headline": "HttpOnly Cookieとは？HTML共有・AI生成サイトでの意味をやさしく解説",
"description": "HttpOnly Cookie属性の意味とAI生成HTML共有時のセキュリティ上の意味を解説。XSS対策として何が守られ何が守られないかを、Web公開の初心者にも分かりやすく整理しています。",
"datePublished": "2026-06-25",
"dateModified": "2026-06-25",
"mainEntityOfPage": "https://giga-site.com/articles/what-is-httponly-cookie-html-share",
"url": "https://giga-site.com/articles/what-is-httponly-cookie-html-share",
"inLanguage": "ja",
"image": "https://giga-site.com/og-image.png",
"articleSection": "用語解説",
"author": {
"@type": "Organization",
"name": "ギガサイト便"
},
"publisher": {
"@type": "Organization",
"name": "ギガサイト便"
},
"mainEntity": [
{
"@type": "Question",
"name": "HttpOnly属性を付けるとブラウザのCookie確認画面からも見えなくなりますか？",
"acceptedAnswer": {
"@type": "Answer",
"text": "いいえ、開発者ツールの「Cookies」タブからは引き続き値を確認できます。HttpOnlyはJavaScriptのdocument.cookieからのアクセスを防ぐものであり、開発者ツールには影響しません。"
}
},
{
"@type": "Question",
"name": "静的HTMLをギガサイト便でアップした場合、HttpOnly Cookieは使えますか？",
"acceptedAnswer": {
"@type": "Answer",
"text": "使えません。HttpOnly属性はSet-CookieサーバーヘッダーでのみでCookieが設定できます。静的HTML配信ではJavaScript経由でしかCookieを操作できないため、HttpOnly保護は付けられません。"
}
},
{
"@type": "Question",
"name": "AI生成HTMLにCookieのコードがあるかどうかを素早く確認するには？",
"acceptedAnswer": {
"@type": "Answer",
"text": "HTMLソースをテキストエディタで開き「document.cookie」「Set-Cookie」「cookieName」などのキーワードを検索してください。またはブラウザ開発者ツールの「Application」→「Cookies」で実際に保存された値を確認する方法もあります。"
}
}
]
}
```