rakuishi.com

・ iOS

[Passbook プログラミング] はじめてのパス（Pass）作成

iOS 6 の新機能として、Passbook があります。航空機のチケット、お店のクーポン、ポイントカードなどがひとつのアプリで管理できるようになる、というものです。Passbook では、それらをパスと呼んでいます。

パスは、iOS Developer Program（$99/year）の登録をしていれば、実機に配信することができます（Mac も必要です）。パスの作成は、テキストエディタで JSON 形式のファイルを編集し、画像を用意することで簡単にできます。

この記事では、パスを作成して、配布する方法を解説します。

パスを作成 → 配布する簡単な流れ

  1. パスを作成するのに必要なファイルをダウンロードする
  2. Provisioning Portal で証明書の登録などを済ませる
  3. テンプレートを編集して自分仕様に編集する
  4. テンプレートファイルに付属するツールでパッケージ化（.pkpass 形式）する
  5. .pkpass をウェブにアップロードして、iPhone の Safari からリンクを踏む

1. パスを作成するのに必要なファイルをダウンロードする

ここから必要なファイルをダウンロードします。

2. Provisioning Portal で作業する

  1. iOS Provisioning Portal で「Pass Type IDs」を選択する
  2. 「New Pass Type ID」を選択する
  3. Description（例：test）と Pass Type Identifier（例：pass.com.rakuishi.test）を入力して「Submit」ボタンを押す
  4. 上記で登録したものが「Pass Type IDs」に追加されているので「Configure」リンクをたどる
  5. さらに「Configure」して、ポップアップの指示に従い、CSR ファイルをアップロードする。その後、証明書をダウンロードする画面になるのでダウンロードする。
  6. 証明書を開いてキーチェーンに保存する。保存した証明書の「情報を見る」で「部署」の値（チーム ID）と「組織」を控える。このチーム ID は、アルファベット大文字+数字の 10 桁の文字列でした。

3. テンプレートを編集する

ここからは、パスの作成になります。パスの作成は、テンプレートファイルを編集して作成するのが最初は簡単です。

テンプレートフォルダ → Passes → Generic.raw → pass.json のファイルを参考に、ここでは、最低限の機能に絞ったパスを作成してみます。JSON ファイルは、通常のテキストエディタで編集できます。

passTypeIdentifier（Pass Type Identifier）, teamIdentifier（部署）, organizationName（組織）の値は、自分の値に変えておきます。

pass.json

{
  "formatVersion" : 1,
  "passTypeIdentifier" : "pass.com.rakuishi.test",
  "serialNumber" : "1234567890",
  "teamIdentifier" : "CLLJ787FV4",
  "organizationName" : "KOICHIRO OCHIISHI",
  "logoText" : "rakuishi",
  "description" : "This is my website.",
  "foregroundColor" : "rgb(44, 44, 44)",
  "backgroundColor" : "rgb(255, 255, 255)",
  "generic" : {
    "primaryFields" : [
      {
        "key" : "description",
        "label" : "This is my website.",
        "value" : "http://rakuishi.com/"
      }
    ]
  "locations" : [
    {
      "longitude" : 139.676183,
      "latitude" : 35.677061
    }
  ],
  }
}

位置情報を登録しておくと、その周囲に近付いた時に、通知が来ます。パスのタイプによっても違うのですが、100m 〜 1000m 範囲に入ると通知が来るようです。また、時刻による通知もできます。

住所やランドマーク名から緯度、経度を取得するのに、Geocoding - 住所から緯度経度を検索というサービスを利用しました。ちなみに、経度 = longitude, 緯度 = latitude です。

ここでは、画像を含めて、次のようなファイルを用意しました。

pass.json
icon.png
icon@2x.png
logo.png
logo@2x.png

4. パッケージ化（.pkpass）

テンプレートフォルダ → signpass フォルダにある Xcode プロジェクト（signpass.xcodeproj）を開いて、ビルドします。

作成された実行形式ファイル signpass をユーザーフォルダの書類に置きます。signpass は、Show in Finder から保存場所に飛べます。

書類（Documents）に、作業フォルダも移しておきます。そして、Terminal から以下のようなコマンドで .pkpass ファイルが作成できます。

cd Documents/
./signpass -p Passbook.raw

.pkpass ファイルは、OSX Lion では、ダブルクリックで開くことができます。

5. ウェブにアップロードする

.pkpass ファイルをウェブにアップロードします。そのリンクを iPhone の Safari から踏めば、Passbook に格納されるのですが、サーバーの設定によってはダウンロードできません。

これは、.pkpass 拡張子と MIME タイプの関連付けがうまくいってないからです。僕は、.pkpass ファイルと同じ階層に .htaccess ファイルを作成し、以下の内容を記述しました。

.htaccess

AddType application/vnd.apple.pkpass pkpass

ここまで作業すれば、iPhone の Safari から以下のリンクを踏むと、Passbook にパスが格納されます。

Passbook.pkpass をダウンロードする

さいごに

パスは、サーバーを用意すれば更新作業を行うことができるみたいです。詳しい情報は、アップルが用意しているドキュメントをご覧ください。

参考：Passbook プログラミングガイド