web-dev-qa-db-ja.com

Android Webページとバーコードスキャナーの統合

AndroidバーコードスキャナーアプリをWebページに統合することについて午前中ずっと調査してきましたが、知る必要のあるものが正確に見つかりません。ユーザーができるWebページが欲しいAndroidバーコードスキャナーを使用してテキストフィールドに入力します。そのため、ユーザーはWebページにアクセスし、テキストフィールド内をクリックするか、テキストフィールドの横にあるボタンをクリックして、 Androidバーコードスキャナー。バーコードをスキャンし、テキストフィールドに入力します。

これを行う方法の解決策を見つけて別のページに移動しましたが、ユーザーが同じページにとどまることが重要です。私はzxingプロジェクトを見て、それが使用できるかもしれないと思っていましたが、ページを同じままにできるかどうかはわかりません。

これが可能であると私はかなり確信しており、誰かがそれをどのように行うかについて高レベルの概要を私に与えることができるかどうか疑問に思っています。ボタンのクリックで送信されるajaxリクエストでそれができるかもしれないと思っていました。 ajaxリクエストは私のサーバーに送信され、サーバーは何かをAndroidデバイスに送信してスキャナーを起動し、次にajax応答で返送されるデータを返します。サーバーを切り取って、Androidブラウザでバーコードスキャナを起動させるだけの方法はありますか?お時間をいただき、ありがとうございます。

21
Geren White

JavaScriptインターフェースとloadurl(javascript ...)を使用して、AndroidからWebページと通信できます

public void loadScript(String script){      
    webview.loadUrl("javascript:(function() { " + script + "})()");             
}

private class JavaScriptInterface {     
    public void startQRScan() {
        ...
    }
}

グーグルにはたくさんの例があります。

1
ePeace

ZXing (シマウマ交差)は、ボタンクリックイベント、アンカータグ、またはモバイルデバイスのURLを呼び出すことができるその他のアクションを通じて、Webページを介してバーコードスキャナーを開始する機能を提供します。

バーコードスキャナーアプリケーションがAndroidデバイスにインストールされている場合、次のURLが呼び出されます。

zxing://scan/?ret=http://foo.com/products/{CODE}/description&SCAN_FORMATS=UPC_A,EAN_13

デバイスのバーコードリーダーが表示され、ユーザーがコードをスキャンすると、zxing URLで提供されるコールバックURLパラメーターを介してコードが返されます。

ここで例を見ることができます(Androidで動作します) http://zxing.appspot.com/scan

23
Michael Jasper

あなたはこれをAndroidで試すことができます:

WebページのバーコードスキャンにZxingライブラリを使用できます

 <!DOCTYPE html>
    <script type="text/javascript">
    //This entire block of script should be in a separate file, and included in each doc in which you want scanner capabilities
        function zxinglistener(e){
            localStorage["zxingbarcode"] = "";
            if(e.url.split("\#")[0] == window.location.href){
                window.focus();
                processBarcode(decodeURIComponent(e.newValue));
            }
            window.removeEventListener("storage", zxinglistener, false);
        }
        if(window.location.hash != ""){
            localStorage["zxingbarcode"] = window.location.hash.substr(1);
            self.close();
            window.location.href="about:blank";//In case self.close is disabled
        }else{
            window.addEventListener("hashchange", function(e){
                window.removeEventListener("storage", zxinglistener, false);
                var hash = window.location.hash.substr(1);
                if (hash != "") {
                    window.location.hash = "";
                    processBarcode(decodeURIComponent(hash));
                }
            }, false);
        }
        function getScan(){
            var href = window.location.href.split("\#")[0];
            window.addEventListener("storage", zxinglistener, false);
            zxingWindow = window.open("zxing://scan/?ret=" + encodeURIComponent(href + "#{CODE}"),'_self');
        }

    </script>

    <html>
        <head>
            <script type="text/javascript">
                function processBarcode(b){
                    var d = document.createElement("div");
                    d.innerHTML = b;
                    document.body.appendChild(d);
                }
            </script>
        </head>
        <body>
            <button onclick="getScan()">get Scan</button>
        </body>
    </html>

参考: リンクを読む

6
kishan Radadiya