はじめに
本資料の目的
本資料は、SalesforceのLightning Web Components（LWC）に関するセキュリティの全体像を分かりやすく示すことを目的としています。設計思想やプラットフォーム固有の制約、Locker Serviceの役割、LWCが利用するウェブ標準の安全機能、そして実装時の注意点を丁寧に解説します。
誰に向けているか
- LWCで開発を始めたエンジニア
- セキュリティを意識して実装したい担当者
- アーキテクトやレビュー担当者
専門用語は最小限にし、具体例を交えて理解しやすく説明します。
本資料で扱う内容の流れ
- LWCとセキュリティの全体像：基本的な考え方を紹介します。
- Salesforce固有の制約：プラットフォームの仕組み上の注意点を説明します。
- LWCの持つセキュリティ機能：ブラウザ標準やフレームワークによる保護を示します。
- Locker Serviceとの関係：隔離やアクセス制限の仕組みを扱います。
- 実装の基本原則：日常的に意識すべきポイントを挙げます。
読み方の提案
各章は独立して読めますが、初めての方はこの章の後に全体像の章を読むと理解が深まります。実装例やチェックリストも後半に用意しています。
Lightning Web Components とセキュリティの全体像
概要
Lightning Web Components（LWC）はブラウザの標準機能を活かす設計で、セキュリティもまずブラウザ側の防御に依存します。LWC自体はコンポーネントの分離や安全なデータバインディングなどで攻撃面を小さくする役割を果たします。
設計方針（簡単な説明）
- Web標準を優先し、余分なフレームワーク層を減らします。これにより挙動が予測しやすくなります。
- Shadow DOMで表示をカプセル化し、DOM操作の干渉を防ぎます。
主なセキュリティ要素（具体例を含む）
- テンプレートバインディング: テキスト挿入は自動でエスケープされます。例えばユーザー入力をそのまま表示しても基本的にXSSリスクを低く抑えます。
- DOM操作の制限: document.querySelectorやinnerHTMLの直接使用は避け、templateやデータバインディングで実装します。innerHTMLを使うときは必ずサニタイズが必要です。
- Content Security Policy（CSP）: 外部スクリプト実行やインラインスクリプトを制限します。外部ライブラリは静的リソースとして扱います。
Salesforceプラットフォームとの関係
LWCはブラウザ防御に加え、Locker ServiceやApexの権限管理、共有設定と合わせた多層防御を想定します。ネットワーク経路やサーバ側の検証も重要です。
実践的な注意点
- 不要なグローバル参照を避け、公開APIのみ使います。
- 入力はサーバ側でも再検証します。クライアント側の保護に頼り切らないことが重要です。
- サードパーティコードは最小限にし、信頼できるものだけ導入します。
次章ではSalesforceプラットフォーム特有の制約を詳しく見ていきます。
Salesforceプラットフォーム特有のセキュリティ制約
Locker Service による実行環境の制限
Salesforce はブラウザ上の JavaScript 実行を制限する仕組みを提供します。これにより、コンポーネントは外部コードや他のコンポーネントの内部状態へ直接アクセスできません。具体的には、グローバル変数の共有や DOM の無制限な操作が制限されます。例として、外部ライブラリを直接 window に置いて共有することはできません。こうした制約はコードの分離を強化し、悪意ある操作を防ぎます。
Lightning Data Service（LDS）の利用推奨
データの読み書きには Apex を直接呼ぶ代わりに LDS を使うことが推奨されます。LDS はレコードのキャッシュや共有ルールの適用を自動で扱うため、不整合や権限の欠落による漏洩リスクを減らします。例えば、同じレコードを複数コンポーネントで表示するとき、LDS を使えば一元的に更新が反映されます。
イベント伝播とコンポーネント間通信の設計ルール
コンポーネント間は公開 API（プロパティや公開メソッド）やカスタムイベントを使って通信します。直接参照や深い DOM 探索は避けるべきです。例：子コンポーネントは親に対してカスタムイベントを発火し、親はそのイベントを受けて処理します。こうしたパターンは境界を明確にし、不正なデータ流入を防ぎます。
SLDS とレスポンシブデザインの活用
見た目には Salesforce Lightning Design System（SLDS）を使い、アクセシビリティや一貫性を保ちます。レスポンシブ設計を織り込むことで、異なる画面サイズでの表示崩れが原因の誤操作を減らせます。具体例として、ボタン位置がずれて誤タップを誘発するような問題を予防できます。
これらの制約は開発者の自由を一部制限しますが、プラットフォーム全体の安全性と一貫性を高めます。具体的な設計方針を守ることで、安全で保守しやすい LWC を実装できます。
LWCが備えるセキュリティ上の特徴
概要
LWCはブラウザの標準機能を活用して安全性を高めます。組み込みの仕組みでコンポーネントを分離し、外部からの干渉や意図しないデータ注入を防ぎます。
Shadow DOMによるカプセル化
Shadow DOMはコンポーネントのDOMとスタイルを他と別に保ちます。たとえば、親ページのCSSが子コンポーネントの見た目を壊しにくくなり、外部スクリプトが内部要素に直接アクセスできにくくなります。
コンポーネント単位の疎結合設計
LWCは小さな部品（コンポーネント）でUIを作ります。データの受け渡しは明示的なプロパティやイベントで行うため、意図しない参照やグローバルな状態依存が減ります。結果としてバグがセキュリティ問題に発展しにくくなります。
デフォルトの安全策
テンプレートは自動でエスケープされます。直接的なinnerHTML挿入や危険なDOM操作は制限され、必要な場合は明示的なAPIを通して行います。これによりクロスサイトスクリプティング（XSS）のリスクを低減します。
実際の効果と注意点
- スタイルやDOMの分離で見た目や操作の衝突が減ります。
- 明示的なデータ受け渡しで予期せぬアクセスを防げます。
- 標準機能に依存するため、ブラウザやフレームワークの更新に注意が必要です。
これらの特徴でLWCはセキュアなUI基盤を提供しますが、開発者側の安全なコーディングも重要です。
Locker ServiceとLWCセキュリティ
概要
Locker ServiceはLightningコンポーネントを安全なサンドボックスで実行する仕組みです。コンポーネントごとに実行環境を分け、他のコンポーネントやページ全体への不正な操作を防ぎます。これによりスクリプトインジェクションやXSSの影響範囲を小さくできます。
主な制約と仕組み
- グローバルオブジェクトへの直接参照を制限します（windowやdocumentはラップされます）。例えば、別のコンポーネントのグローバル変数を直接読めません。
- evalやnew Functionは禁止されます。動的コード実行を避ける設計が必要です。
- 外部ライブラリは一部機能が制限されます。jQueryなどを使う場合は静的リソースとして読み込み、互換性を確認してください。
開発者への影響と対応
コンポーネント間のデータ連携は公開API（プロパティやイベント）、またはLightning Message Serviceを利用します。DOM操作はtemplate.querySelector系を使い、グローバル依存を避けると安全です。サードパーティコードは最小限にし、動作確認を徹底してください。
セキュリティ上の利点
コンポーネント境界を明確に保つことで、万一の脆弱性があっても被害を局所化できます。設計段階で境界を意識するだけでリスクは大きく下がります。
安全なLWC実装のための基本原則
ユーザー入力は必ずサニタイズ
ユーザーが入力した値はそのまま表示や送信に使わないでください。例：フォームから受け取った文字列に含まれる「<」「>」は < と > に変換してから表示します。簡単な変換でもXSSリスクを大きく下げられます。
表示には専用コンポーネントを使う
テキスト表示には lightning-formatted-text を使ってください。コンポーネントは内部で安全に処理するため、HTMLを直接埋め込むより安全です。生のHTMLを挿入する場合は最小限にし、十分なサニタイズを行ってください。
直接のDOM操作を避ける
templateやデータバインディングで表示を制御し、innerHTML や eval、外部スクリプトの挿入は避けます。どうしても必要な場合は入力の検証とサニタイズを徹底してください。
サーバー側でも検証する
クライアントで行う検証はユーザビリティ向上のためです。権限チェックやデータ整合性は必ずApex側でも行ってください。これにより不正なアクセスや改ざんを防げます。
権限と最小権限の原則
アクセスするデータや操作は必要最小限に限定してください。@apiで公開するプロパティやメソッドは意図を明確にし、不要な公開を避けます。
開発時のチェックリスト
- 入力のサニタイズ（例：< を < に）
- lightning-formatted-* の利用検討
- innerHTML を使っていないか確認
- Apexでのサーバー検証と共有ルール確認
- 不要な公開プロパティやグローバル変数がないか確認
これらの基本を守ることで、LWCアプリケーションのセキュリティを高め、安心して運用できます。
