AgentWeb页面调用原生Android功能

WebView页面调用原生Android页面

1. 权限请求

所有页面的功能均自动根据情况请求权限，无需处理。

2. 文件下载

和PC端h5页面一样，正常链接下载地址即可

下载应用宝

3. 上传文件

1. 图片

    
    
    
上传身份证
    选择文件
        

            
        
    

$(function() {
    form.reset(); //清除浏览器记录的上次记录
    var file;
    $(form).on("change", "#file_upload", function() {
        var $file = $(this);
        var fileObj = $file[0];
        var windowURL = window.URL || window.webkitURL;
        var dataURL;
        var $img = $("#preview");
        if (fileObj && fileObj.files && fileObj.files[0]) {
            dataURL = windowURL.createObjectURL(fileObj.files[0]);
            $img.attr('src', dataURL);
        } else {
            console.log("else  upload");
            dataURL = $file.val();
            var imgObj = document.getElementById("preview");
            // 两个坑:
            // 1、在设置filter属性时，元素必须已经存在在DOM树中，动态创建的Node，也需要在设置属性前加入到DOM中，先设置属性在加入，无效；
            // 2、src属性需要像下面的方式添加，上面的两种方式添加，无效；
            imgObj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
            imgObj.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = dataURL;
        }
        //输出选中结果
        console.log(this.value);
        alert(this.value);
        //每次选中都保存旧元素，并使用新的控件替换
        $(this).clone().replaceAll(file = this);
    }).submit(function() {
        //提交时把之前保存的旧元素替换回去
         $("#file_upload").replaceWith(file);
        });
});

2. 视频

    
暂无视屏
    
上传视频
    选择文件
        

            
        
    

$(function() {
    form.reset(); //清除浏览器记录的上次记录
    $(form2).on("change", "#file_upload2", function() {
        alert(this.value);
        document.getElementById("preview_path").innerText=this.value;
    }).submit(function() {
        //提交时把之前保存的旧元素替换回去
        $("#file_upload2").replaceWith(file);
    });
});

3. js通信文件上传

    
    
上传身份证
    

    选择文件
    

 bindEvent(window, 'load', function() {
    var ip = document.getElementById("file_upload");
    bindEvent(ip, 'click', function(e) {
        // alert("我是" + this + "元素, 你点击了我!");
        if (window.agentWeb != null && typeof(window.agentWeb) != "undefined") {
            // uploadFile是Android后端定义的方法
            // 在此方法中打开文件选择界面
            // 调用成功后，回调uploadFileResult(objs)方法
            window.agentWeb.uploadFile();
            //alert("Js  调 Android 方法成功");
        } else {
            alert(typeof(window.agentWeb));
        }
    });
});
//这里返回来的是一个 Json 数组 //
function uploadFileResult(objs) {
    // console.log(message);
    //alert(objs);
    //alert("Android 调 Js 方法");
    if (objs == null || typeof(objs) == "undefined" || objs.length == 0) {
        //alert("");
    } else {
        var img = document.getElementById("preview");
        //Android回传的数据
        /*for(var i=0;i

4. 将input选择的图片显示在浏览器上

    // sourceId:文件源
    // targetId:文件要显示的位置
    function preImg(sourceId, targetId) {
        var url = getFileUrl(sourceId);  //调用getFileUrl
        console.log(url);
        var imgPre = document.getElementById(targetId);
        imgPre.src = url;
    }
    // 从 file 获取文件url
    // ie firefox chrome 有所不同
    function getFileUrl(sourceId) {
        var url;
        console.log(navigator.userAgent);
        if (navigator.userAgent.indexOf("MSIE") >= 1) {
            // IE
            url = document.getElementById(sourceId).value;
        } else if (navigator.userAgent.indexOf("Firefox") > 0) {
            // Firefox
            url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
        } else if (navigator.userAgent.indexOf("Chrome") > 0) {
            // Chrome
            url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
        }
        return url;
    }

4. JS 与Android交互

//callAndroid 是安卓后端写好的方法
function sendHelloToAndroid() {
    // body...
    //console.log("call android")
    if(window.android!=null&&typeof(window.android)!="undefined"){
        window.android.callAndroid("你好，Android! ");
    }else{
        alert(typeof(window.android));
    }
}
// 安卓回调的方法 如下：
function callByAndroid(){
    console.log("callByAndroid")
    alert("Js收到消息");
    //showElement("Js收到消息-->无参方法callByAndroid被调用");
}
  
function callByAndroidParam(msg1){
    console.log("callByAndroid_param")
    alert("Js收到消息："+msg1);
    //showElement("Js收到消息-->方法callByAndroidParam被调用,参数:"+msg1);
}
function callByAndroidMoreParams(objs,msg2,msg3){
    console.log("callByAndroid_moreparam")
    alert("Js收到消息："+"id:"+objs.id.toString()+" name:"+objs.name+" age:"+objs.age.toString()+msg2+msg3);
    //showElement("Js收到消息-->方法callByAndroidMoreParam被调用 , 参数1:"+objs+"  参数2:"+msg2+"  参数3:"+msg3);
}

5. 基础应用交互

电话
短信
邮件
打开应用内部页面
打开微信

6. 定位

和PC端h5页面一样，正常引用地图api并在页面上调用定位方法即可