Clicking on image links dumps raw bytes into DOM tree

[khromov]

We have some problem with links in PJAX - clicking on a link pointing to an image (JPG or PNG) on the same domain fetches the image as an AJAX call and then dumps the raw byte content of the image into the PJAX container. Is there any way (based on mimetype or extension) to avoid this issue?

[mislav]

Yikes. I was thinking of adding a change that rejects any ajax response that's not text/html and loads the resource with hard reload instead. That would address this issue but I wonder will people's other uses cases suffer because of that, e.g. if their server does't return text/html but some other MIME type.

For now, you may ignore links based on extension:

$(document).on('pjax:click', function(event) {
  return !/\.(jpe?g|png|gif)$/i.test(event.target.pathname)
})

The handler should return false for links that have common image extensions in the URL and thus abort pjax, resulting in the link being loaded normally. Does this make sense?

[khromov]

Hey @mislav

I think doing mimetype checking is the best way. Most web frameworks/languages will serve text/html by default, there's even an RFC for it: http://tools.ietf.org/html/rfc2854

On the off chance that something else is served up, the only thing that happens is a full reload. Contrast that to what happens if binary data is accidentally loaded. If that image in my example would have been a 500MB file the browser would have locked up for example, trying to blow up the DOM. :)

Extension checking is an OK workaround, but many frameworks mangle file names so mime type is the only way to be really sure. Would it be hard to write a mime check?

[mislav]

I don't think it would be hard to add a check. In fact, you could try to take a stab at a pull request for this. We might also consider supporting HTML-ish types such as XHTML.