Angular JS在新窗口中清空pdf

时间:2017-12-05 17:33:17

标签: javascript angularjs pdf

问题是,当我想用​​角度js创建PDF文件为空时

这是情景:

我有休息api,当我提出请求响应有效负载是这样的:

JVBERi0xLjQKJeLjz9MKMyAwIG9iago8PC9GaWx0ZXIvRmxhdGVEZWNvZGUvTGVuZ3RoIDE4NT4+c3RyZWFtCnicpY4xD4JADIX3+xVvxEV7PeDAUYXBSZNzMg4EkGgCRIiD/144B41RNCF9aZO2r18vYmGE8hGQD5OJyIitYKz7rgR10efAZZhSzGIJSTBH4UzMud99rhDS8tXkMbTmqf9mJDtuCuEkbdYpexSr/iah+HB3f+hqZv/6TmQVQqtBZFVXt7K+trs2b0bSQhc+0wAsbk5Y5Smoc9DcCsvIgEnqkWylf7A3SQMeCXG1Bw4HIPIvwB0h835eCmVuZHN0cmVhbQplbmRvYmoKMSAwIG9iago8PC9UYWJzL1MvR3JvdXA8PC9TL1RyYW5zcGFyZW5jeS9UeXBlL0dyb3VwL0NTL0RldmljZVJHQj4+L0NvbnRlbnRzIDMgMCBSL1R5cGUvUGFnZS9SZXNvdXJjZXM8PC9Db2xvclNwYWNlPDwvQ1MvRGV2aWNlUkdCPj4vUHJvY1NldCBbL1BERiAvVGV4dCAvSW1hZ2VCIC9JbWFnZUMgL0ltYWdlSV0vRm9udDw8L0YxIDIgMCBSPj4+Pi9QYXJlbnQgNCAwIFIvTWVkaWFCb3hbMCAwIDU5NSA4NDJdPj4KZW5kb2JqCjUgMCBvYmoKWzEgMCBSL1hZWiAwIDg1MiAwXQplbmRvYmoKMiAwIG9iago8PC9TdWJ0eXBlL1R5cGUxL1R5cGUvRm9udC9CYXNlRm9udC9IZWx2ZXRpY2EvRW5jb2RpbmcvV2luQW5zaUVuY29kaW5nPj4KZW5kb2JqCjQgMCBvYmoKPDwvS2lkc1sxIDAgUl0vVHlwZS9QYWdlcy9Db3VudCAxL0lUWFQoMi4xLjcpPj4KZW5kb2JqCjYgMCBvYmoKPDwvTmFtZXNbKEpSX1BBR0VfQU5DSE9SXzBfMSkgNSAwIFJdPj4KZW5kb2JqCjcgMCBvYmoKPDwvRGVzdHMgNiAwIFI+PgplbmRvYmoKOCAwIG9iago8PC9OYW1lcyA3IDAgUi9UeXBlL0NhdGFsb2cvUGFnZXMgNCAwIFIvVmlld2VyUHJlZmVyZW5jZXM8PC9QcmludFNjYWxpbmcvQXBwRGVmYXVsdD4+Pj4KZW5kb2JqCjkgMCBvYmoKPDwvTW9kRGF0ZShEOjIwMTcxMjA1MTgwNDM5KzAxJzAwJykvQ3JlYXRvcihKYXNwZXJSZXBvcnRzIExpYnJhcnkgdmVyc2lvbiA2LjEuMCkvQ3JlYXRpb25EYXRlKEQ6MjAxNzEyMDUxODA0MzkrMDEnMDAnKS9Qcm9kdWNlcihpVGV4dCAyLjEuNyBieSAxVDNYVCk+PgplbmRvYmoKeHJlZgowIDEwCjAwMDAwMDAwMDAgNjU1MzUgZiAKMDAwMDAwMDI2NyAwMDAwMCBuIAowMDAwMDAwNTQzIDAwMDAwIG4gCjAwMDAwMDAwMTUgMDAwMDAgbiAKMDAwMDAwMDYzMSAwMDAwMCBuIAowMDAwMDAwNTA4IDAwMDAwIG4gCjAwMDAwMDA2OTQgMDAwMDAgbiAKMDAwMDAwMDc0OCAwMDAwMCBuIAowMDAwMDAwNzgwIDAwMDAwIG4gCjAwMDAwMDA4ODMgMDAwMDAgbiAKdHJhaWxlcgo8PC9JbmZvIDkgMCBSL0lEIFs8MzlhYzY4ZDI4YjM4ZGYwNDcwNDM2YTM4ZjA2ZjI2MjY+PGMxNDNkNzJiMDE5M2ZmYzM5ZDMyM2UxNzlhN2QyNDdjPl0vUm9vdCA4IDAgUi9TaXplIDEwPj4Kc3RhcnR4cmVmCjEwNTAKJSVFT0YK

响应标题是

enter image description here

并且pdf没问题,其中包含数据。

问题在于我从angular获取http:

$scope.confirmPayment = function(){
    $http.get(apiUrl).then(function(response) {
        console.log(response.data);
        var data = new Blob([response.data], { type: "application/pdf" });
        var fileURL = URL.createObjectURL(data);
        window.open(fileURL);
    });
};

pdf为空。为什么会发生这种情况以及如何解决这个问题?两个请求中的响应有效负载是相同的。

第二次调用中的

响应头是:

enter image description here

控制台日志正在打印此

%PDF-1.4
%����
3 0 obj
<</Filter/FlateDecode/Length 178>>stream
x���1��@�����7⢽�w����mƁ��L������1�&�/m���녖�|�9k؜bK;�l���w��y �5���ŰG�&���>W�Y�j
���T��ٍے���w��ũ��(?���������ŏ`�Ads;7U1����������.2p����V���2#پ��ަ-d$$0!$�����w6~{�
endstream
endobj
1 0 obj
<</Tabs/S/Group<</S/Transparency/Type/Group/CS/DeviceRGB>>/Contents 3 0 R/Type/Page/Resources<</ColorSpace<</CS/DeviceRGB>>/ProcSet [/PDF /Text /ImageB /ImageC /ImageI]/Font<</F1 2 0 R>>>>/Parent 4 0 R/MediaBox[0 0 595 842]>>
endobj
5 0 obj
[1 0 R/XYZ 0 852 0]
endobj
2 0 obj
<</Subtype/Type1/Type/Font/BaseFont/Helvetica/Encoding/WinAnsiEncoding>>
endobj
4 0 obj
<</Kids[1 0 R]/Type/Pages/Count 1/ITXT(2.1.7)>>
endobj
6 0 obj
<</Names[(JR_PAGE_ANCHOR_0_1) 5 0 R]>>
endobj
7 0 obj
<</Dests 6 0 R>>
endobj
8 0 obj
<</Names 7 0 R/Type/Catalog/Pages 4 0 R/ViewerPreferences<</PrintScaling/AppDefault>>>>
endobj
9 0 obj
<</ModDate(D:20171205182420+01'00')/Creator(JasperReports Library version 6.1.0)/CreationDate(D:20171205182420+01'00')/Producer(iText 2.1.7 by 1T3XT)>>
endobj
xref
0 10
0000000000 65535 f 
0000000260 00000 n 
0000000536 00000 n 
0000000015 00000 n 
0000000624 00000 n 
0000000501 00000 n 
0000000687 00000 n 
0000000741 00000 n 
0000000773 00000 n 
0000000876 00000 n 
trailer
<</Info 9 0 R/ID [<1e77577afe299f8055a81e3d5141da79><eaf48da4dde2751fa6380537fbce1a72>]/Root 8 0 R/Size 10>>
startxref
1043
%%EOF
controller.home.js:7:7

1 个答案:

答案 0 :(得分:1)

相同的完整博文:Download File in Angular Js2 Application

以下对我有用,你可以尝试一下,你遗漏的一件事RequestOptions({responseType: ResponseContentType.Blob}),你遗漏的另一件事是:<Blob>response.blob()

   ngOnInit(): void {
    this.getFile("http://localhost:1800/api/demo/GetTestFile")
    .subscribe(fileData => 
      {
      let b:any = new Blob([fileData], { type: 'application/zip' });
      var url= window.URL.createObjectURL(b);
        window.open(url);
      }
    );
  }

   public getFile(path: string):Observable<any>{
    let options = new RequestOptions({responseType: ResponseContentType.Blob});
    return this.http.get(path, options)
        .map((response: Response) => <Blob>response.blob())  ;
  }