メインコンテンツまでスキップ

Apple Walletの設定方法

このページでは、Apple Wallet を設定し、お客様がストアの会員証(バーコード・QRコード)をApple Walletに登録する方法を案内します。

Apple Walletに会員証を登録することで、お客様はロック画面からすぐにバーコード・QRコードを表示できるため、ストアにログインをするという手間を省くことで、よりスムーズな購買体験を提供いただけます。

前提条件​

本機能のご利用にはApple Developer Program の登録が必要です。 登録には以下の2つの項目が必須となっております。

  • 二要素認証が有効になっている Apple ID
  • D-U-N-S番号（法人名義でのお申込みの場合）

登録の詳細についてはプログラムへの登録をご参照ください。Apple Developer Programには年間登録料（99USD~）が発生します。

Apple Walletが設置できるテーマ

  • お客様アカウントがお客様アカウント(おすすめ)
  • お客様アカウントが以前のバージョンでOS2.0対応テーマ

Apple Walletが設置できないテーマ

  • お客様アカウントが以前のバージョンでOS2.0非対応のテーマ

Apple Walletの設定方法 - 共通部分​

Barcodeatorアプリで Apple Wallet のタブを開きます。

1. フィールド入力および画像のアップロード​

  • カードタイトル
  • バーコードタイプ(QRコード or CODE128)
  • 画像(ロゴ、アイコン、メイン画像) × 3サイズ

上記を設定します。Apple Walletに設定項目がどのように反映されるかは、ページ右側のイメージを参照ください。

Apple Wallet 画像アップロード画面

画像アップロード後、Apple Wallet保存のボタンを押して、画像を保存します。

2. CSR（証明書署名要求ファイル）のダウンロード​

画像のアップロードが完了すると、Appleの証明書発行に必要なCSRファイル(証明書署名要求ファイル) をダウンロードできます。

CSRは、次の手順でApple Developerの管理画面で証明書を発行する際に使用します。

画像アップロード後の画面

Apple Developerで証明書(pass.cer)を発行する手順​

以下はApple公式のDeveloper管理画面で行う証明書発行のステップです。

1. Apple Developerにログイン​

Certificates/証明書のリンクをクリックしましょう。

Apple Developer ホーム

2. Identifiersを開き、新しいIdentifierを作成​

Identifiersの横にある+のボタンをクリックしてください。

Register an App ID

3. Pass Type ID を選択​

Register a new identifierでPass Type IDsを選択し、Continueボタンをクリックしましょう。

Register a New Identifier

Description、Identifierに適した情報を入力します。Descriptionはストア名 Pass Type ID Identifierは pass.com.myshopify.ストア名 のような形式で記入すると、区別がつきやすいです。

Pass Type ID 選択

Registerをクリックして登録を完了しましょう。

Pass Type ID 情報入力

4. Identifiers一覧から該当Pass Type IDを開く​

手順3で作成した、Pass Type IDsをIdentifiers一覧からクリックします。

Identifiers Home

5. 証明書を作成(Create Certificate)​

Create Certificateボタンをクリックして、証明書作成に進みます。

Create Certificate

Choose Fileをクリックして、Barcodeatorアプリからダウンロードした CSRファイル をアップロードしてください。

※ Enter your Pass certificate Nameの欄は空白でも構いません。

新しい証明書作成

CSRファイルをアップロードすると、Continueボタンかクリック可能となります。Continueのボタンを押し、登録を完了させてください。

6. Certificate(pass.cer)のダウンロード​

5までの手順が完了すると、Apple側で pass.cer が生成されます。

Downloadボタンを押して、pass.cer ファイルを任意の場所に保存してください。

証明書ダウンロード

Apple Developerの管理画面での操作は以上で完了です。

Apple Walletの設定方法 - Barcodeatorにpass.cerをアップロード​

Apple Developerで発行された pass.cer を Barcodeatorアプリに戻ってアップロードします。

証明書アップロードのエリアをクリックまたは、ドラッグ&ドロップで対象の場所にpass.cerファイルを反映してください。

pass.cerアップロード画面

アップロードが完了すると以下のような状態になります。

pass.cerアップロード完了

⚠️ 証明書は約1年で失効します。毎年更新対応が必要となりますので、更新忘れにご注意ください。

Apple Walletの設置方法​

お客様アカウント(おすすめ)​

Apple Walletはプロフィールページにアプリブロックとして表示できます。

  • Barcodeatorアプリのホーム画面で「プロフィールページを編集」
    または
  • Shopify管理画面 → 設定 → チェックアウト → カスタマイズ

左メニューの アプリ から Add to Apple Wallet を選択し、追加先で プロフィール を選択します。

お客様アカウント(おすすめ)での表示例

以前のバージョンかつOS2.0対応テーマ​

  • Shopify管理画面 → 販売チャネル → オンラインストア → テーマ → カスタマイズ

表示された画面で セクション追加 > アプリ > Add to Apple Wallet をクリックし追加します。

以前のアカウントでの表示例

⚠️ カスタマイズ画面ではダミーデータしか表示されません。
実際の動作確認はiPhoneのブラウジングからログインした状態で 行ってください。

Apple Wallet設定が未完了の場合のエラー​

Apple Walletの設定が正常に完了していない場合、アプリブロック追加時に以下の警告が表示されます。

お客様アカウント(おすすめ)の例​

Apple Wallet設定エラー（新UI）

以前のバージョンのアカウントの例​

Apple Wallet設定エラー（レガシー）

⚠️ エラーが表示された場合、
Apple Walletの設定方法 - 共通部分の内容（画像・CSRアップロード・pass.cerアップロード）を再確認してください。

以上で、Apple Walletの設定は完了です。
続いて、Shopify POSでBarcodeatorを使用するにお進みください。