CODEWITHSUNDEEP
imagehttphttp-error
Brad Parks
Brad Parks

Reputation: 72001

Does an <img> tag respond to all Http 4XX errors the same as 404s?

EDIT: In an attempt to clarify my question, here's what I'm trying to understand.

If a web page embeds an image like so:

`<img src="...">`

How do browser handle receiving different HTTP error status codes from the image url? Is it very consistent across browser, and basically treated the same as if the image wasn't there (404) ?

Note that I'm aware that I can "just try it", but I don't have every browser/os/phone around to try it out on, and I'd like to understand how this actually works in reasonably modern desktop and mobile browsers (~IE9 and newer as a fuzzy line). Plus if anyone else is every wondering the same thing, they could come here and see the answer too ;-)

ORIGINAL QUESTION:

I'm implementing a REST service that returns images and videos securely for a client.

I was thinking it'd be nice to send out different HTTP response codes for different types of failures:

Will responding with these different error codes work exactly the same as a 404 response for all reasonably modern browsers from both an HTML and Javascript perspective?

I know the error code would be different of course, but what I'm trying to ensure is that no strange security errors pop up as a result of using these different HTTP responses.

Upvotes: 0

Views: 491

Answers (2)

TheWestIsThe...
TheWestIsThe...

Reputation: 442

A 403 is given by lots of public APIs, for example, Amazon's S3 service responds with a 403 when an object with a temporary access time expires.

e.g. An url like so would generate a 403 with the following response (Note: the below isn't a valid S3 url... keys/signature have been changed)

https://somebucket.s3.amazonaws.com/test/4a828d8cf5633ab41e2fb8deba599178.jpg?AWSAccessKeyId=ACIAICGLRMBL2PTLALHQ&Expires=1424782953&Signature=sWko4DDDRaBS151iEhEZzfDRbU%3D

<Error>
<script/>
<Code>AccessDenied</Code>
<Message>Request has expired</Message>
<Expires>2015-02-24T13:02:33Z</Expires>
<ServerTime>2015-02-24T13:02:55Z</ServerTime>
<RequestId>F4949A0376EC9DCD</RequestId>
<HostId>
BV8KMzUcmymBUWctoB8mzFAhzcCAMil/F3NXP/KyKxJd/Hun6O2lUh4b0BsVcP9iwjL1sJxreug=
</HostId>
</Error>

Upvotes: 1

Alex
Alex

Reputation: 6037

Since you're using REST I assume you're using Ajax or Angular to request your images, right? In that case it is up to javascript to catch the errors. So, your browser will not show any popups when javascript handles it correctly. You could start with something like 

$.ajaxSetup({
    statusCode: {
      401: function(err){
        console.log('Login Failed.', err.responseJSON);
        // or whatever...
      }
    }
  });

Note, the 401error can be found in the header of the response, and replaces the 'Content-Type: image/png' header. So the Client (browser) has no way to know that is an image was requested and handles it like any other page.

Upvotes: 1

Related Questions