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
VeeValidate の"穴"を踏み抜いてしまった
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Takuya Eguchi (egch)
September 06, 2019
Technology
1
910
VeeValidate の"穴"を踏み抜いてしまった
Takuya Eguchi (egch)
September 06, 2019
Tweet
Share
More Decks by Takuya Eguchi (egch)
See All by Takuya Eguchi (egch)
TypeScript の class を使い倒す
egch
1
53
Next.js に疲れた私は Vue3 に癒やされた
egch
0
320
Secure な UX のために Content Security Policy について知っておこう
egch
0
53
package.json がすごい
egch
0
140
Nuxt.js のインスタンスライフサイクル総点検
egch
0
410
Webエンジニアのデザイン実装との付き合い方
egch
0
310
20200528 - GCPでもサーバーレスでRubyりたい!
egch
0
140
継続的に楽しくプログラミングするには - 2018/11/3 Rails Girls Sendai
egch
0
110
Other Decks in Technology
See All in Technology
Greatest Disaster Hits in Web Performance
guaca
0
290
[CV勉強会@関東 World Model 読み会] Orbis: Overcoming Challenges of Long-Horizon Prediction in Driving World Models (Mousakhan+, NeurIPS 2025)
abemii
0
150
データの整合性を保ちたいだけなんだ
shoheimitani
8
3.2k
OpenShiftでllm-dを動かそう!
jpishikawa
0
140
ランサムウェア対策としてのpnpm導入のススメ
ishikawa_satoru
0
220
外部キー制約の知っておいて欲しいこと - RDBMSを正しく使うために必要なこと / FOREIGN KEY Night
soudai
PRO
12
5.6k
今日から始めるAmazon Bedrock AgentCore
har1101
4
420
usermode linux without MMU - fosdem2026 kernel devroom
thehajime
0
240
20260208_第66回 コンピュータビジョン勉強会
keiichiito1978
0
190
顧客との商談議事録をみんなで読んで顧客解像度を上げよう
shibayu36
0
310
Cloud Runでコロプラが挑む 生成AI×ゲーム『神魔狩りのツクヨミ』の裏側
colopl
0
140
Codex 5.3 と Opus 4.6 にコーポレートサイトを作らせてみた / Codex 5.3 vs Opus 4.6
ama_ch
0
200
Featured
See All Featured
Learning to Love Humans: Emotional Interface Design
aarron
275
41k
GraphQLの誤解/rethinking-graphql
sonatard
74
11k
Digital Projects Gone Horribly Wrong (And the UX Pros Who Still Save the Day) - Dean Schuster
uxyall
0
390
Impact Scores and Hybrid Strategies: The future of link building
tamaranovitovic
0
200
What’s in a name? Adding method to the madness
productmarketing
PRO
24
3.9k
The Limits of Empathy - UXLibs8
cassininazir
1
220
Scaling GitHub
holman
464
140k
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
aleyda
1
1.8k
VelocityConf: Rendering Performance Case Studies
addyosmani
333
24k
Documentation Writing (for coders)
carmenintech
77
5.3k
Heart Work Chapter 1 - Part 1
lfama
PRO
5
35k
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
minecr
0
160
Transcript
VeeValidate の”穴”を 踏み抜いてしまった 2019.9.6 v-sendai #3 @楽天株式会社 江口 拓弥
自己紹介 江口 拓弥 v-sendai 皆勤賞で LT やってる人です。 最近の構成は、 Nuxt.js x
TypeScript x Firebase x Auth0 です! 2 akathea_
おことわり このLTで登場するコードは、全て v2系の内容になります… 29 Jul. - VeeValidate 3.0 is out
!!! 3 akathea_
VeeValidateとは? akathea_
“ Template Based Validation Framework For Vue.js 5 akathea_
非同期かつリアルタイムに バリデーションできる 6 akathea_ https://codesandbox.io/s/x2k1l2y17o
ドキュメントも豊富 7 akathea_
i18nも楽ちん! 8 akathea_
こんな感じでバリデーション <input name="mail" :value="mail" placeholder="メールアドレス" validate="required|email" validate-name="メールアドレス" /> 9 akathea_
超便利! akathea_
ある日、痛ましい事件が… 11 メールマガジンが配 信できなかったユー ザー見てたら メアドに全角文字 入ってるんだけどこ れはバグ? ?! 運用チーム
私 akathea_
(そもそも)メールアドレスの 正しいフォーマットって? akathea_
RFC 5322 13 http://srgia.com/docs/rfc5322j.html#p3.4 akathea_
実はこんなメールアドレスがある 14 ◦ ...hoge…@docomo.ne.jp □ 先頭や@直前に「.」は使ってはいけない。「 .」を2回以上連続して使ってはいけない。いけな いのだが、docomoのキャリアメールでは許可されている。 ◦ “hoge
huga”@example.com □ 「“」と「”」に囲まれていた場合、間にスペースが利用できる。 できるが、そもそもダブルクオート使えるメールサービスを知らない。 ◦ 管理者@ぶいせんだい.jp , föö@bår.de □ RFC 6530 によって、メルアド(ユーザー名、ドメイン名どちらも )に マルチバイトが許可された。 Gmailも 2014年に送受信に対応。 とはいえ見たことはない。 akathea_
実はこんなメールアドレスがある 15 ...確かに存在する…! ...するが…! ...こんなアドレスがあるはずがない…! v.sendai3@gmail.co 全角 明らかに typo akathea_
入力値をどうチェックすべきだった? 16 ◦ メールアドレスのベリファイ※は実施していたが 利用時の必須条件にしていなかった ※会員登録されたアドレス宛にワンタイムURL付き確認メールを送信 ◦ 何度も会員登録できる仕組みではなかった →ユーザーは登録ミスに気づいても再登録できなかった →厳格なチェックが必要だった
◦ 「メールアドレスに使える文字は半角だけ」 という固定概念があった ◦ VeeValidateを始め、有名なライブラリなら そのへんも面倒見ていると勘違いしてしまった akathea_
まとめ akathea_
まとめ 18 ◦ 有名なライブラリ・フレームワークにも穴はある □ そもそも日本人以外は、今回の事象を 穴とも思っていないかもしれない ▪ i18n と
l11n は違う ◦ メールアドレスに限らず、世の中の常識が変わっているという 可能性を常に考慮する □ 常に最新の情報をキャッチアップし続ける ◦ 厳格なチェックが必要なときはちゃんとテストする ◦ 本当に穴っぽかったらPR出していこう! akathea_
ご清聴ありがとうございました 19