SalesforceサイトでQRコードを表示するページの作り方

なぜCDNを直読みできないのか

サイトに限らず、Salesforceのページは既定のコンテンツセキュリティポリシー（CSP）で、スクリプトを自組織のオリジンからしか読み込めません。<apex:includeScript> で他社のCDNを直接指定しても、ブラウザ側でブロックされて動きません。外部のJavaScriptライブラリを使うには、ファイルを静的リソースとして組織の中に置くか、CSPの信頼済みURLにそのCDNを登録するかのどちらかが要ります。

ライブラリを静的リソースに登録する

QRコードの生成には、jQueryのプラグインとして呼び出せるライブラリを使います。コードを描画する中核部分と、jQueryから呼び出すための橋渡し部分の、2つのJavaScriptファイルで構成されます。

1. 配布元からファイルを入手する

   ライセンス表記（MITライセンスなど）を含んだ状態で、最新のファイルを配布元から取得します。ライセンス表記の行は削らずに残します。

2. 静的リソースを新規作成する

   「設定」→「静的リソース」→「新規」で、ファイルごとに名前を付けてアップロードします。MIMEタイプは text/javascript にします。

3. jQuery本体も静的リソースへ置く

   jQuery本体をCDNから読み込むなら信頼済みURLの登録が要ります。外部への依存を減らすなら、jQuery本体も同じように静的リソースへ登録します。

⚠️ ライブラリの中身をそのままコピーして使う場合も、著作権表示とライセンス条件は削りません。改変・再配布の条件はライブラリごとに違うので、配布元の記載に従います。

Visualforceページから読み込む

静的リソースに置いたファイルは $Resource.リソース名 で参照します。外部のURLを直接指定するより、この形のほうがCSPに触れません。

CreateQRcode.page

<apex:page docType="html-5.0" standardStylesheets="false" showHeader="false" sidebar="false">
  <apex:includeScript value="{!$Resource.jqueryCore}" />
  <apex:includeScript value="{!$Resource.qrcodeCore}" />
  <apex:includeScript value="{!$Resource.jqueryQrcode}" />
  <div id="qrcode"></div>
  <script>
    $('#qrcode').qrcode(location.href);
  </script>
</apex:page>

静的リソースだけでQRコードを表示するページです。外部CDNは使いません。

このページは特定のレコードに結びついた標準コントローラを使っていません。表示するだけのページに標準コントローラを付けると、ページを表示するためにそのオブジェクトの権限をゲストユーザへ付けることになりがちです。必要なければ付けません。

サイトを作り公開する

1. サイトを新規作成する

   サイトの表示ラベルとサイト名を決め、有効なサイトのホームページに作成したVisualforceページを指定します。

2. ゲストユーザプロファイルでページを許可する

   サイトのゲストユーザプロファイルの「有効なVisualforceページ」に、このページだけを追加します。他のページは加えません。

3. オブジェクト・項目の権限を確認する

   このページはオブジェクトを扱わないので、ゲストユーザに新しくオブジェクト権限を足す必要はありません。既定のまま、何も見えない状態を保ちます。

ゲストユーザの権限は必要な分だけ

Salesforceの既定は、ゲストユーザにとって最も制限された状態です。サイトを作った直後は、レコードもオブジェクトもほぼ見えません。今回のように画面を1枚見せるだけの用途なら、それで足ります。ゲストユーザの共有ルールやオブジェクト権限は、業務上どうしても必要になった項目だけ、都度足していくのが安全な進め方です。あらかじめ広く権限を開けておく組み方はおすすめしません。

動作確認

サイトのURLを開き、QRコードが表示されることを確認します。表示されない場合は、ブラウザの開発者ツールのコンソールを開き、コンテンツセキュリティポリシー違反の警告が出ていないかを見ます。script-src に関する警告が出ていれば、読み込んでいるファイルのどれかが静的リソース以外を指しています。

ここで間違えやすい

確認した環境

• 2026年9月／Salesforce Summer '26時点の公式ドキュメントで、コンテンツセキュリティポリシーとサイトのゲストユーザの既定挙動を確認しています
• QRコード生成ライブラリ自体の最新の入手先・バージョンは、配布元で確かめてください

まとめ

• Salesforceのページは既定で自組織のオリジンからしかスクリプトを読み込めません。外部CDNの直読みはブロックされます
• 外部ライブラリは静的リソースへ置き、$Resource で読み込むと安定します
• ゲストユーザの権限は、既定が最も制限された状態です。必要な分だけ足します
• 表示専用のページには標準コントローラを付けないことで、ゲストユーザへの余分なオブジェクト権限を避けられます
• ライブラリを流用するときは、著作権表示とライセンス条件を残します