0

I created a script which takes an xml input and creates html based reports for ease of viewing. All of the reports are based off of the same html template. Some reports are small (50KB), some are larger (7MB). I have a problem with the larger page not rendering images and links pointing to the wrong places. What is odd is that if I remove the large data blocks (just a series of divs), things render fine. Also, things are fine if the reports are smaller to begin with.

For example, with a small report, the following code renders the img correctly:

<a href="http://www.company.com"><img id="logo" src="../images/logo.png" alt="logo" /></a>

The exact same code gives me a missing image icon in a larger report. When inspecting the element in Firefox, I get "Could not load the image" message. Again, all reports are based off the same html template, and the code for the logo and nav never change, neither does the directory structure.

Additionally, the following code is a simple link to return to the main page:

<nav id="nav">
    <a href="../index.html">Dashboard</a>
</nav>

The link works properly in a smaller page, but in a larger one it tries to redirect to file:///user/index.html (wrong).

I have tried moving the large file into a different directory, tried moving it to the parent directory and redoing the links, but nothing helps. While first loading the page, it displays the alt text, then the broken image icon.

This happens in Chrome, Firefox, and IE11. The image displays properly in Safari. The only thing that seems to have an impact is the size of the file.

Any ideas would be greatly appreciated as all my Google-fu has been spent.

  • You're 100% certain there aren't any XML validity problems with your larger XML inputs? It's easy to have a set of text that needs to be wrapped by CDATA but isn't. Broken in => broken out. – Ryan Nigro Feb 28 '15 at 03:47
  • Good point, and while I'm not 100% certain that the xml is valid, it comes from the exact same source every time. Additionally, the xml is getting successfully parsed by the script and put into html. The html which displays the data renders just fine. it is just the one image and link which do not work. – curi0usJack Feb 28 '15 at 03:52
  • I'd view the generated HTML DOM in your resulting file. Almost certainly the image is broken because the image source isn't correct. This sounds to me like it's a data problem with a row in your large data set... not a problem with processing an any-sized (otherwise valid) data set. – Ryan Nigro Feb 28 '15 at 03:57
  • run it through a validator service – charlietfl Feb 28 '15 at 04:22
  • Is it possible that you rendered a into the generated html file at some point as this could totally muck you up and and alter all external resource requests ? – Code Uniquely Feb 28 '15 at 06:57
  • @Ryan - the code I displayed is from the rendered html file, not from the template. It is displayed in the rendered html file correctly, but the image does not render, even though the path is correct. – curi0usJack Feb 28 '15 at 14:03
  • @CodeUniquely - Holy cow that was it! Somehow a tag made it into the body and everything got hosed. Strange that all paths to the css & js files were still correct and rendered, but maybe that's because they were in (I really have no idea what base href is). Huge thanks!! I'm not sure how I can mark your comment as the answer...? – curi0usJack Feb 28 '15 at 14:13
  • I'll add it as an answer and then you can - hang on ... – Code Uniquely Feb 28 '15 at 14:22

1 Answers1

0

Is it possible that you rendered a <base href=""> into the generated html file at some point as this could totally muck you up and and alter all external resource requests ?

HTML <base> Tag

Code Uniquely
  • 6,356
  • 4
  • 30
  • 40