How to load image from cross-site

I know the official action:load image from URL could not load image from cross-site.

Is there any way (in javascript code) or any library to load image from cross-site? I have no idea after asking google. <img src="smileys/smiley19.gif" border="0" align="middle" />

I�ve done a fast search about this and founded this: Ajax cross domain.

I haven�t had time to read it, but maybe it can help you, no idea :).

sirLobito

Thanks, I use this library for cross-domain ajax (ajax.get) -- Cross-domain requests with jQuery, it works. But I don't know how to use it for image.

What you want is to send xxx data via Ajax and receive and image for example?

And can�t you send back not an image, instead, it�s source, and use that string as img�s src?

sirLobito

I had a plugin request to get and parse html file and get image from other web site (cross-domain).

The target image must be sent with the Access-Control-Allow-Origin: * HTTP header. It's described in the AJAX manual entry. If the image is not sent with that header, there's not much you can do, it's the equivalent of the server saying "you are not allowed to use this image".

There's a trick : you need to display the image in a classic <img> tag.

When it's done, that image can be pasted on a <canvas>, in a 'classic' way.

You can then do a .toDataURL() from the <canvas>, to have the base64 string representation of that image.

With that image string, you can then do what you want <img src="smileys/smiley2.gif" border="0" align="middle" />.

Ashley

Pode

Thanks. I'll try it. <img src="smileys/smiley36.gif" border="0" align="middle" />

Pode

I use your div plugin, put <img> tag by action:innerhtml. It works, thanks.

rexrainbow : you're welcome ;).

AFAIK, toDataURL() is blocked if you've drawn a cross-domain image to it (if it did not send the access control HTTP header). This is another security measure to prevent accessing the pixel data of cross-domain images.

Pode

I use your div plugin, put <img> tag by action:innerhtml. It works, thanks.

Sounds fun :]

Can we have a capx or some detail/tutorial on how to do that?

I tried loading images from a proxy (like this code.google.com/p/mirrorrr/) on my domain, but while it used to work with flash and other stuff, I can't make it work with C2 :\</p>

lemo

Capx

You need Pode's img plugin.

Thanks for the capx!

Actually I made it work in the meantime with my proxy method, but it doesn't hurt knowing an alternative I guess ^^

Just tried the plugin though, and I'm gonna have to stick with the proxy (and load img from url) for now, because the Sprite element is more flexible for my use

Also "Set image to URL" from the plugin gives me an error...

(reporting in the other thread)