JavaScript ライブラリが Locker 準拠かどうかの確認

このガイドを使用して、サードパーティ JavaScript ライブラリに Lightning Locker との互換性があるかどうかを確認します。

このガイドは、組織が Lightning Locker を使用している場合に適用されます。組織で Lightning Web セキュリティ (LWS) が有効になっている場合、ほとんどのサードパーティ JavaScript ライブラリは変更なしに期待どおり機能します。ただし、"use strict" を明示的に設定しているライブラリには、LWS を利用するための変更が必要です。「LWS に対するサードパーティライブラリの考慮事項」を参照してください。

コンポーネントで使用するすべてのライブラリは、コンポーネントと同じ Lightning Locker 要件を満たす必要があります。

名前空間を超えて DOM を直接操作しない。「DOM のアクセスコンテインメント」を参照してください。
JavaScript ES5 の厳格モードをサポートする。「JavaScript の厳格モードの適用」を参照してください。
Lightning Locker でブロックされる JavaScript API を回避する。「Lightning Locker ツール」に記載されている「Locker API Viewer」を参照してください。

サードパーティライブラリが Lightning Locker に準拠するかどうかを確認するには、次の手順をお勧めします。

ライブラリを使用する小さなサンプルアプリケーションを作成します。
ライブラリがエラーなく読み込まれ、基本機能をコールできることを確認します。
Locker が有効になっている Locker コンソールを使用します。
次の一般的な違反がないかどうかを確認します。

グローバルになる変数の宣言

厳格モードでは、変数がグローバル変数になることは禁止されています。このルールに違反しないようにするには、ライブラリ内でライブラリグローバルを window に明示的に添付します。

CSP 違反

コードをスキャンして、eval()、new Function()、または <script> タグを使用していないかどうかを確認します。

DOM アクセス違反

API に渡す要素のみを操作するのではなく、DOM の広範なスキャンを実行しようとしているライブラリはブロックされます。ライブラリで DOM を操作する場合は、lwc:dom="manual" ディレクティブをネイティブ HTML 要素に追加して、操作を許可することができます。詳細は、「サードパーティ JavaScript ライブラリの使用」を参照してください。

標準外またはサポート対象外の DOM API の使用

Locker API Viewer で [Supported (サポート対象)] とマークされている API と [Not Supported (サポート対象外)] とマークされている API を確認します。

ライブラリが準拠していない場合は、ライブラリ管理者に、コードを更新して Lightning Locker に準拠するように依頼します。また、プロジェクトがオープンソースの場合は、変更を自分で提供します。別のオプションとして、リポジトリをフォークし、変更を加えて、独自のバージョンのライブラリを作成することもできます。