コメントありがとうございます。 残念ながら、もうSlingboxを使っていないた…
PaSoRiを使ってFeliCaを読み込む
ICカードのIDを取得したい場面は意外とあります。
社員証の管理、入退室チェック、会員認証、あるいは個人開発の実験。
ところがFeliCaをPCから扱おうとすると、一気にハードルが上がります。
・専用SDKが必要そう
・ネイティブアプリを書かないといけない
・Webからは触れない気がする
実際、私もそう思っていました。
しかし PaSoRi（RC-S300）とChrome を組み合わせることで、JavaScriptからFeliCaのIDを取得できたので、その方法をまとめます。
できること
今回の構成で実現できるのは次の内容です。
ブラウザ上のJavaScriptからFeliCaカードを読み取り、カードIDを取得します。
つまり、
WebアプリだけでICカード認証が可能になります。
ネイティブアプリは不要です。
使用した環境
・Windows
・Google Chrome
・PaSoRi RC-S300
・FeliCaカード（交通系ICなど）
特別な開発環境は必要ありません。
なぜPaSoRiを使うのか
PCでFeliCaを扱う方法はいくつかありますが、PaSoRiはドライバや対応実績が多く、もっとも扱いやすいリーダーです。
USB接続するだけで利用できるため、検証環境を作るまでの時間が短いのもメリットです。
ブラウザからICカードを読む仕組み
今回のポイントはここです。
Chromeが提供しているハードウェアアクセス機能を利用することで、JavaScriptからカードリーダーへアクセスできます。
これにより、
ブラウザ
↓
USBデバイス（PaSoRi）
↓
FeliCaカード
という流れが成立します。
従来必要だったネイティブアプリ層を省略できます。
実際に読み取ってみる
デモページを用意しました。
カードをPaSoRiにかざすだけでIDが取得されます。
コードは記事下部に掲載していますので、そのまま動作確認できます。
ハマりどころ
実際に試すと、いくつか注意点があります。
Chrome以外のブラウザでは動作しない場合があります。
また、USBデバイスへのアクセス許可ダイアログが表示されるため、初回はユーザー操作が必要です。
ここで躓く人が多いので注意してください。
どんな用途に使えるか
個人的には次の用途を想定しています。
・社員証ログイン
・来場チェックシステム
・会員カード認証
・自作IoT連携
「ICカード × Web」がかなり気軽に実装できます。
まとめ
PaSoRiを使えば、JavaScriptだけでFeliCaを扱うことが可能でした。
一昔前ならネイティブ開発が必要だった領域ですが、ブラウザだけで完結できる時代になっています。
ICカードを使ったWebシステムを試してみたい人の参考になれば嬉しいです。
検索
最近のコメント
最近の投稿
タグ
フィード配信
アーカイブ
外部リンク
コメントを残す