1

I have to print a specific file which is in iframe.

My view_file.ejs:

<div id="viewframe"> 
<iframe id="viewfile"  name="viewfile" src='https://docs.google.com/viewer?url=<%= urlencode.encode(img) %>&embedded=true' style="width: 100%;height:900px" frameborder="0" scrolling="no" seamless="" allowfullscreen="allowfullscreen">
</iframe>
</div>

Here img(which is a variable i have used inside urlencode.encode) is a link from aws s3 bucket

Print button:

<div class="right_blk">
                    <span class="versions"><a ng-click="printdoc('viewframe')" href="javascript:void(0)" >Print</a></span>   
</div>

my app.js:

$scope.printdoc1=function(doc)
{

   window.frames["viewfile"].focus();
   window.frames["viewfile"].print();
}

I have tried many solution from here but nothing works for me. Is any way to do this?

Update

core.js:124 DOMException: Blocked a frame with origin "http://localhost:3000" from accessing a cross-origin frame.
    at b.$scope.printdoc (http://localhost:3000/js/docapp.js:46:32)
    at fn (eval at compile (http://localhost:3000/js/core.js:242:306), <anonymous>:4:162)
    at e (http://localhost:3000/js/core.js:287:342)
    at b.$eval (http://localhost:3000/js/core.js:150:347)
    at b.$apply (http://localhost:3000/js/core.js:151:52)
    at HTMLAnchorElement.<anonymous> (http://localhost:3000/js/core.js:287:394)
    at HTMLAnchorElement.dispatch (http://localhost:3000/js/jquery-3.2.1.min.js:3:10316)
    at HTMLAnchorElement.q.handle (http://localhost:3000/js/jquery-3.2.1.min.js:3:8343)

I am getting this error.

Vishnu
  • 695
  • 6
  • 25
  • Check out this : https://stackoverflow.com/questions/19637312/is-there-an-angular-way-of-printing-a-div-from-a-html-page – Kishor Velayutham Feb 14 '18 at 12:06
  • Thank you for your response @KishorVelayutham link source is already in iframe only and am getting cross origin error too – Vishnu Feb 14 '18 at 12:14

1 Answers1

0
<iframe id="viewfile"  name="viewfile" src='https://docs.google.com/viewer?url=<%= urlencode.encode(img) %>&embedded=true' style="width: 100%;height:900px" frameborder="0" scrolling="no" seamless="" allowfullscreen="allowfullscreen">

Instead of passing id as a argument,do this:

 <span class="versions"><a  ng-click="printdoc()" href="javascript:void(0)" >Print</a></span>

This is how you do it using Javascript:

function printdoc()
{
   document.getElementById("viewfile").contentWindow.print(); //Iframe id
}

In case of Jquery:

$("#viewfile").get(0).contentWindow.print();

Try this one. Hope it helps..!

Kishor Velayutham
  • 760
  • 5
  • 13
  • Thank you .. I will try this one and let you know – Vishnu Feb 14 '18 at 12:34
  • Still am getting this error "Blocked a frame with origin "http://localhost:3000" from accessing a cross-origin frame." I have updated my question with that error – Vishnu Feb 14 '18 at 12:38
  • I think it's security related . Follow this link : https://stackoverflow.com/questions/25098021/securityerror-blocked-a-frame-with-origin-from-accessing-a-cross-origin-frame. Might solve your case. – Kishor Velayutham Feb 14 '18 at 12:40