Forum Moderators: open

Message Too Old, No Replies

CORS Problem at javascript generating PDF

2 domains, one for Englsih, one for German

         

jetteroheller

1:54 pm on Jan 3, 2023 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Just developing the house configurator.
I have for the house project 2 domains. One for the English content, one for the German content.
One function is to create a PDF with the configured house.

<script src="../pic/jspdf.umd.js></script>

Now from my own computer, this statement causes a CORS error

doc.addImage("https://german.house/pic/some-picture.png", "PNG", 15, 220, 60, 18);

I assume the same, when the javascript is used on "German.haus" and wants to access "English.house".

There will be many pictures in the configurator, so how to do it, to have all the pictures only at one of the 2 domains?

jetteroheller

5:58 pm on Jan 3, 2023 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



I just tested a workaround. I put now all pictures base64 into the javascript. This html is to test to use the same picture in the PDF and on the web page. It worked.
Since I deliver all js gz compressed, the length growth of the gz compressed javascript is about the size of the original picture.

<div id=forpic></div>
<script src=jspdf.umd.js></script>
<script>
function mpdf()
{
window.jsPDF = window.jspdf.jsPDF;

var mypic=`Here goes a long base 64 string
delimiters are essential for multi line strings`;

var doc = new jsPDF();

doc.text(20, 20, 'Hello world!');
doc.text(20, 30, 'This is client-side Javascript to generate a PDF.');

// Add new page
doc.addPage();
doc.text(20, 20, 'Visit .com');
doc.text(20, 40, 'Visit .com');
doc.addImage(mypic, "PNG", 15, 220, 60, 18.2);
doc.save('document.pdf');
document.getElementById("forpic").innerHTML='<img src="data:image/png;base64,'+mypic+'">';
}
</script>

<button onClick=mpdf()>save</button>