VUE/JS读取APK的包名

见上图，两种方式获取包名，1.选择apk，点击读取实现；2.直接输入包名（你知道包名的情况线下），点击添加。

我们来实现通过1方法选择APK方式实现

直接上代码，组件html

 <p style="margin-left: 230px;" id="BappInstallCSX">
                            <p style="margin-left: 230px;display:none;" id="BPappInstall1">
                                白名单应用：<input type="file" style="width: 200px; height: 30px;" accept=".apk" id="BfileappInstallC"  οnchange="BappSelect()"/>
                                           <input type="button" value="读取" style="margin-top: -10px;" onclick="BappSelect()"/>
                            </p>

                            <p style="margin-left: 230px;display:none;" id="BPappInstall2">
                                应用包名：<input type="text" style="width: 150px; height: 15px;" id="BinputappInstallC"/>
                                         <input type="button" value="添加" style="margin-top: -10px;" onclick="addBPappInstall()"/>
                                         <input type="button" value="删除" style="margin-top: -10px;" onclick="deleBPappInstall()"/>
                            </p>

                              <table style="margin-left: 230px;align-self: auto; text-align: center;display:none;"class="appInstallCtable" id="BappInstallCtableid">
                                <thead style="background-color:#acabac;border-style:solid;border-width:1px;" class="appInstallCthead">
                                  <tr class="appInstallCheader">
                                     <th> </th>
                                     <th>apk文件名 </th>
                                     <th>包名 </th>
                                     <th>应用名 </th>
                                  </tr>
                                </thead>
                                <tbody id="BappInstallCtbody" class="appInstallCtbody" style="background-color: #FCFDFD;color: #414C5E;border-top: 1px solid #D6DBDF;border-bottom: 1px solid #D6DBDF;">
                                  <!-- js中动态拼接-->
                                </tbody>
                              </table>
                        </p>

VUE的实现：

data() {
  return {

      newpagesBAPPINSTALL: {},
      pagesBAPPINSTALLs: [],
      pagesBAPPINSTALLlist:[],//获取发送给后端的配置      

  }
}

methods: {


 BappSelect1(){//选择文件按钮，判断是否是apk
              var objFile = document.getElementById('BfileappInstallC').files[0];//获取文件内容对象
              var objStr = /\.(apk)$/; //文件类型正则验证
              if(!objStr.test(objFile.name)){
                this.$alert('请选择正确的APK！', '警告', {
                        confirmButtonText: '确定',
                        // callback: action => {
                        //     this.$message({
                        //         type: 'info',
                        //         message: `action: ${ action }`
                        //     });
                        // }
                  });
                return false;
              } 
       },
       BappSelect(){ //点击添加按钮
              let AppInfoParser = require('../../../../build/app-info-parser-master/dist/app-info-parser.js');
              const files = document.getElementById('BfileappInstallC').files;
              console.log("aaa"+JSON.stringify(files))
              const parser = new AppInfoParser(files[0]);
              console.log("bbb"+ JSON.stringify(parser))
              parser.parse().then(result => {
                console.log('app info ----> ', result);
                console.log('包名：', result.package);
                console.log('BfileappInstallC buffer ----> ', parser.file);
                console.log("APK名称"+parser.file.name);

                let APKname = parser.file.name; //APK文件名
                let PACKname = result.package;//包名
                let APPname = " ";//应用名
                let APKList = {"newpagesBAPPINSTALL":APKname,"inputUSERBAPPINSTALLC":PACKname,"apkUSERBAPPINSTALLC":APPname}
                this.pagesBAPPINSTALLs.push(APKList);//添加显示出来之用
                this.pagesBAPPINSTALLlist.push(PACKname);//收集数据发送给后端
                
                // BPappInstallpp.push(APKname);
                // BPappInstallpp.push(PACKname);
                // BPappInstallpp.push(APPname);

              }).catch(err => {
                this.$alert('无法获取apk信息，请检查！', '警告', {
                        confirmButtonText: '确定',
                        // callback: action => {
                        //     this.$message({
                        //         type: 'info',
                        //         message: `action: ${ action }`
                        //     });
                        // }
                  });
                console.log('无法获取apk信息 ----> ', err)
              })
       },
       addBPappInstall(){
           if (this.newpagesBAPPINSTALL.inputUSERBAPPINSTALLC == "" || this.newpagesBAPPINSTALL.inputUSERBAPPINSTALLC == null){
               this.$alert('包名不能为空！', '警告', {
                        confirmButtonText: '确定',
                        // callback: action => {
                        //     this.$message({
                        //         type: 'info',
                        //         message: `action: ${ action }`
                        //     });
                        // }
                  });
           }else{
               this.pagesBAPPINSTALLs.push(this.newpagesBAPPINSTALL);//把获取的APK放到表格中展示
               this.pagesBAPPINSTALLlist.push(this.newpagesBAPPINSTALL.inputUSERBAPPINSTALLC);//获取的参数要转给后台
               this.newpagesBAPPINSTALL = {inputUSERBAPPINSTALLC:""};//置空，否则重复添加按钮内容重复
           }
       },
}

 

扩展：

我们选择APK文件的时候可以先判断一下。JQ/JS写法：

 $(document).ready(function(){//监听选择文件--判断选的是不是APK
    $("#BfileappInstallC").change(function(evt){
      var objFile = document.getElementById('BfileappInstallC').files[0];//获取文件内容对象
      var objStr = /\.(apk)$/; //文件类型正则验证
      if(!objStr.test(objFile.name)){
        alert("请选择正确的APK");
        return false;
      }
    });
    $("#HfileappInstallC").change(function(evt){
      var objFile = document.getElementById('HfileappInstallC').files[0];//获取文件内容对象
      console.log("aaa"+ objFile);
      var objStr = /\.(apk)$/; //文件类型正则验证
      if(!objStr.test(objFile.name)){
        alert("请选择正确的APK");
        return false;
      }

    });
   });

选择文件后，直接点击读取按钮，然后就会获取APK信息，我这里只取APK包名。

 function BappSelect () {//读取APK包名的方法
        const files = document.getElementById('BfileappInstallC').files;
        console.log("aaa"+JSON.stringify(files) )
        const parser = new AppInfoParser(files[0]);
        console.log("bbb"+ JSON.stringify(parser))
        parser.parse().then(result => {
          console.log('app info ----> ', result);
          console.log('包名：', result.package);
          console.log('BfileappInstallC buffer ----> ', parser.file);
          console.log("APK名称"+parser.file.name);
          // document.getElementById('BinputappInstallC').value = result.package;

          var APKname = parser.file.name; //APK文件名
          var PACKname = result.package;//包名
          var APPname = " ";//应用名
          var str = "";
          var checkbox='<input type="checkbox" name="appInstallCcheckId" class="appInstallCcheckbox" id="appInstallCcekall" >';
          str = "<tr><td>" + checkbox +"</td><td>"+APKname+"</td><td>"+PACKname+"</td><td>"+APPname+"</td></tr>";
          BPappInstallpp.push(APKname);
          BPappInstallpp.push(PACKname);
          BPappInstallpp.push(APPname);
          if(APKname == "" || APKname == null){
             alert("包名不能为空！！！");
          }else{
            $(".appInstallCtbody").append(str);
          }

        }).catch(err => {
          alert("无法获取apk信息，请检查！");
          console.log('无法获取apk信息 ----> ', err)
        })
  }

//添加按钮方法
function addBPappInstall(){ //添加APK包名到输入框

     var APKname = ""; //APK文件名
     var PACKname = document.getElementById("BinputappInstallC").value;//包名
     var APPname = "";//应用名
     var str = "";
     var checkbox='<input type="checkbox" name="appInstallCcheckId" class="appInstallCcheckbox" id="appInstallCcekall" >';
     str = "<tr><td>" + checkbox +"</td><td>"+APKname+"</td><td>"+PACKname+"</td><td>"+APPname+"</td></tr>";
      BPappInstallpp.push(APKname);
      BPappInstallpp.push(PACKname);
      BPappInstallpp.push(APPname);

     if(PACKname == "" || PACKname == null || PACKname == " "){
       alert("白名单不能为空！！！");
     }else{
       $(".appInstallCtbody").append(str);
     }
     $("#BinputappInstallC").val("");
  }