I am trying to add the PDF.js viewer as it appears in the official demo in an HTML iframe of my Django template. I do not want include any of the assets of PDF.js in my repository and I want all my script and stylesheet HTML tags to refer to a CDN resource.
Since the documentation contains a note that users of the library should not just copy/paste the web/viewer.html, I have created my own modified version named custom_viewer.html, which includes a subset of the features of the official demo. The prebuilt version of the library includes the following four tags in the demo web/viewer.html:
<link rel="resource" type="application/l10n" href="locale/locale.json">
<script src="../build/pdf.mjs" type="module"></script>
<link rel="stylesheet" href="viewer.css">
<script src="viewer.mjs" type="module"></script>
My question is what are the corresponding CDN links to get this working without downloading the PDF.js library on the server?
I have managed to replace the pdf.mjs file reference with a CDN link. More specifically, I have verified that when I copy the prebuilt PDF.js (version 4.0.379) in my static folder and I modify the paths as follows:
{% load static %}
<link rel="resource" type="application/l10n" href="{% static 'my-django-app/pdfjs-4.0.379-dist/web/locale/locale.json' %}">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/build/pdf.mjs" type="module"></script>
<link rel="stylesheet" href="{% static 'my-django-app/pdfjs-4.0.379/web/viewer.css' %}">
<script src="{% static 'my-django-app/pdfjs-4.0.379/web/viewer.mjs' %}" type="module"></script>
then the following iframe renders correctly:
<iframe src="{% url 'my-django-app:my-custom-pdf-view' %}?file={{document.pdf.url}}" width="100%" height="100%" style="border: none;"></iframe>
How do I replace the remaining three relative paths with links from a CDN?