Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
PHPでGoogle Walletにチケットを追加する
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
muno92
PRO
October 25, 2023
Resources
Programming
860
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
PHPでGoogle Walletにチケットを追加する
muno92
PRO
October 25, 2023
Resources
16スライド目のGist
https://gist.github.com/muno92/678cde39ae74877ba3c888c1ec903797
More Decks by muno92
See All by muno92
PHPでバイナリをパースして理解するASN.1
muno92
PRO
0
490
forteeの改修から振り返るPHPerKaigi 2026
muno92
PRO
3
370
Cloudflare Tunnelで開発環境をインターネットに公開する
muno92
PRO
0
110
2年のAppleウォレットパス開発の振り返り
muno92
PRO
0
260
PsySHから紐解くREPLの仕組み
muno92
PRO
1
850
RayでPHPのデバッグをちょっと快適にする
muno92
PRO
0
700
Appleウォレット / Googleウォレットに チケットを保存する方法
muno92
PRO
2
4.6k
歴史を重ねたシステムの開発に趣味で関わり始めて
muno92
PRO
1
610
カンファレンススタッフはいいぞ
muno92
PRO
1
420
Other Decks in Programming
See All in Programming
[2026年度第1回ORセミナー] 計画最適化ベンチャーと競技プログラミング人材
terryu16
0
250
並列実装の現場、2ヶ月間実務でAIを使い倒したAIもPCも私も限界が近い
ming_ayami
0
110
プロパティの順序で型推論が壊れる!? TypeScript6.0の修正からContext-Sensitivityの仕組みを追う
bicstone
2
1.3k
開発体験を左右するライブラリの API 設計 - GraphQL スキーマ構築ライブラリから考える #tskaigi
izumin5210
2
1.6k
JavaDoc 再入門
nagise
0
290
Webフレームワークの ベンチマークについて
yusukebe
0
140
IBM Bobを活用したレガシーアプリの最新化
oniak3ibm
PRO
1
170
作って学ぶ、 JSX (TSX) ランタイムの基本
syumai
7
1.5k
Agentic UI
manfredsteyer
PRO
0
110
気づいたらRubyで100作品 ー クリエイティブコーディングが生活の一部になるまで / 100 Ruby Sketches Later: How Creative Coding Became Part of My Life
chobishiba
3
550
セキュリティの専門家じゃなくてもできる。「セキュリティ意識」をアップデートして サプライチェーン攻撃への耐性を高めよう。
tk3fftk
5
650
「AIで開発し、AIを届ける」をEvalでつなぐ 〜AIネイティブに始めるプロダクト開発の実践〜 / Connecting "Develop with AI, deliver AI" with Eval
rkaga
4
4.5k
Featured
See All Featured
Leveraging Curiosity to Care for An Aging Population
cassininazir
1
260
Conquering PDFs: document understanding beyond plain text
inesmontani
PRO
4
2.8k
Optimizing for Happiness
mojombo
378
71k
Organizational Design Perspectives: An Ontology of Organizational Design Elements
kimpetersen
PRO
1
720
技術選定の審美眼(2025年版) / Understanding the Spiral of Technologies 2025 edition
twada
PRO
118
120k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
10
1.2k
jQuery: Nuts, Bolts and Bling
dougneiner
66
8.5k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
The Cost Of JavaScript in 2023
addyosmani
55
10k
Claude Code どこまでも/ Claude Code Everywhere
nwiizo
65
56k
A brief & incomplete history of UX Design for the World Wide Web: 1989–2019
jct
2
390
More Than Pixels: Becoming A User Experience Designer
marktimemedia
3
430
Transcript
PHPでGoogle Walletにチケットを追加する 2023/10/25 第157回 PHP勉強会@東京 muno92 1
自己紹介 X (旧Twitter): @muno_92 色々なカンファレンスでスタッフ をしています PHPerKaigi 2020、2022〜 iOSDC Japan
2023 PHP Conference Japan 2023 PHPカンファレンス小田原 2024 2
(宣伝) PHPerKaigi 2024 日程: 2024年3月7日(木)〜9日(土) 会場: 中野セントラルパークカンファレンス & ニコニコ生放送 現在スポンサー募集中!
https://phperkaigi.jp/2024/ 3
(宣伝) PHPカンファレンス小田原 2024 日程: 2024年4月13日(土) 会場: おだわら市民交流センター 「UMECO」 参加人数:100名前後(予定) 現在スポンサー募集中!
https://phpcon-odawara.jp/ 4
カンファレンスによって様々な受付方法 各種カンファレンスの受付にQRコードを使用する場合があるが、その表示方法は様々 専用アプリ Webサイト メール添付 参加者目線: 少し手間 運営目線: 全ての参加者がスッとQRコードを提示出来るとは限らない 中にはQRコードを表示するためのログインで引っかかってしまう人も
5
こんなチケットをGoogle Walletに 追加出来たら カンファレンス情報 名前 ロゴ バナー 参加者名 イベント種別(本編、懇親会な ど)
チケット番号 受付用QR 便利では? (なによりテンションが上がる) 6
Google Walletにチケットを追加するには どんな種類のチケットを作りたいか決める Google WalletのコンソールやGoogle Cloudのプロジェクトで事前準備 実装 7
チケットの種類 https://developers.google.com/wallet? hl=ja クレジットカード、ポイントカー ドなど様々 イベントチケット(右図)だと座 席番号など様々な情報を記載出来 るらしい が、一番欲しいのは「チケット番 号」と「受付用QRコード」
-> 汎用パスを選択 Apple Wallet対応も考えてシ ンプルに収めた (2023/11/3 追記) イベント向けな らイベントチケットの選択必須 8
(2023/11/3 追記) 汎用パスの使用用途 Google Wallet API を使用すると、あらかじめ定義されたさまざまなタイプのパス(ポ イントカード、クーポン、ギフトカード、イベント チケット、乗車券、搭乗券、ワクチ ンカード)でユーザーにアプローチできます。それぞれのパスには、ユースケース別の
フィールドや機能が含まれています。 Google は、既存の 7 つのパスタイプがすべてのユースケースに適しているとは限らな いことを理解しており、汎用パスタイプを作成しました。汎用パスタイプは、その名前 が示すように、ユースケースが他の専用タイプに当てはまらない場合に使用します。 https://developers.google.com/wallet/generic?hl=ja イベント用途ならイベントチケットを使用しなければいけない (Googleの審査で指摘あり) 9
事前準備 https://developers.google.com/wallet/generic/web/prerequisites?hl=ja に記載されている1〜4番。5番は実際に実装して、開発環境で動かせばOK 1. Google Wallet API 発行者アカウントの登録 初期状態ではデモモードとして指定したGoogleアカウント限定で使用可能 本番運用時はビジネスプロフィールを入力して審査を通す必要あり
2. Google Cloudの任意のプロジェクトでGoogle Wallet APIを有効化 3. 2番のプロジェクトでサービスアカウント(アプリケーション用のアカウント)を作成 4. Google Pay and Wallet Consoleで3番のアカウントを承認 10
実装の大まかな流れ 1. 事前準備で作成した情報を使用して認証 2. Google Walletの「クラス」を作成し、登録 3. 各参加者情報を元にGoogle Walletの「パスオブジェクト」を作成し、登録 4.
Google Walletに追加するためのURL https://pay.google.com/gp/v/save/{JWT} の JWTを生成 5. ブランドガイドラインからダウンロードした画像を使って「Add to Google Wallet」ボ タンを設置 ※ 独自にボタンを作ってはいけない 11
「クラス」と「オブジェクト」 https://developers.google.com/wallet/generic/overview/how-classes-objects-work?hl=ja クラス: 参加者共通の情報を保持 オブジェクト: 参加者固有の情報を保持 12
汎用パスクラスの作成・登録 汎用パスなら一意なクラスID以外の指定は不要 (むしろ、テンプレートとして項目を指定しても特に反映されず) // 自分は` 発行者アカウントの発行者ID(Issuer ID). アプリケーション名` を使用しました $classId
= " 一意な値"; $newClass = new Google_Service_Walletobjects_GenericClass([ // クラス名・・・? 'id' => $classId ]); try { $this->service->genericclass->get($classId); return $newClass; } catch (\Google\Service\Exception $ex) { // なぜtry-catch で分岐・・・? if (empty($ex->getErrors()) || $ex->getErrors()[0]['reason'] != 'classNotFound') { // 何かしらのエラー処理 } } $this->service->genericclass->insert($newClass); 13
汎用パスオブジェクトの作成 (ソースコード) $newObject = new Google_Service_Walletobjects_GenericObject([ 'id' => ' オブジェクトID',
'classId' => ' クラスID', 'heroImage' => new Google_Service_Walletobjects_Image(['sourceUri' => new Google_Service_Walletobjects_ImageUri([ 'uri' => ' カンファレンスバナーのURL', ])]), 'barcode' => new Google_Service_Walletobjects_Barcode(['type' => 'QR_CODE', 'value' => ' 受付用QR に埋め込む文字列']), 'cardTitle' => new Google_Service_Walletobjects_LocalizedString([ 'defaultValue' => new Google_Service_Walletobjects_TranslatedString([ 'language' => 'ja-JP', 'value' => ' カンファレンス名' ]) ]), 'header' => new Google_Service_Walletobjects_LocalizedString([ 'defaultValue' => new Google_Service_Walletobjects_TranslatedString([ 'language' => 'ja-JP', 'value' => ' 参加者名' ]) ]), 'subheader' => new Google_Service_Walletobjects_LocalizedString([ 'defaultValue' => new Google_Service_Walletobjects_TranslatedString([ 'language' => 'ja-JP', 'value' => " イベント種別 チケット番号" ]) ]), 'hexBackgroundColor' => ' チケット上部の背景色', // 未指定の場合はロゴの主要な色が自動設定される 'logo' => new Google_Service_Walletobjects_Image(['sourceUri' => new Google_Service_Walletobjects_ImageUri([ 'uri' => ' カンファレンスロゴのURL', ])]) ]); // 登録の流れはクラスと同じ 14
汎用パスオブジェクトの作成 (図解) 15
(2023/11/3 追記) イベントパスクラ ス・オブジェクトの作成 汎用パスとは違い、クラスでテン プレートを組んでオブジェクトの 情報を埋め込む形 サンプルコードは長いのでGist参 照 16
JWTの生成 $serviceAccount = json_decode(file_get_contents('JSON 形式で作成したサービスアカウントの鍵ファイル'), true); $claims = [ 'iss'
=> $serviceAccount['client_email'], 'aud' => 'google', 'origins' => [], 'typ' => 'savetowallet', 'payload' => [ 'genericClasses' => [ // 作成したクラス ], 'genericObjects' => [ // 作成したオブジェクト ] ] ]; return JWT::encode( $claims, $serviceAccount['private_key'], 'RS256' ); 17
あとはボタンを追加するだけ ボタンを設置 https://pay.google.com/gp/v /save/{JWT} のリンクを設定 ボタンクリックでGoogle Walletへ の追加画面に 18
まとめ Google Walletには色々なチケット(パス)の種類があるが、チケット番号やQRコード を表示するだけなら汎用パスで十分 (2023/11/3 追記) 用途にあったパスを使用しなければいけない どれにも一致しなかったら汎用パスを使う (実装上は)結構簡単にチケットをGoogle Walletに追加できる
他にも色々出来そうなので、自分の求めているものがあるか探してみると良いかも 19
ご清聴ありがとうございました 20
補足1: 使用ライブラリ https://github.com/google-wallet/rest-samples/tree/main/php compsoerで以下のライブラリを追加 { "require": { "google/auth": "^1.18", "guzzlehttp/guzzle":
"*", "google/apiclient": "^2.12" } } Google Wallet API クライアント をダウンロード・任意のパスに設置(!) JavaやC#も同様だったので、Google社内で何か事情があるのかも 1ファイルにWallet関係のクラスが詰まっている・・・ それ以外の言語のサンプルは素のテキスト・オブジェクトを使っているので、その 方式を選択するのもアリ 21
補足2: チケットの変更・削除 チケットの変更・削除時はオブジェクトのpatchメソッドを使用 削除はないので、stateをINACTIVEなどに変更する https://developers.google.com/wallet/generic/use-cases/expired-passes?hl=ja 22
補足3: クラス・オブジェクトの存在確認 try { $this->service->genericclass->get($classId); return $newClass; } catch (\Google\Service\Exception
$ex) { // なぜtry-catch で分岐・・・? if (empty($ex->getErrors()) || $ex->getErrors()[0]['reason'] != 'classNotFound') { // 何かしらのエラー処理 } } ↑コレ getメソッドの結果 存在する -> クラスやオブジェクトが返ってくる 存在しない -> 例外発生 なので、try-catchでの分岐が必要 23
参考情報 https://codelabs.developers.google.com/add-to-wallet-web#0 Node.jsで実装するチュートリアル https://github.com/google-wallet/rest-samples サンプルコード Java, C#, JavaScript(Node.js), PHP, Python,
Go 24