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.2k
Sign In with Apple JS
NDAの関係でApple Developerのページはすべて削除しています、ご了承ください。
rockname
June 19, 2019
Tweet
Share
More Decks by rockname
See All by rockname
AIを活用したレシート読み取り機能の開発から得られた実践知 / AI Receipt Scan Practice
rockname
2
1.7k
Unlock the Potential of Swift Code Generation
rockname
0
420
生成AIを活用したレシート読み取り機能のアプリ開発の裏側 / AI Receipt Scan App Development
rockname
0
110
ゼロから理解するDependency Injection / Understanding Dependency Injection from the Ground Up
rockname
2
4.1k
サブスクリプション機能制御の設計における勘所
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
2.1k
Other Decks in Programming
See All in Programming
After go func(): Goroutines Through a Beginner’s Eye
97vaibhav
0
370
組込みだけじゃない!TinyGo で始める無料クラウド開発入門
otakakot
0
230
Serena MCPのすすめ
wadakatu
4
980
Range on Rails ―「多重範囲型」という新たな選択肢が、複雑ロジックを劇的にシンプルにしたワケ
rizap_tech
0
110
Six and a half ridiculous things to do with Quarkus
hollycummins
0
170
[Kaigi on Rais 2025] 全問正解率3%: RubyKaigiで出題したやりがちな危険コード5選
power3812
0
110
Pull-Requestの内容を1クリックで動作確認可能にするワークフロー
natmark
2
490
iOSエンジニア向けの英語学習アプリを作る!
yukawashouhei
0
190
Foundation Modelsを実装日本語学習アプリを作ってみた!
hypebeans
0
110
kiroとCodexで最高のSpec駆動開発を!!数時間で web3ネイティブなミニゲームを作ってみたよ!
mashharuki
0
130
XP, Testing and ninja testing ZOZ5
m_seki
3
620
CSC509 Lecture 03
javiergs
PRO
0
330
Featured
See All Featured
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
6.1k
Why You Should Never Use an ORM
jnunemaker
PRO
59
9.6k
GitHub's CSS Performance
jonrohan
1032
470k
Fireside Chat
paigeccino
40
3.7k
Java REST API Framework Comparison - PWX 2021
mraible
33
8.9k
Git: the NoSQL Database
bkeepers
PRO
431
66k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.2k
Making Projects Easy
brettharned
119
6.4k
How GitHub (no longer) Works
holman
315
140k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
37
2.6k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
15k
Why Our Code Smells
bkeepers
PRO
339
57k
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!!!