1
0
Fork 0
mirror of https://github.com/mozilla/pdf.js.git synced 2025-04-22 16:18:08 +02:00

Create absolute filter-URLs when needed in DOMFilterFactory (issue 18406)

This functionality is purposely limited to development mode and GENERIC builds, since it's unnecessary in e.g. the *built-in* Firefox PDF Viewer, and will only be used when a `<base>`-element is actually present.

*Please note:* We also have tests in mozilla-central that will *indirectly* ensure that relative filter-URLs work as intended in the Firefox PDF Viewer, see https://searchfox.org/mozilla-central/source/toolkit/components/pdfjs/test/browser_pdfjs_filters.js

---

To test that the issue is fixed, the following code can be used:

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <base href=".">
  <title>base href (issue 18406)</title>
</head>
<body>

<ul>
  <li>Place this code in a file, named `base_href.html`, in the root of the PDF.js repository</li>
  <li>Run <pre>npx gulp dist-install</pre></li>
  <li>Run <pre>npx gulp server</pre></li>
  <li>Open <a href="http://localhost:8888/base_href.html">http://localhost:8888/base_href.html</a> in a browser</li>
  <li>Compare rendering with <a href="http://localhost:8888/web/viewer.html?file=/test/pdfs/issue16287.pdf">http://localhost:8888/web/viewer.html?file=/test/pdfs/issue16287.pdf</a></li>
</ul>

<canvas id="the-canvas" style="border: 1px solid black; direction: ltr;"></canvas>

<script src="/node_modules/pdfjs-dist/build/pdf.mjs" type="module"></script>

<script id="script" type="module">
  //
  // If absolute URL from the remote server is provided, configure the CORS
  // header on that server.
  //
  const url = '/test/pdfs/issue16287.pdf';

  //
  // The workerSrc property shall be specified.
  //
  pdfjsLib.GlobalWorkerOptions.workerSrc =
    '/node_modules/pdfjs-dist/build/pdf.worker.mjs';

  //
  // Asynchronous download PDF
  //
  const loadingTask = pdfjsLib.getDocument(url);
  const pdf = await loadingTask.promise;
  //
  // Fetch the first page
  //
  const page = await pdf.getPage(1);
  const scale = 1.5;
  const viewport = page.getViewport({ scale });
  // Support HiDPI-screens.
  const outputScale = window.devicePixelRatio || 1;

  //
  // Prepare canvas using PDF page dimensions
  //
  const canvas = document.getElementById("the-canvas");
  const context = canvas.getContext("2d");

  canvas.width = Math.floor(viewport.width * outputScale);
  canvas.height = Math.floor(viewport.height * outputScale);
  canvas.style.width = Math.floor(viewport.width) + "px";
  canvas.style.height = Math.floor(viewport.height) + "px";

  const transform = outputScale !== 1
    ? [outputScale, 0, 0, outputScale, 0, 0]
    : null;

  //
  // Render PDF page into canvas context
  //
  const renderContext = {
    canvasContext: context,
    transform,
    viewport,
  };
  page.render(renderContext);
</script>

</body>
</html>
```
This commit is contained in:
Jonas Jenwald 2024-07-08 18:00:27 +02:00
parent e8d35c25ee
commit 50a5a15088
4 changed files with 35 additions and 5 deletions

View file

@ -49,6 +49,8 @@ class PixelsPerInch {
* does the magic for us.
*/
class DOMFilterFactory extends BaseFilterFactory {
#baseUrl;
#_cache;
#_defs;
@ -121,6 +123,25 @@ class DOMFilterFactory extends BaseFilterFactory {
return [bufferR.join(","), bufferG.join(","), bufferB.join(",")];
}
#createUrl(id) {
if (typeof PDFJSDev === "undefined" || PDFJSDev.test("GENERIC")) {
if (this.#baseUrl === undefined) {
const url = this.#document.URL;
if (url === this.#document.baseURI) {
// No `<base>`-element present, hence a relative URL should work.
this.#baseUrl = "";
} else if (isDataScheme(url)) {
warn('#createUrl: ignore "data:"-URL for performance reasons.');
this.#baseUrl = "";
} else {
this.#baseUrl = url.split("#", 1)[0];
}
}
return `url(${this.#baseUrl}#${id})`;
}
return `url(${id})`;
}
addFilter(maps) {
if (!maps) {
return "none";
@ -146,7 +167,7 @@ class DOMFilterFactory extends BaseFilterFactory {
// https://www.w3.org/TR/SVG11/filters.html#feComponentTransferElement
const id = `g_${this.#docId}_transfer_map_${this.#id++}`;
const url = `url(#${id})`;
const url = this.#createUrl(id);
this.#cache.set(maps, url);
this.#cache.set(key, url);
@ -232,7 +253,7 @@ class DOMFilterFactory extends BaseFilterFactory {
filter
);
info.url = `url(#${id})`;
info.url = this.#createUrl(id);
return info.url;
}
@ -254,7 +275,7 @@ class DOMFilterFactory extends BaseFilterFactory {
}
const id = `g_${this.#docId}_alpha_map_${this.#id++}`;
const url = `url(#${id})`;
const url = this.#createUrl(id);
this.#cache.set(map, url);
this.#cache.set(key, url);
@ -287,7 +308,7 @@ class DOMFilterFactory extends BaseFilterFactory {
}
const id = `g_${this.#docId}_luminosity_map_${this.#id++}`;
const url = `url(#${id})`;
const url = this.#createUrl(id);
this.#cache.set(map, url);
this.#cache.set(key, url);
@ -389,7 +410,7 @@ class DOMFilterFactory extends BaseFilterFactory {
filter
);
info.url = `url(#${id})`;
info.url = this.#createUrl(id);
return info.url;
}