TwitPic is a service that lets you share photos on Twitter by generating a tiny url to the image being uploaded. The flash.filesystem.File class allows Adobe AIR to post an image to TwitPic. By specifying the username, password and posting method it is possible to submit a query to the TwitPic API.
package com.cb.twitpic
{
import flash.events.DataEvent;
import flash.events.Event;
import flash.filesystem.File;
import flash.net.FileFilter;
import flash.net.URLRequest;
import flash.net.URLRequestMethod;
import flash.net.URLVariables;
public class TwitPic
{
private var _file:File;
public function TwitPic()
{
_file = new File();
_file.addEventListener(DataEvent.UPLOAD_COMPLETE_DATA,uploadCompleteDataHandler);
browse();
}
private function browse():void {
_file.addEventListener(Event.SELECT, fileSelected);
_file.browse( new Array( new FileFilter( "Images (*.jpg, *.jpeg, *.gif, *.png)", "*.jpg;*.jpeg;*.gif;*.png" ) ) );
}
private function fileSelected(event:Event):void {
var urlRequest:URLRequest = new URLRequest("http://twitpic.com/api/upload");
// The API requires the request be sent via POST
urlRequest.method = URLRequestMethod.POST;
// Enter a valid Twitter username / password combination
var urlVars:URLVariables = new URLVariables();
urlVars.username = TWITTER_USERNAME;
urlVars.password = TWITTER_PASSWORD;
urlRequest.data = urlVars;
// The API requires the file be labeled as 'media'
_file.upload(urlRequest, 'media');
}
private function uploadCompleteDataHandler(event:DataEvent):void
{
var resultXML:XML = new XML(event.text);
// Trace the path to the resulting image tiny url (mediaurl)
trace(resultXML.child("mediaurl")[0]);
}
}
}
This can be used within an AIR application by importing TwitPic and initializing the class.
Sample Code
http://www.blackcj.com/PostTwitPicFromAIR.zip
This is really useful! Thanks! I’d love to see a working example if possible
Thanks for sharing
hi… thanks for the info but I want put the code on Flex with FileReferense but appears an error:
“Error #2044: SecurityErrorEvent no controlado: text=Error #2049: Violación de la seguridad Sandbox: http://www.ddsmedia.net/tweet/index.swf no puede cargar datos en http://twitpic.com/api/uploadAndPost.”
can you help me???
please
i try with localhost and on server online
It doesn’t look like Twitpic has a crossdomain.xml file. You may have to route the call through a PHP script located on your server. By passing the file through PHP you can avoid the cross domain issue. If I have some extra time this week I may be able to throw together a sample PHP file that would do this.
hey Chris….
please help me…
i have a crossdomain.xml on my server but isn’t working…
the content of mi xml file is the follow lines:
<?xml version="1.0" encoding="utf-8"?>
<cross-domain-policy>
<site-control permitted-cross-domain-policies="all"/>
<allow-access-from domain="*"/>
<allow-access-from domain="*" secure="false"/>
<allow-access-from domain="*" to-ports="*"/>
<allow-http-request-headers-from domain="*" headers="*" secure="false"/>
</cross-domain-policy>
where is the error???
please help me..
Keep in mind that Adobe AIR generally does not require a crossdomain file since it uses localhost for all requests.
A crossdomain file should site at the root of the domain in which you are accessing. You can check out flickrs crossdomain file for an example (http://static.flickr.com/crossdomain.xml). It is also possible to force Flash to use a specific policy file using Security.loadPolicyFile(“http://www.example.com/sub/dir/pf.xml”). More information can be found at: http://livedocs.adobe.com/flex/3/langref/flash/system/Security.html#loadPolicyFile%28%29
hello.
you shoud use relative URLs. put your file.php in the root folder of your site (that’s to say, in yourdomain/file.php) and use in flex this url: /file.php
it worked for me.
regards
If the Flex and PHP are on the same domain you shouldn’t have any cross domain issues regardless of whether your path is relative or absolute. I personally prefer absolute URLs so the SWF can be moved around on the site without breaking the API calls. Relative URLs work for smaller sites that you are confident won’t be changed around much. Just to clarify, if you would like to use this example in Flex on the web you will want to communicate like this: Flex web app – PHP on your server – TwitPic API. You can not currently connect directly to the TwitPic API from a Flex web app because they do not have a policy file. If your running this through Adobe AIR (like in the example above) you can ignore this comment. Cheers.
hi chris
in a flash web application how do i make it work
urlVars.username = TWITTER_USERNAME;
urlVars.password = TWITTER_PASSWORD;
urlVars.media = byteArray; // this is a binnaty array of an movieClip
urlVars.message = “New tweet”;
var urlRequest:URLRequest = new URLRequest(“http://twitpic.com/api/uploadAndPost”);
urlRequest.data = urlVars;
urlRequest.method = URLRequestMethod.POST;
// create the image loader & send the image to the server;
var urlLoader : URLLoader = new URLLoader();
//urlLoader.dataFormat = URLLoaderDataFormat.VARIABLES;
urlLoader.load( urlRequest );
but this doesn’t seem to do anything i can use filereference for web applications but how to i convert bytearray to filereference.
Please suggest.
Shammi,
You’ll need to take advantage of the UploadPostHelper class to upload display objects to TwitPic. Luckily I had a blog post already in the works on this topic that I finished up as a response to your question. Please see http://www.blackcj.com/blog/2010/07/05/send-display-objects-to-php-as-images/ for more details and sample code.
-Chris
Hi Chris,
I´m developing a FlashPlayer app that use TwitPic API, but I need pass MovieClip as”media”. I tried to turn this MovieClip into ByteArray (through BitmapData and JPGEncoder) and pass “media” in URLVariables, but a got this response:
Can you help me?
Nice work with this post!!
Filipe,
Check out my comment to Shammi above. I’ve got another blog post that has source code that should be exactly what you’re looking for. Please feel free to contact me if that post doesn’t answer your question.
Cheers,
Chris
It´s alive!!!!!
It´s exactly waht I´m looking for. Thanks so much for your help!
My Aplication works in flash ide, but dont work in browser .
Why ?
This post is for Adobe AIR which uses localhost. On the web, Flash content requires a crossdomain.xml file for accessing files on another server. TwitPic only allows requests coming from their server. You will need a proxy on your local server in order to get around this. Please see my post on setting up a Twitter proxy:
http://www.blackcj.com/blog/2008/10/04/flexfeed-integrate-twitter-rss-feeds-into-flex/
Setting up a TwitPic proxy would be similar. For more information on policy files please read this article:
http://www.adobe.com/devnet/flashplayer/articles/fplayer9_security.html