Question

我正在尝试使用ajax调用从服务器（jsp）下载pdf文件，我从服务器获取Base 64格式的数据，然后将其转换为ArrayBuffer，然后使用blob对象下载，以下代码对于除了Chrome浏览器中的chrome浏览器以外的所有浏览器，甚至是iPhone的Safari浏览器，都可以正常工作，我不知道这是什么问题，对此是否有任何帮助，我们将非常感谢

function hello(id)
    {
    //alert(id);

    //alert(id);
    var ln="en";
                $.ajax({
                  type:'post',
                 url:'ajaxurl',
                  data:{lang:ln,num_srno:id},
                  success:function(data){
                  //alert(data);

                /*  var bytes = new Uint8Array(data); // pass your byte response to this constructor

    var blob=new Blob([bytes], {type: "application/pdf"});// change resultByte to bytes

    var link=document.createElement('a');
    link.href=window.URL.createObjectURL(blob);
    link.download="myFileName.pdf";
    link.click();*/
    var sampleArr = base64ToArrayBuffer(data);
    saveByteArray("Sample Report", sampleArr);

                      }

                    });
    }

    function base64ToArrayBuffer(base64) {
        var binaryString = window.atob(base64);
        var binaryLen = binaryString.length;
        var bytes = new Uint8Array(binaryLen);
        for (var i = 0; i < binaryLen; i++) {
           var ascii = binaryString.charCodeAt(i);
           bytes[i] = ascii;
        }
        return bytes;
     }
    function saveByteArray(reportName, byte) {
        var blob = new Blob([byte], {type: "application/pdf"});
        var link = document.createElement('a');
        link.href = window.URL.createObjectURL(blob);
        //link.href=window.webkitURL.createObjectURL(blob);
        //a.download = file_path.substr(file_path.lastIndexOf('/') + 1);
        var fileName = reportName;
        link.download = fileName.substr(fileName.lastIndexOf('/') + 1);
        document.body.appendChild(link);
     link.click();
    document.body.removeChild(link);

    };

Answer 1

iOS的Chrome上存在一些问题。就我而言，使用FileReader()解决了这个问题：

var reader = new FileReader();
var out = new Blob([this.response], {type: 'application/pdf'});
reader.onload = function(e){
  window.location.href = reader.result;
}
reader.readAsDataURL(out);

Answer 2

结合上面的Mose Answer，您可以检测操作系统类型并相应地设置代码以下载

   function hello(id)
    {

    //alert(id);

    //alert(id);
    var ln="en";
                $.ajax({
                  type:'post',
                 url:'ajaxurl',
                  data:{lang:ln,num_srno:id},
                  success:function(data){
                  //alert(data);

                /*  var bytes = new Uint8Array(data); // pass your byte response to this constructor

    var blob=new Blob([bytes], {type: "application/pdf"});// change resultByte to bytes

    var link=document.createElement('a');
    link.href=window.URL.createObjectURL(blob);
    link.download="myFileName.pdf";
    link.click();*/
    var sampleArr = base64ToArrayBuffer(data);
    saveByteArray("Sample Report", sampleArr);

                      }

                    });
    }

    function base64ToArrayBuffer(base64) {
        var binaryString = window.atob(base64);
        var binaryLen = binaryString.length;
        var bytes = new Uint8Array(binaryLen);
        for (var i = 0; i < binaryLen; i++) {
           var ascii = binaryString.charCodeAt(i);
           bytes[i] = ascii;
        }
        return bytes;
     }

     function getMobileOperatingSystem() {
      var userAgent = navigator.userAgent || navigator.vendor || window.opera;

          // Windows Phone must come first because its UA also contains "Android"
        if (/windows phone/i.test(userAgent)) {
            return "Windows Phone";
        }

        if (/android/i.test(userAgent)) {
            return "Android";
        }

        // iOS detection from: http://stackoverflow.com/a/9039885/177710
        if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
            return "iOS";
        }

        return "unknown";
    }



    function saveByteArray(reportName, byte) {
        //
        var os=getMobileOperatingSystem();

        if(os=="iOS")
        {
            var reader = new FileReader();
    var out = new Blob([byte], {type: "application/pdf"});
    reader.onload = function(e){
      window.location.href = reader.result;
    }
    reader.readAsDataURL(out);
        }


        else {

            var blob = new Blob([byte], {type: "application/pdf"});
            var link = document.createElement('a');
            link.href = window.URL.createObjectURL(blob);
            //link.href=window.webkitURL.createObjectURL(blob);
            //a.download = file_path.substr(file_path.lastIndexOf('/') + 1);
            var fileName = reportName;
            link.download = fileName.substr(fileName.lastIndexOf('/') + 1);
            document.body.appendChild(link);
         link.click();
        document.body.removeChild(link);
    }

   };

希望对您有帮助。

iPhone Chrome浏览器中的BLOB对象未下载文件

2 个答案: