1

我在我的 Android 设备 Web 应用程序中使用zxing://scan进行条码扫描。用户不能接受phonegap 包装。他们希望应用程序只能通过浏览器访问。但据我了解，zxing://scan不能是 Ajax 请求 url。我遇到的唯一解决方案是window.location.href = zxing://scan/?ret="+escape(window.location.href+"?val={CODE}将调用 android 条形码扫描仪并将条形码值分配给{CODE} 占位符在网址中。但不久之后页面重新加载并且所有数据都丢失了。表格太长，有多个网格。除了存储用户在会话中输入的所有数据并重新加载并将其设置回表单之外，是否有任何快速解决方法可以将值设置为浏览器选项卡的 url 栏并防止触发页面重新加载用户扫描条形码的时间？

请注意：客户不接受页面重新加载和 phonegap 插件。我真的注定要失败还是有任何解决方案..？

我的第二种方法是使用相机标签<input id="demoFile" type="file" accept="image/*;capture=camera">拍摄条形码照片，base64 编码并发布到服务器端并解码条形码并从其响应中获取条形码值。我知道它不是条形码扫描的最佳方式。但是由于我上面提到的原因，我很不走运。您如何评价这种方法。还有比这更好的解决方案吗？

提前致谢。

4

1 回答 1

1

根据应用程序，与其在 ?val= 处触发返回，不如将其发送到 #val= 并使用 javascripts document.location.hash 解析它？如果您收听 onhashchange 事件（假设它是较新的浏览器或移动设备），您将准备好然后在不刷新页面的情况下进行操作。

请求的示例（假设使用 jQuery）：

$(window).one('hashchange', function() {
    if(document.location.hash.match('=')){
        //we have a code...
        var code = document.location.hash.substr(document.location.hash.indexOf('=')+1));
        document.location.hash="";
        //now do something with scanned code
        alert(code);
    }
});

var selector = 'body';
var filler = "<p align='center'>This device is not set up to support scanning at the moment.<br><br>"
            +"On Android devices, install the <a href='https://play.google.com/store/apps/details?id=com.google.zxing.client.android&feature=search_result'>Barcode Scanner by ZXing</a> app from the Google Play store.<br><br>"
            +"You can also manually enter your barcode here: <input type='text' id='code'><input type='button' id='submitcode' value='Check Barcode'>";
            +"</p>";

//Set up our html into the element specified in the selector var
$(selector).html("<iframe id='scanner'></iframe>"+filler);
//try to load the zxing app if it exists - if not, error will catch the failed load and default us back to the manual entry form
$('#scanner').error(function(){
    $(selector).html(filler);
    //if manual form is submitted, append the hash so we can use the one set of logic to manage the codes
    $(selector+' #submitcode').click(function(){ document.location.href = document.location.href+"#sku="+$('#code').val(); });
    //catch someone hitting return to submit the form as well
    $('#code').keydown(function (e){
        if(e.keyCode == 13){
            $(selector+' #submitcode').click();
        }
    });
}).attr('src',"zxing://scan/?ret="+escape(window.location.href+"#sku={CODE}"));

//handle manual form submission via button click or return key
$(selector+' #submitcode').click(function(){ 
    document.location.href = document.location.href+"#sku="+$('#code').val(); 
});
$('#code').keydown(function (e){
    if(e.keyCode == 13){
        $(selector+' #submitcode').click();
    }
});
于 2013-06-24T10:06:25.943 回答