在ionic

时间:2018-01-30 16:16:19

标签: angularjs angular pdf ionic3 angular4-httpclient

在我的应用程序中,我需要通过调用api来下载pdf文件。 api返回octet-stream数据,我将其转换为pdf并下载。我的下载和相关的东西工作正常,但我发现生成的PDF似乎已损坏。打开pdf文档时,错误会记录消息"Failed to load PDF document"。我知道pdf数据已损坏。我在angular 1中实现了相同的功能,但是我的Ionic 3代码似乎是错误的。

这是我的角度1代码。

$http({
    method: 'POST',
    url: baseurl + 'data/invoice',
    responseType:"arraybuffer",
    transformRequest: transformRequestAsFormPost,
    withCredentials: false,
    headers: {
        'Content-Type': 'application/x-www-form-urlencoded',
        'Authorization': AuthToken,
    },
    params: {
        data_id: id,

    }
}).success(function(data, status, headers, config) {
    var arr = data;
    var byteArray = new Uint8Array(arr);
    var a = window.document.createElement('a');

    a.href = window.URL.createObjectURL(
        new Blob([byteArray], { type: 'application/octet-stream' })
    );
    a.download ='MyFileName.pdf' ;

    // Append anchor to body.
    document.body.appendChild(a);
    a.click();

    // Remove anchor from body
    document.body.removeChild(a);


}).error(function(error, status, headers, config) {
    alert("Error")
});

我的Ionic 3代码是这样的。

内部http模块

fnPostData(method, token, parameters){
    this.tokenString = "Bearer "+token;
    this.postParams = parameters;
    var headers = new Headers();
    headers.append("Accept", 'application/json');
    headers.set("Authorization", this.tokenString);
    headers.set("Content-Type", 'application/x-www-form-urlencoded');
    let options = new RequestOptions({
        headers: headers
    });
    return Observable.create(observer => {
        this.http.post(baseUrl + method, this.postParams, options)
        .map(result => result)
        .subscribe(result => {
           console.log("API Result:", result);
           observer.next(result);
        }, error => { 
          observer.error(error);
        });

    });
}

在我的组件类

generateDataPdf(order) {
    let isToken = 1;
    this.asyncData.fnPostData('data/invoice?data_id='+order.id, this.token, isToken).subscribe((data) => {
        if(data){
            var arr = data;
            var byteArray = new Uint8Array(arr);
            var a = window.document.createElement('a');
            a.href = window.URL.createObjectURL(
                new Blob([byteArray], { type: 'application/octet-stream' })
            );
            a.download ='FileName.pdf';
            // Append anchor to body.
            document.body.appendChild(a);
            a.click();

            // Remove anchor from body
            document.body.removeChild(a);
        }else{
            alert("Error");
        }
    },
    (err) => {
        alert("Error")
    });
}

我知道我在http请求中遗漏了以下内容。

responseType:"arraybuffer",
transformRequest: transformRequestAsFormPost,
withCredentials: false,

是不是因为这个原因,我的pdf数据已损坏?如果是,我该如何将其添加到http请求。

0 个答案:

没有答案