web-dev-qa-db-fra.com

Android Intégration du lecteur de codes-barres avec la page Web

J'ai fait des recherches toute la matinée sur l'intégration d'une application de lecture de codes-barres Android Android dans une page Web, mais je n'ai pas trouvé exactement ce que je devais savoir. Je veux avoir une page Web que l'utilisateur peut remplissez les champs de texte en utilisant un Android scanner de codes-barres. Ainsi, l'utilisateur serait sur une page Web et cliquerait à l'intérieur du champ de texte ou cliquerait sur un bouton à côté du champ de texte qui démarrerait le Android scanner de codes-barres. Ils scanneraient alors le code-barres et le champ de texte serait rempli.

J'ai trouvé des solutions sur la façon de procéder, puis je vais sur une autre page, mais il est important que l'utilisateur reste sur la même page. J'ai vu le projet zxing et j'ai pensé qu'il pourrait être utilisé, mais je ne sais pas s'il permet à la page de rester la même.

Je suis presque sûr que c'est possible et je me demande si quelqu'un pourrait me donner un aperçu de haut niveau sur la façon dont ils le feraient. Je pensais que cela pourrait être fait avec une demande ajax qui est soumise sur un clic de bouton. La demande ajax serait envoyée à mon serveur, le serveur enverrait quelque chose au périphérique Android qui démarrerait le scanner et retournerait les données qui à leur tour sont renvoyées dans la réponse ajax. Y a-t-il de toute façon pour couper le serveur et avoir juste le Android démarrant le scanner de code-barres? Merci pour votre temps et j'apprécie toute discussion à ce sujet.

androidwebpagebarcode
21
Geren White

En utilisant une interface javascript et loadurl (javascript ...) vous pouvez communiquer avec votre page web depuis Android

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

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

Il existe de nombreux exemples sur Google.

1
ePeace

ZXing (passage clouté) offre la possibilité de lancer le scanner de code à barres via une page Web via un événement de clic de bouton, une balise d'ancrage ou toute autre action pouvant appeler une URL sur un appareil mobile.

Lorsque l'application de lecture de codes-barres est installée sur un appareil Android, une URL appelle:

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

Affiche le lecteur de code à barres de l'appareil, l'utilisateur scanne le code et le code est renvoyé via le paramètre d'URL de rappel fourni dans l'URL zxing.

Vous pouvez voir un exemple (fonctionne sur Android) ici: http://zxing.appspot.com/scan

23
Michael Jasper

Vous pouvez essayer ceci pour Android:

Vous pouvez utiliser la bibliothèque Zxing pour la lecture de codes-barres pour les pages Web

 <!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>

Pour référence: Lire le lien

6
kishan Radadiya