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
Sign In with Apple JS
Search
rockname
June 19, 2019
Programming
2
1.1k
Sign In with Apple JS
NDAの関係でApple Developerのページはすべて削除しています、ご了承ください。
rockname
June 19, 2019
Tweet
Share
More Decks by rockname
See All by rockname
Unlock the Potential of Swift Code Generation
rockname
0
360
生成AIを活用したレシート読み取り機能のアプリ開発の裏側 / AI Receipt Scan App Development
rockname
0
80
ゼロから理解するDependency Injection / Understanding Dependency Injection from the Ground Up
rockname
2
3.9k
サブスクリプション機能制御の設計における勘所
rockname
0
1.1k
Anatomy of Dynamic color
rockname
1
1.2k
キャッシュによる状態管理のアーキテクチャ / Cache-based state management architecture
rockname
10
20k
Optimistic Updatesで UXを向上させる / Improve UX with Optimistic Updates
rockname
3
1.4k
モバイルアプリのリストUIにおける 理想的なState表示について / The ideal state display in a mobile app list UI
rockname
7
2k
オンデバイスで学習可能になったCreate MLで画像分類器を作ってみた💪 / Developing an app to train an image classifier on iOS Device using Create ML
rockname
4
510
Other Decks in Programming
See All in Programming
AWS Summit Japan 2024と2025の比較/はじめてのKiro、今あなたは岐路に立つ
satoshi256kbyte
0
120
AIエージェントはこう育てる - GitHub Copilot Agentとチームの共進化サイクル
koboriakira
0
760
効率的な開発手段として VRTを活用する
ishkawa
0
160
Python型ヒント完全ガイド 初心者でも分かる、現代的で実践的な使い方
mickey_kubo
1
240
GPUを計算資源として使おう!
primenumber
1
250
AI コーディングエージェントの時代へ:JetBrains が描く開発の未来
masaruhr
1
200
ソフトウェア品質を数字で捉える技術。事業成長を支えるシステム品質の マネジメント
takuya542
2
15k
MCPを使ってイベントソーシングのAIコーディングを効率化する / Streamlining Event Sourcing AI Coding with MCP
tomohisa
0
170
ペアプロ × 生成AI 現場での実践と課題について / generative-ai-in-pair-programming
codmoninc
2
21k
Rails Frontend Evolution: It Was a Setup All Along
skryukov
0
280
Claude Code + Container Use と Cursor で作る ローカル並列開発環境のススメ / ccc local dev
kaelaela
12
7k
ニーリーにおけるプロダクトエンジニア
nealle
0
950
Featured
See All Featured
Agile that works and the tools we love
rasmusluckow
329
21k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.9k
4 Signs Your Business is Dying
shpigford
184
22k
Designing Experiences People Love
moore
142
24k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.7k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
47
9.6k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.8k
The Art of Programming - Codeland 2020
erikaheidi
54
13k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
48
2.9k
What's in a price? How to price your products and services
michaelherold
246
12k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
2.9k
How to Ace a Technical Interview
jacobian
278
23k
Transcript
Sign In with Apple JS CA.swift #9 WWDC19ใࠂձ 2019/06/19 גࣜձࣾϛΫγΟ
ΈͯͶࣄۀ෦ ϩΫωϜ@rockname
ϩΫωϜ@rockname • גࣜձࣾϛΫγΟ 2018৽ଔೖࣾ • ՈΞϧόϜΈͯͶ • ΞϓϦ։ൃάϧʔϓ iOS(Swift, objc)
> Android(Kotlin, Java) == Rails(ruby) • झຯ: VTuberؑ • WWDC19 ॳࢀՃ ✈ ࣗݾհ
Sign In with Apple JavaScript
Sign In with Apple JS • JSͷϥΠϒϥϦ͕ఏڙ͞Ε͍ͯΔ • iOSͱಉ༷ʹWeb্ͰAppleIDͰSign InͰ͖Δ
·ͣԼ४උ
Sign In with AppleͷCapabilityΛՃ • Sign In with AppleΛ࣮͍ͨ͠AppIDΛબ
Sign In with AppleͷCapabilityΛՃ • Sign In with AppleΛνΣοΫͯ͠Save
ServiceIDΛ࡞ • + Ϙλϯ͔ΒServiceIDΛ࡞
ServiceIDΛ࡞ • Service IDsΛબͯ͠Continue
ServiceIDΛ࡞ • DescriptionͱIdentifierͦΕͧΕೖྗ • Sign In with AppleΛνΣοΫͯ͠ConfigureΛબ
ServiceIDΛ࡞ • ӈͷΑ͏ͳμΠΞϩά͕ग़Δ • Web DomainͱReturn URLsΛೖྗ • Web Domain:
Sign In with AppleΛ࣮͢Δ WebͷυϝΠϯɻ • Return URLs: Sign Inʹޭͨ͠ޙʹϦμΠϨΫ τ͢ΔURLɻ࠷େ10ݸ·ͰઃఆՄɻ • Save → Continue
Domainͷݕূ • ઌ΄Ͳ࡞ͨ͠ServiceID Λબ • Sign In with Appleͷ ConfigureΛબ
Domainͷݕূ • DownloadΛબ͠ apple-developer-domain- association.txt Λμϯϩ ʔυ • Web Domainʹࢦఆͨ͠υ
ϝΠϯͷ /.well-known Լ ʹσϓϩΠ
Domainͷݕূ • VerifyΛબ • ޭͨ͠Β੨͍νΣοΫ ϚʔΫ͕ͭ͘ • Save → Continue
Α͏࣮͘
Apple JSΛΈࠐΉ <script type="text/javascript" src="https://appleid.cdn-apple.com/ appleauth/static/jsapi/appleid/1/en_US/appleid.auth.js"></script>
Sign InʹඞཁͳใΛ͢ <meta name="appleid-signin-client-id" content="[CLIENT_ID]"> <meta name="appleid-signin-scope" content="[SCOPES]"> <meta name="appleid-signin-redirect-uri"
content="[REDIRECT_URI]"> <meta name="appleid-signin-state" content="[STATE]"> • client-id: ServiceIDͷIdentifier • scope (optional): email or name, ͋Δ͍྆ํ • redirect-url: Return URLsͷͲΕ͔ • state (optional): CSRFτʔΫϯ
Sign InʹඞཁͳใΛ͢ • metaλάͰͳ͘JSͰॻ͚Δ AppleID.auth.init({ clientId : '[CLIENT_ID]', scope :
'[SCOPES]', redirectURI: '[REDIRECT_URI]', state : '[STATE]' });
Sign InͷϘλϯΛஔ <div id="appleid-signin" data-color="black" data-border="true" data-type="sign up"></div> •
data-color: black or white • data-border: true or false • data-type: sign up | sign in | continue | apple
Sign InͷϘλϯΛஔ <button id="sign-in-with-apple-button"> Sign In with Apple </button> :
: const buttonElement = document .getElementById('sign-in-with-apple-button'); buttonElement.addEventListener('click', () => { AppleID.auth.signIn(); }); • ͜ΕJSͰॻ͚Δ
ʮ͍͍ͩͨʯͰ͖ͨ
Demo https://applesigninsample.web.app/
·ͩͪΌΜͱ࣮Ͱ͖ͯͳ͍ͱ͜Ζ • ଟͪΌΜͱΔͳΒҎԼͷΑ͏ͳ࣮Λ͢Δඞཁ͕͋Δ 1. redirectઌͷURLʹΫΤϦύϥϝʔλͰcodeͱstate͕ͬͯ͘Δ(ͣ) 2. stateͷಉҰੑΛ֬ೝ 3. code, client_id,
client_secret, grant_type, redirect_uriΛ https://appleid.apple.com/auth/token ʹPOST 4. ResponseͷJWTܗࣜͷid_tokenΛverifyͯ͠uniqueͳIDΛऔಘͯ͠WebͷϢʔβʔͱ ͻ͚ͮΔ
ҙ֎ͱΔ͜ͱଟ͍ ʁ
ࢀߟʹ͍͍ͤͯͨͩͨ͞ࢿྉ • Θ͔Γ͍͢·ͱΊهࣄ: • https://notes.tret.jp/sign-in-with-apple-register/ • expressͰ࣮͞Εͨαϯϓϧ: • https://github.com/Techofficer/express-apple-signin •
ެࣜυΩϡϝϯτ: • https://developer.apple.com/documentation/signinwithapplejs • https://developer.apple.com/documentation/signinwithapplerestapi
Thank you!!!