CODEWITHSUNDEEP
phpjavascriptjquery
Randomize
Randomize

Reputation: 9103

javascript/jquery: get info for a remote image

I have an image that has "src" pointing to an external server, like this:

   <img src="http://somewhere.com/script.php?id=1234">

The image returned is .png and it can be returned as a "X" image or "O" image.

How can I determinate if the image is X or O with javascript/jquery? Calculating md5 of the loaded image? In case how can I access to the image bytes and calculate md5?

Upvotes: 2

Views: 582

Answers (2)

Ridcully
Ridcully

Reputation: 23665

You could draw the image into a canvas object and then check the pixels. E.g. an X would perhaps have a black pixel at the top-left corner while an O would have a transparent or white one (depends on the images of course).

Upvotes: 0

Frog
Frog

Reputation: 1641

First of all, what you're doing is probably very inefficient. Because you load the image from a dynamic PHP script, most browsers will not cache it. Furthermore, loading images from another site you do not have access to is always considered bad practice.

Anyways, the easiest way to do this is using a server side language like PHP. Then you can get the file size using either curl, fsocketopen, get_headers or fopen. By comparing this number to the known file size of the images, you know which image is loaded. Take a look at this page for an example using curl.

Alternatively, you can also do this using JavaScript (if you really must): take a look at this stackoverflow question.

Upvotes: 2

Related Questions