この文章は Salesforce 機械翻訳システムを使用して翻訳されました。詳細はこちらをご参照ください。
英語に切り替える

Lightning コンポーネントでのサードパーティ CSS の読み込み

カスケードスタイルシート (CSS) とその他のリソースは、サードパーティから読み込むのではなく、静的リソースに組み込んでください。

この要件は、「サードパーティエンドポイントからの JavaScript ファイルの読み込み」での説明と同じ理由で適用されます。ソリューション全体をバージョン管理下におく必要があり、組織のシステム管理者と Salesforce セキュリティレビューチームが変更を認識する必要があります。

<link> タグを使用して外部 CSS リソースを読み込むことは、このセキュリティポリシーに違反します。

簡潔にまとめると、解決策は次のようになります。
  1. サードパーティ CSS ファイルを静的リソースに保存します。
  2. このリソースをソリューションパッケージに追加します。
  3. .cmp または .app マークアップの <ltng:require> タグを使用して CSS を参照します。

詳細は、『Lightning Aura コンポーネント開発者ガイド』の「外部 CSS の使用」を参照してください。

Aura の例

次のコードスニペットは、セキュリティ違反と、その違反を Aura の Lightning コンポーネントで修正する方法を示しています。この Aura コンポーネントコードは、<link> タグを使用して外部 CSS リソースを読み込むため安全ではありません。
1<aura:component>
2     <link rel="stylesheet" href="https://example.com/styles.css" type="text/css">
3<aura:component>
次の Aura コンポーネントコードは、<ltng:require> を使用しています。静的リソースとしてアップロードされた外部 CSS リソースを参照するには、こちらの方法の方が安全です。
1<aura:component>
2    <ltng:require styles="{!$Resource.SLDSv1 + '/assets/styles/lightning-design-system-ltng.css'}" />
3</aura:component>