vue-pdfmake icon indicating copy to clipboard operation
vue-pdfmake copied to clipboard

XMLHttpRequests blocked by CORS policy because it caches origin on multiple instances

Open ghost opened this issue 2 years ago • 3 comments

Hello

We're using multiple instances (web applications) running on different ports generating some PDFs with vue-pdfmake.

Unfortunately on Chrome and Edge, XMLHttpRequests are blocked by CORS policy because it caches the origin header on an instance.

For example:

  1. I'm generating a simple PDF running on a web server with port 8030 which loads a custom font from another web server running on port 8001. So far so good.
  2. As soon as I try to generate another PDF with pdfmake running on another web server with port 8031, trying to access the same custom font on port 8001, it fails with the following message:

Access to XMLHttpRequest at 'http://SERVER:8001/fonts/some_font.otf' from origin 'http://SERVER:8031' has been blocked by CORS policy: The 'Access-Control-Allow-Origin' header has a value 'http://SERVER:8030' that is not equal to the supplied origin.

Is there a way to disable caching header data on XMLHttpRequests? As soon as I delete browser cache or if I'm using a private session, it works again.

I'm using vue 3.2.13 with vue3-pdfmake 2.2.0.

Thanks and regards

ghost avatar Jun 20 '23 13:06 ghost

Hi! It's a pdfmake issue, but you can try to disable fontLayoutCache option.

Novout avatar Jun 22 '23 13:06 Novout

Thanks for your answer.

Unfortunately that does not work. I guess I have to set this option here, correct?

const pdfMake = usePDF({
  autoInstallVFS: true,
  fontLayoutCache: false,
});

ghost avatar Jun 26 '23 07:06 ghost

The fontLayoutCache option does not work. However, we just changed the font's URL to load a different version every time like this:

http://SERVER:8001/fonts/some_font.otf?v=1234

ghost avatar Jan 11 '24 14:01 ghost