💬

電話番号に「ハイフンを入れて入力」を許容すると起きる影響

1 min read

どういう状況?

電話番号をハイフンなしで入力、DBに保持してたが、見づらい等の理由で、「ハイフンを入れて欲しい」という要望があった。
甘く考えると、「バリデーション変えるだけ」の変更だが、罠が結構あったので、次要望が来たときに説明・工数に納得できるよう、まとめておく。

ハイフンっぽい見た目の記号がたくさんある

-, ‐, ‑, ‒…
似てるけど全部違う
詳しくはこのサイトなどを参考にしてください

https://www.chihayafuru.jp/tech/index.php/archives/2469

この場合、バリデーションするとしたら結構複雑になる。

  1. 似てる記号全部列挙して、ハイフンに全部変換する処理を書く
  2. ハイフン以外は全部弾く
  3. そのまま保存する(数字部分以外はバリデーションしない)

など考えられるが、多分1がもっとも正解に近い気がする。
だとするとちょっとめんどい。

復号するのがめんどくさい

例えば、DBにはハイフンなしで過去データが保存されてるので、引き続き形式合わせてハイフンなしで保存する場合。viewに関してはハイフンありで表示しなくてはいけない。電話番号のフォーマットは結構バラバラ(少なくとも日本は)。

  • 0●0-●●●●-●●●●
  • 0●-●●●●-●●●●
  • 0●●-●●●-●●●●
  • 0●●0-●●●●-●●●●

とか、色々パターンがあって、ハイフンなしの番号からハイフンありのフォーマットにするには、ながーいswitch文とか書く必要がある。その処理を書くのは結構だるい。

電話番号のフォーマットに関しては、総務省のページを参照してください。

https://www.soumu.go.jp/main_sosiki/joho_tsusin/top/tel_number/q_and_a.html

キーボードタイプにハイフンがない場合がある

例えば、safariで <input type='tel'/> のフォームに関しては、タップすると電話番号のキーボードが開く仕様になっている。電話番号を打つときはボタンが大きくて便利だし、ユーザーによってはそういった要望も大いにあると思う。

ただしこのキーボードにはハイフンが存在しない。

ハイフンが入力できないので、結果的に永遠にバリデーションエラーが起きてしまう。

まとめ

ハイフンありにしたいという要望は、見やすくなるし理解できる。ただし上のように、「バグと捉えられてしまうもの」、「工数が結構かかってしまうもの」、「運用的にコードの見通しが悪くなりそうなもの」があるので、コスパ考えて慎重に仕様決定するべきだと思う。
個人的には、電話番号を目視しないといけない場面は、電話かけるときぐらいな気がするし、それならtelリンク付けちゃって電話かけられるようにすればハイフンなしでもいいんじゃないかと思った。
管理者が電話番号があってるかどうか確認したいのであれば、電話番号の検索フォームでも作っちゃえばいいんじゃないか?と思った。

Discussion

ログインするとコメントできます