Javascript 如何在iframe中水平放置PDF文件？

我一直在努力使pdf水平动态适合 &view=FitH

但它在firefox中不起作用

您可以在这里看到演示，尽管此演示工作正常。

1）嵌入已过时，不应再使用它来获得一致的结果

2） 有多种方法可以实现这一点（例如，ajax抓取文件，然后呈现），但是，我会消除浏览器依赖插件的怪癖

为了“正确地”做到这一点，我将检查并查看单独用javascript呈现pdf。它消除了在计算机上安装读卡器的需要，并且是事情将朝着这个方向发展的方式

3） 为了处理水平匹配问题，我发现css给了我一些浏览器中的iframes/pdf组合的问题，并求助于使用老式的宽度和高度，如下所示。古怪，但它在firefox、chrome、IE9、safari中都能工作，所以请不要因为浏览器的古怪而否定我。否则我只会使用css

<iframe name="myiframe" id="myiframe"  width="100%" height="600" src="viewpdf.php"></iframe>

所以…在JavaScript中，它看起来像：

function getXMLHttp() {
  var xmlHttp;
  try {
    //Firefox, Opera 8.0+, Safari
    xmlHttp = new XMLHttpRequest();
  } catch(e) {
    //Internet Explorer
    try {
      xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch(e) {
      try {
        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
      } catch(e) {
        alert("Your browser does not support AJAX!");
        return false;
      }
    }
  }
  return xmlHttp;
}        
var oRequest = getXMLHttp();
var sURL = "/tmp/pdf-13319JPL3j7.pdf"; 
oRequest.open("GET",sURL,false);
oRequest.setRequestHeader("Content-Type","application/pdf");
oRequest.setRequestHeader("Accept-Ranges","none");
oRequest.setRequestHeader("Content-Disposition","inline; filename='"+sURL+"'");
oRequest.setRequestHeader("Content-Transfer-Encoding","binary");
oRequest.setRequestHeader("Cache-Control","no-store, must-revalidate, post-check=0, pre-check=0', true");
oRequest.onreadystatechange = function() {
    if( oRequest.readyState == 4 ) {
        if (oRequest.status==200) { 
            document.write (oRequest.responseText);
        }
    }
}
oRequest.send(null)
</script>

函数getXMLHttp（）{ var-xmlHttp； 试一试{ //Firefox、Opera 8.0+、Safari xmlHttp=新的XMLHttpRequest（）； }捕获（e）{ //Internet Explorer 试一试{ xmlHttp=新的ActiveXObject（“Msxml2.xmlHttp”）； }捕获（e）{ 试一试{ xmlHttp=新的ActiveXObject（“Microsoft.xmlHttp”）； }捕获（e）{ 警告（“您的浏览器不支持AJAX！”）； 返回false； } } } 返回xmlHttp； } var oRequest=getXMLHttp（）； var sURL=“/tmp/pdf-13319JPL3j7.pdf”； 打开（“获取”，sURL，false）； setRequestHeader（“内容类型”、“应用程序/pdf”）； setRequestHeader（“接受范围”、“无”）； setRequestHeader（“内容处置”，“内联；文件名=”“+sURL+””）； setRequestHeader（“内容传输编码”、“二进制”）； setRequestHeader（“缓存控制”，“无存储，必须重新验证，后检查=0，预检查=0'，true”）； oRequest.onreadystatechange=函数（）{ if（oRequest.readyState==4）{ 如果（oRequest.status==200）{ document.write（oRequest.responseText）； } } } oRequest.send（空）

---

好吧，没有办法解决这种特定于浏览器的bug。pdf查看器在不同浏览器中的工作方式不同。我建议您使用可用的Javascript PDF查看器。

JSFIDLE对我来说无法“正常”工作；它提示我下载。（我正在运行Firefox。）可能是您的系统上没有安装acrobate reader或任何其他pdf阅读器；不过，我没有浏览器插件。我有一个php解决方案，正在为您将其转换为javascript。您需要一个否定正在安装的pdf阅读器的解决方案吗？谢谢@Cymbals，但我尝试了pdf.js，它无法正确呈现复杂的pdf文件（例如，复杂的表格数据）。所以我决定在iframe解决方案中使用pdf。好的，然后我将使用ajax获取文件，然后为pdf正确设置标题，然后输出文件。但是，即使在通过ajax呈现pdf之后，它如何解决我的问题呢？因为在这种情况下，它也将被加载到iframe中。这很好-关键是要避免嵌入，这就是为什么要使用ajax加载到它。如果不使用iframe、embed或object标记，如何在页面中显示pdf文件？阿贾克斯是如何拯救的？如果可用，是否也要查看工作代码？

function getXMLHttp() {
  var xmlHttp;
  try {
    //Firefox, Opera 8.0+, Safari
    xmlHttp = new XMLHttpRequest();
  } catch(e) {
    //Internet Explorer
    try {
      xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch(e) {
      try {
        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
      } catch(e) {
        alert("Your browser does not support AJAX!");
        return false;
      }
    }
  }
  return xmlHttp;
}        
var oRequest = getXMLHttp();
var sURL = "/tmp/pdf-13319JPL3j7.pdf"; 
oRequest.open("GET",sURL,false);
oRequest.setRequestHeader("Content-Type","application/pdf");
oRequest.setRequestHeader("Accept-Ranges","none");
oRequest.setRequestHeader("Content-Disposition","inline; filename='"+sURL+"'");
oRequest.setRequestHeader("Content-Transfer-Encoding","binary");
oRequest.setRequestHeader("Cache-Control","no-store, must-revalidate, post-check=0, pre-check=0', true");
oRequest.onreadystatechange = function() {
    if( oRequest.readyState == 4 ) {
        if (oRequest.status==200) { 
            document.write (oRequest.responseText);
        }
    }
}
oRequest.send(null)
</script>