URL이 https로 시작하는 경우 iframe 인쇄가 크롬에서 작동하지 않습니다.

window.open 및 window.print 기능을 사용하지 않고 페이지를 인쇄해야합니다.URL이 https로 시작하는 경우 iframe 인쇄가 크롬에서 작동하지 않습니다.
다음 코드를 사용하여 동일한 결과를 얻었습니다. 이것은 url이 https로 시작하지 않는 경우 작동합니다 (atleast는 내가 생각한 것입니다). URL이 https로 시작하면 크롬은 빈 페이지를 인쇄합니다. 링크를 여러 번 클릭하여 인쇄 할 때 페이지 데이터가 표시되는 경우가 있습니다. 이 코드는 IE와 FireFox에서 올바르게 작동합니다.

이 코드가 포함 된 샘플 테스트 페이지를 아래 URL에 업로드했습니다.

http://mediateqindia.com/testPrint.html는

https://mediateqindia.com/testPrint.html (클릭 인쇄 링크에 빈 페이지)

두 링크가 동일한 페이지를 가리키는를 (제대로 작동).

https의 Chrome에서 작동하려면 어떻게 수정해야합니까?

testPrint.html 페이지의 코드는 아래와 같습니다.

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width"> 
    <title>JS Bindddddddddd</title> 
</head> 
<body> 
<div id="testPrintDiv" > 
Hiiiiiiiiiiiiiii 
<br /><br /> 
Hellooooooooooooo 
<br /><br /> 
World !!!!!!!!!!!!!!!!!!!!!!!!!!!s 
<a href="javascript:printTest();">Print</a> 
</div> 
</body> 
</html> 



<script> 
function printTest(){ 
var scale=1; 
var contents=document.getElementById("testPrintDiv").innerHTML; 
if(!scale){ 
    scale=".9"; 
} 
    var printframe = document.createElement('iframe'); 
    printframe.name = "printframe"; 
    printframe.style.position = "absolute"; 
    printframe.style.top = "-1000000px"; 
    document.body.appendChild(printframe); 
    var frameDoc = printframe.contentWindow ? printframe.contentWindow : printframe.contentDocument.document ? printframe.contentDocument.document : printframe.contentDocument; 
    frameDoc.document.open(); 
    frameDoc.document.write('<meta http-equiv="X-UA-Compatible" content="IE=edge" /><html><head><title></title>'); 
    frameDoc.document.write('<link rel="stylesheet" type="text/css" href="/user/data/css/styles-min.css">'); 
    frameDoc.document.write('<style type="text/css">@media print { body {transform: scale('+scale+');} @page{margin-left: 0cm;} body {margin-left:0;padding:0;}' 
       +'</style></head><body>'); 
     frameDoc.document.write(contents); 
     frameDoc.document.write('</body></html>'); 
     frameDoc.document.close(); 

     setTimeout(function() { 
      window.frames["printframe"].focus(); 
      window.frames["printframe"].print();  
      setTimeout(function() { 
       document.body.removeChild(printframe); 
      },5000); 
     }, 750); 

    //return false;  
} 

</script>

출처

2017-12-24 Raj

문제는 CSS 파일 로딩 시간과 관련이 있습니다.

아래 라인을 주석 처리했을 때 모든 것이 잘 작동하기 시작했습니다. 예상대로 작동 이제 인 아래로의 setTimeout에 지정된 간격을 증가에

frameDoc.document.write('<link rel="stylesheet" type="text/css" 
href="/user/data/css/styles-min.css">');

위의 코드는 서버 위치에 따라 달라질 것입니다 CSS 파일을 가져 오는 데 필요한 intermittently.Since 시간을 일하는 기능, 나는 코드를 다시 썼다.

<script> 
function printTest(){ 
var scale=1; 
var contents=document.getElementById("testPrintDiv").innerHTML; 
if(!scale){ 
    scale=".9"; 
} 
    var printframe = document.createElement('iframe'); 
    printframe.name = "printframe"; 
    printframe.style.position = "absolute"; 
    printframe.style.top = "-1000000px"; 
    document.body.appendChild(printframe); 
    var frameDoc = printframe.contentWindow ? printframe.contentWindow : printframe.contentDocument.document ? printframe.contentDocument.document : printframe.contentDocument; 
    $.when($.ajax({url:'/user/data/css/styles-min.css',cache:true})) 
      .done(function(response) { 
    frameDoc.document.open(); 
    frameDoc.document.write('<meta http-equiv="X-UA-Compatible" content="IE=edge" /><html><head><title></title>'); 
    frameDoc.document.write('<link rel="stylesheet" type="text/css" href="/user/data/css/styles-min.css">'); 
    frameDoc.document.write('<style type="text/css">@media Print {body {transform:scale('+scale+')}} @page{margin-left: 0cm;} body {margin-left:0;padding:0;}' 
       +'</style></head><body>'); 
     frameDoc.document.write(contents); 
     frameDoc.document.write('</body></html>'); 
     frameDoc.document.close(); 

     setTimeout(function() { 
      window.frames["printframe"].focus(); 
      window.frames["printframe"].print();  
      setTimeout(function() { 
       document.body.removeChild(printframe); 
      },1500); 
     }, 1500); 

    });  
} 

</script>

출처

2018-01-26 11:38:17 Raj

URL이 https로 시작하는 경우 iframe 인쇄가 크롬에서 작동하지 않습니다.

답변

관련 문제