概要
昨年末、会社がGlass Enterprise Edition 2(通称"Google Glass")を購入してくれました!
早速、なにか作ってみよう!、ということで
「Google GlassでQRコードを撮影し、読取結果を弊社が代理店として取り扱っている"ConMas i-Reporter(*)"を利用した帳票に出力する」
というものを作ってみます!
Part1では、「GoogleGlassでQRコードを読み取りテスト用APIをたたく」、までを解説します
[Step.1] Google Glassを触ってみよう!
公式より、初期設定手順が公開されていますので、
そちらに従って、設定します。
[Step.2] サンプルソースをインストールして、実行してみる!
-
AndroidStudioがないことには始まらないので、インストール
Android Studioをインストール
-
Googleが公開しているサンプルソースをインポートする
インポートの詳細はここでは割愛させていただきます。
-
実行してみる
実行結果は、以下のサイトにある「Google Enterprise Edition2#QR code scanner sample」と同じです。
[Step.3] QRコード読取後、任意のAPIへHTTPリクエストする処理を記述する
APIの準備
任意のAPIがないと叩けないので、適当なAPIを用意します。
今回は、Node.jsで記述、社内にある私が自由に使っていいお遊びサーバーにデプロイ(詳細は割愛)
const express = require('express')
const bodyParser = require('body-parser');
const app = express();
// urlencodedとjsonは別々に初期化する
app.use(bodyParser.urlencoded({
extended: true
}));
app.use(bodyParser.json());
/***
* [sample] api : hello world
*/
app.get('/', (req, res) => res.send('Hello World!'))
app.post('/ap2api', (req, res) => {
// {
// "name" :"hogehoge"
// }
console.log(req.body);
var data = req.body;
console.log(data.name);
res.send('POST request to the homepage');
})
app.listen(3000, () => console.log('Example app listening on port 3000!'))
Google Glassの準備
Google Glassサンプルソースの"QRScannerSample"内の以下のメソッドに
APIリクエストする処理を追記
※ 仮実装、ですので、突っ込みどころあるかもしれませんが、ご容赦ください、、、
Google Glassにアプリをインストールして、さっそく実行してみます。
[Step.4] 動作確認
動作確認時の、アプリ側の画面と、サーバーログは以下の通り
"QRScannerSample"アプリ初期画面
カメラプレビュー画面
QRコード検知時の、サーバー側ログ
※ QRコード検知後、1度しかAPIリクエストしているが、検知後2回API リクエストが走ってます
案件対応時には、Androidの検知時のイベントをもっと理解する必要ありそうですね。
Part.2 に向けて
サンプルソースに、API Requestする処理を組み込むことは 出来ました。
次回は、、、
- 前スワイプ操作 → 映っているカメラプレビューをキャプチャ
- タップ操作 → QRコードを読み取り、[1.]で取得した画像データを弊社ネクストビジョンが取り扱っている"ConMas i-Reporter"帳票に埋め込む
まで、を実装してみようと思います。