从Internet Explorer浏览器中的角度blob打开PDF

时间:2016-10-13 22:16:55

标签: javascript angularjs asp.net-web-api2

我在web api中有以下服务器端代码

tempResponse = Request.CreateResponse(HttpStatusCode.OK);
tempResponse.Content = new StreamContent(stream);
tempResponse.Content.Headers.Add(@"Content-type", "application/pdf");
tempResponse.Content.Headers.ContentType = new   
System.Net.Http.Headers.MediaTypeHeaderValue("application/pdf");
tempResponse.Content.Headers.ContentDisposition = new 
System.Net.Http.Headers.ContentDispositionHeaderValue("inline");

我正在使用angular JS,以下是我的javascript文件中的代码。

$http.post(apiURL + "/DownloadPdf", data, { responseType: 'arraybuffer'}, config)
.then(function (result) {
  var file = new Blob([result.data], { type: 'application/pdf' })
  var fileName = "CommissionStatement.pdf"

  if (window.navigator && window.navigator.msSaveOrOpenBlob) {
    window.location.href = 'Assets/Document CheckList.pdf'
    window.navigator.msSaveOrOpenBlob(file, fileName)
  } else {
    var objectUrl = URL.createObjectURL(file)
    window.open(window.location.href = 'Assets/Document CheckList.pdf', '_blank')
    window.open(objectUrl, '_blank')

    $window.location.href =
      window.location.protocol + "//" +
      window.location.host + "?BrokerId=" +
      AgentInfo.Data.BrokerId +
      "&OfficeCode=" +
      AgentInfo.Data.OfficeCode;
  }
});

console.log($scope.Result)
},
function (error) {
  $scope.Error = error.data
})

此blob在Google Chrome和FireFox中正常运行。但IE会提示打开或保存。但我希望它能在浏览器中打开。我很感激任何输入,让它在没有提示的情况下打开。感谢

1 个答案:

答案 0 :(得分:0)

如何排除if / else语句并在IE中打开ObjectURL呢?否则pdf.js是另一种选择,如果你想使用canvas

在浏览器中呈现它

我在您的代码中看到的另一个问题是您正在尝试使用window.open()打开一个新窗口,问题是它们可以变得非常容易阻止,除非它在用户交互事件(例如onclick)后的1秒内发生例如。 xhr.onload不是用户交互事件

因此,如果您遇到某些问题,请尝试执行类似

的操作
// Untested, just to give a ruffly idea
btn.onclick = () => {
  var win = window.open('', '_blank')
  win.document.body.innerHTML = 'loading...'
  $http.post(...).then(res => {
    var url = URL.createObjectURL(blob)
    // redirect
    win.location.href = url
  })
}

另一件事。你为什么使用responseType = arrayBuffer?你可以直接将它设置为blob ......?