2

So, what I'm trying to do is to check with Javascript if an image exists on my Amazon S3.

I'm able to do this with the typical way of preloading the image and use onload and onerror events to check if the image is there.

var img = new Image;
img.src = imageUrl;
img.onerror = function()....
img.onload = function()...

What I'm trying to achieve now is the same but without fully download the image. Let's say I have a possible 3mb image. If I check with the way I'm doing it now, if the image doesn't exist it'll go into the onerror event, I'll do a call to my server to generate the image and then I'll check again. When the image exists, it'll download the 3mb image and it'll go into the onload event.

If the image doesn't exist, Amazon returns a 403 Forbidden status code. If it does exist, it returns a 200 Ok one.

My question is:

Is there any way to just check the status code or any other way without fully download the image?

Thanks!!

JV Lobo
  • 5,526
  • 8
  • 34
  • 55
  • as per this [answer](https://stackoverflow.com/questions/26726862/how-to-determine-if-object-exists-aws-s3-node-js-sdk), perhaps request [headObject](https://docs.aws.amazon.com/AWSJavaScriptSDK/latest/AWS/S3.html#headObject-property) – Varinder Feb 22 '18 at 03:29
  • thanks for your answer @Varinder but I'm using just regular Javascript without any library – JV Lobo Feb 22 '18 at 03:31
  • You can use [REST API](https://docs.aws.amazon.com/AmazonS3/latest/API/RESTObjectHEAD.html) for headObject – long.luc Feb 22 '18 at 03:55

1 Answers1

4

Try doing a HEAD request as shown in this answer

https://stackoverflow.com/a/333657/209067

A copy of the code from the answer linked above:

function UrlExists(url, callback)
{
    var http = new XMLHttpRequest();
    http.open('HEAD', url);
    http.onreadystatechange = function() {
        if (this.readyState == this.DONE) {
            callback(this.status != 404);
        }
    };
    http.send();
}

If your case you will need to check for 403 instead of 404

Pablo
  • 5,897
  • 7
  • 34
  • 51
  • thanks for your answer Pablo. the thing is, I'm always getting 0 as a status, no signs of status 200 or 403... not sure why! I check on the developers tools -> network tab and I can see the call with method "HEAD" and how it receives a 403 – JV Lobo Feb 22 '18 at 04:21
  • You are probably getting a JS error, check the console for errors and take it from there. – Pablo Feb 22 '18 at 04:34
  • it's not a JS error. I think it has to do with CORS and doing calls to external servers – JV Lobo Feb 22 '18 at 04:41
  • Right, if it is in fact a CORS issue then there should be an error in the browser console – Pablo Feb 22 '18 at 04:44
  • Yeah, it's CORS, because I have a Chrome plugin which "bypass" the CORS thing, if I activated it, it works well. thing is... any workaround for this? – JV Lobo Feb 22 '18 at 04:47
  • 2
    @JVLobo If you own the S3 bucket you can setup a CORS policy in AWS. – Pablo Feb 22 '18 at 04:51
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/165672/discussion-between-pablo-and-jv-lobo). – Pablo Feb 22 '18 at 19:07