カード番号確認ツール

ブラウザに登録されたカード情報を確認できます

入力フォームをクリックしてください。
カード情報が保存しているブラウザであればカード候補が表示されます。

入力フォームをクリックするとカード候補が表示されます

選択したらカード情報が自動入力されます。

入力された情報が外部に送信は決してしていませんので、安心してご利用ください。
ご心配の場合はオフラインにした上でご利用いただければと思います。

「カード番号確認ツール」をなぜ作ろうと思ったのかというと、ECサイトで決済を行おうと思った際に自動入力されないときがあり、財布からクレジットカードを取り出しカード番号を入力しなければならない場面に遭遇することが時々あった。

近くに財布があるならまだ良いが、遠かったらカード番号を確認するのが面倒だ。
そんなときにWebサイトでカード番号を確認してコピペできるサービスがあれば良いなと思い、作成に至りました。

「chrome カード情報確認」と検索するといくつかの記事がヒットして、Chromeの設定画面からカード番号が確認できますよと伝えている。
しかし、実際のその画面を確認しにいくと、セキュリティ的な問題か、カード番号の下4桁だけが見えるだけですべてを確認する術がなくなってしまったようだ。

カード番号の下4桁だけが見えるだけですべてを確認する術がなくなってしまった

入力フォームには自動補完autocompleteという機能がある。
https://developer.mozilla.org/ja/docs/Web/HTML/Attributes/autocomplete

HTML の autocomplete 属性は、ウェブ開発者は入力欄にどの種類の情報が期待されているかをブラウザーに示唆することができるのに加え、ユーザーエージェントがフォーム入力欄の値を埋めるための自動支援を提供する必要があることを指定することができます。

この自動補完の中にクレジットカード情報を自動入力できる機能がある。
具体的には以下のソースコードで実現できる。