Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

592
Vistas
JQuery .contents() on an iframe displaying base64-encoded pdf

I have an iframe displaying a base64-encoded PDF. Once it has loaded, I attempt to do .contents().find(..), however it is not finding the contents. Within the iframe is the correctly-loaded HTML doc containing the PDF, and a text element " ". Doing .contents() will return one item, which is the text " ".

All of this code works fine if I don't include the base64 string as source for the iframe (data:application/pdf;base64,..). The PDF itself displays fine and is loaded correctly, but I cannot find a way to access the document through JS / JQuery. I do not believe this is a timing issue, as in debugger mode when paused at the line before it fails, I can see the content has been loaded fully (furthermore, the .on('load', ..) method is being used).

Relevant code (ASP .NET MVC):

HTML:

<iframe class="converted-display"  id="doc-iframe" src="@ViewBag.RAWData">
</iframe>

JS:

$(document).ready(function () {

    var url = window.location.href

    if (url.toLowerCase().includes("convert")) {
        $('#doc-iframe').on('load', function () {
            debugger
            $('#doc-iframe').contents().find('body').addClass('..')

            var element = $('#doc-iframe').contents().find('head').first()[0];

            var style = document.createElement('style');

            style.innerHTML = ..

            window.styleNode = style;

            element.parentNode.insertBefore(style, element);
        })
    }

})

ViewBag.RAWData will contain a (data:application/pdf;base64,..) string.

The result of $('#doc-iframe') when paused at the debugger, clearly showing that the doc has loaded

Showing the result of .contents() and attempting to index it

To rule out async issues, I also tried the commands in the console after the page had fully loaded, and met the same problems.

Does anyone have any suggestions or resources? I have read the doc for .contents() and various other docs, have also tried a multitude of variations on the JS, as well as different methods of displaying PDFs e.g. object, embed, which is making me wonder if the root issue is the src which is being provided.

Thank you very much for any help.

UPDATE:

Cross-origin issue, which I did not expect since the data is essentially hard-coded at the point that it has been loaded - any suggestions for how to fix this?

about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda