<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Miti&#039;s Blog &#187; mpricope</title>
	<atom:link href="http://miti.pricope.com/author/mpricope/feed/" rel="self" type="application/rss+xml" />
	<link>http://miti.pricope.com</link>
	<description>about technology</description>
	<lastBuildDate>Sat, 06 Feb 2010 10:08:13 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0.1</generator>
		<item>
		<title>Using Illustrator, Flash Catalyst and Flash Builder to create an avatar widget</title>
		<link>http://miti.pricope.com/2010/02/06/using-illustrator-flash-catalyst-and-flash-builder-to-create-an-avatar-widget/</link>
		<comments>http://miti.pricope.com/2010/02/06/using-illustrator-flash-catalyst-and-flash-builder-to-create-an-avatar-widget/#comments</comments>
		<pubDate>Sat, 06 Feb 2010 08:08:06 +0000</pubDate>
		<dc:creator>mpricope</dc:creator>
				<category><![CDATA[flash builder]]></category>
		<category><![CDATA[tips & tricks]]></category>
		<category><![CDATA[tutorials]]></category>
		<category><![CDATA[video]]></category>

		<guid isPermaLink="false">http://miti.pricope.com/?p=257</guid>
		<description><![CDATA[Since I have a little more spare time now … I decided to hack a little bit . Avatar is the new hype nowadays and I wanted to understand how simple (or how complicated) will be to build an avatar widget. So I gave it a try, but instead of a Na’vi avatar, I decided [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://miti.pricope.com/samples/video/Avatar_Widget_Illustrator_Catalyst_Builder.html"><img style="border-bottom: 0px; border-left: 0px; display: inline; margin-left: 0px; border-top: 0px; margin-right: 0px; border-right: 0px" title="bmw_z1" border="0" alt="bmw_z1" align="left" src="http://miti.pricope.com/wp-content/uploads/2010/02/bmw_z1.jpg" width="301" height="227" /></a>Since I have a little more spare time now … I decided to hack a little bit <img src='http://miti.pricope.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> . Avatar is the new hype nowadays <img src='http://miti.pricope.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' />  and I wanted to understand how simple (or how complicated) will be to build an avatar widget. So I gave it a try, but instead of a Na’vi avatar, I decided to apply some artwork on top of an BMW Z1 <img src='http://miti.pricope.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> .</p>
<p>I’ve made a video with my little workflow that you can watch it <a href="http://miti.pricope.com/samples/video/Avatar_Widget_Illustrator_Catalyst_Builder.html">here</a> (I couldn’t believe how easy it was).</p>
<p>You can also see the running demo (and download the source files) <a href="http://miti.pricope.com/samples/bmw/Main.html">here</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://miti.pricope.com/2010/02/06/using-illustrator-flash-catalyst-and-flash-builder-to-create-an-avatar-widget/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Moving on</title>
		<link>http://miti.pricope.com/2010/01/30/moving-on/</link>
		<comments>http://miti.pricope.com/2010/01/30/moving-on/#comments</comments>
		<pubDate>Sat, 30 Jan 2010 19:51:12 +0000</pubDate>
		<dc:creator>mpricope</dc:creator>
				<category><![CDATA[thinking]]></category>

		<guid isPermaLink="false">http://miti.pricope.com/?p=245</guid>
		<description><![CDATA[Yep, I decided to leave Adobe and move on. Last year the Adobe evangelist team got restructured, I ended up working in engineering and finally got a little time to breathe. I mean evangelism was a hell of a ride for an ‘introverted geek’ and it stretched me to the limit. But I must admit [...]]]></description>
			<content:encoded><![CDATA[<p>Yep, I decided to leave Adobe and move on. Last year the Adobe evangelist team got restructured, I ended up working in engineering and finally got a little time to breathe. I mean evangelism was a hell of a ride for an ‘introverted geek’ and it stretched me to the limit. But I must admit that I loved doing this … well maybe except the crazy traveling.</p>
<p>One Sunday morning I woke up, sat on the edge of my bed and asked myself: “Now WHAT?”. I realized that I really love coding but I also like giving presentations, teaching and what you can generally call ‘knowledge transfer’ activities … and I like also the business side of the technology too. Thus the engineering side only filled up half of it … maybe a little more cause I really love coding <img src='http://miti.pricope.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> .</p>
<p>So I decided to stop, take a break (as I realized that I’ve spent none of my last year&#8217;s legal holidays) and look for a new challenge. That’s because I just couldn’t come up with a good answer to the “now what?” question and I realized that I might need to do some experiments to find out.</p>
]]></content:encoded>
			<wfw:commentRss>http://miti.pricope.com/2010/01/30/moving-on/feed/</wfw:commentRss>
		<slash:comments>10</slash:comments>
		</item>
		<item>
		<title>Enterprise RIA = Transport Tycoon</title>
		<link>http://miti.pricope.com/2009/10/07/enterprise-ria-transport-tycoon/</link>
		<comments>http://miti.pricope.com/2009/10/07/enterprise-ria-transport-tycoon/#comments</comments>
		<pubDate>Wed, 07 Oct 2009 13:01:27 +0000</pubDate>
		<dc:creator>mpricope</dc:creator>
				<category><![CDATA[Uncategorized]]></category>

		<guid isPermaLink="false">http://miti.pricope.com/2009/10/07/enterprise-ria-transport-tycoon/</guid>
		<description><![CDATA[I’ve just saw one of the coolest application ever at the MAX Day 2 Keynote. You might think that it’s something about entertainment or a new tweeter thing . Well no, the coolest application I’ve seen in a while was actually a business application. FedEx built an app to monitor critical packages (like artwork or [...]]]></description>
			<content:encoded><![CDATA[<p>I’ve just saw one of the coolest application ever at the MAX Day 2 Keynote. You might think that it’s something about entertainment or a new tweeter thing <img src='http://miti.pricope.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> . Well no, the coolest application I’ve seen in a while was actually a business application. FedEx built an app to monitor critical packages (like artwork or cryogenic stuff). And it looks like Transport Tycoon if you remember the old game. You can manage a whole fleet using an app that looks very much like a strategy game. Only that this is for real, with real stuff, real events and real money. Who would have believed 10-15 years ago that the strategy games we played will become the management tools of today. Now I realize that this is not just the RIA and Flex. It’s about building a large interactive system, with sensors, <br />
		  geolocation, all the hardware and the communication infrastructure. Flex and LCDS was only the cherry on top of the whole thing. I think these kinds of applications are way beyond “cool”. You can really feel the difference that these systems bring in productivity and eventually in our life. I wish we had such applications internally at Adobe <img src='http://miti.pricope.com/wp-includes/images/smilies/icon_biggrin.gif' alt=':D' class='wp-smiley' /> . Watch out for the MAX Day 2 video, which should be posted soon on <a href="http://tv.adobe.com">AdobeTV</a>. <br/></p>
]]></content:encoded>
			<wfw:commentRss>http://miti.pricope.com/2009/10/07/enterprise-ria-transport-tycoon/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Hard Play &#8211; No Flash on the iPhone &#8211; yet&#8230;</title>
		<link>http://miti.pricope.com/2009/10/06/hard-play-no-flash-on-the-iphone-yet/</link>
		<comments>http://miti.pricope.com/2009/10/06/hard-play-no-flash-on-the-iphone-yet/#comments</comments>
		<pubDate>Tue, 06 Oct 2009 09:01:12 +0000</pubDate>
		<dc:creator>mpricope</dc:creator>
				<category><![CDATA[ria]]></category>
		<category><![CDATA[thinking]]></category>

		<guid isPermaLink="false">http://miti.pricope.com/2009/10/06/hard-play-no-flash-on-the-iphone-yet/</guid>
		<description><![CDATA[Last night Adobe announced Flash Player 10.1, which will support a lot of devices including Windows Mobile, Symbian, Android and WebOS (you can find more details in the official press release). Sounds cool except of course &#8230; there is no iPhone there? I am wondering why that is and what is Apple&#8217;s strategy? Everywhere I [...]]]></description>
			<content:encoded><![CDATA[<p>Last night Adobe announced Flash Player 10.1, which will support a lot of devices including Windows Mobile, Symbian, Android and WebOS (you can find more details in the <a href="http://www.adobe.com/aboutadobe/pressroom/pressreleases/200910/100509AFPforMobileDevicesandPCs.html">official press release</a>).<br />
		    Sounds cool except of course &#8230; there is no iPhone there?</p>
<p>I am wondering why that is and what is Apple&#8217;s strategy? Everywhere I go people ask me, When will you guys be releasing Flash for iPhone? Why are you not releasing Flash for iPhone? And I don&#8217;t know what to tell you, but from what it seems Adobe is going for every smart phone out there. I mean there has been only fingerpointing so far: Apple saying Flash is not good enough, Adobe saying it is and now is delivering it for every other smart-phone. </p>
<p>Now I am wondering what Apple&#8217;s strategy is about that. I mean currently let&#8217;s face it: iPhone is by far the only significant smart phone out there with a design that was really innovative not only from the hardware point of view. The whole iPhone business ecosystem was way far ahead anything any competitor had put up forward.</p>
<p>But once Apple &#8220;got it right&#8221; now the spell is broken. Now, the entire industry not only knows what customers want, they are pressured to deliver it fast if they want to still be in this business 5-10 years from now. I think the whole game will change now into a long slog, a down in the trenches fight between Apple and the other big phone hardware manufacturers and telecom operators. Why do I think it will be a long slog? Well Apple did a big blow in the phone market with iPhone but I don&#8217;t think they will get 30% of the smart phones market very soon. And even if they get it I doubt that Apple will get 80% of the mobile phone market. And I don&#8217;t think they want it. Apple&#8217;s strategy is to get the most profitable 10-20% segment of the market, after that the profitability drops and it doesn&#8217;t look that nice.</p>
<p>Now back to the trenches. By leaving Flash out of the iPhone, Apple is keeping iPhone out of Flash and it&#8217;s betting on its own API to deliver applications and RIAs (I doubt they will adopt Silverlight <img src='http://miti.pricope.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> ). With Flash and Silverlight pushing hard for all other smart-phones (which by the way are getting cooler and cooler) I expect that pretty soon they will get to be quite popular. So if Apple insists on using its own API, it will make application development for their platform expensive. If you have the coolest phone put out there, this makes perfect sense. But if the other phone manufacturers get their act together they will soon bridge that gap. With Flash, and soon AIR, support they will be able to reuse development skills and even running code to get people to make applications for their platforms. By making development more expensive on iPone than for the other platforms, Apple will position iPhone as a niche product. This clearly is not a mainstream strategy and playing the niche market with iPhone is a tricky strategy. And with Flash Player 10.1 on all the other phones, it kinda makes iPhone look a little strange because you can&#8217;t play video on it.</p>
<p>I wonder what Apple&#8217;s move or statement will be especially now that you will be able to<a href="http://labs.adobe.com/technologies/flashcs5/appsfor_iphone/"> compile Flash applications to get them run as native apps on the iPhone. </a></p>
<p>&#160;</p>
<p>&#160;</p>
]]></content:encoded>
			<wfw:commentRss>http://miti.pricope.com/2009/10/06/hard-play-no-flash-on-the-iphone-yet/feed/</wfw:commentRss>
		<slash:comments>11</slash:comments>
		</item>
		<item>
		<title>Data-Centric Development with Flash Builder 4 @MAX</title>
		<link>http://miti.pricope.com/2009/08/19/data-centric-development-with-flash-builder-4-max/</link>
		<comments>http://miti.pricope.com/2009/08/19/data-centric-development-with-flash-builder-4-max/#comments</comments>
		<pubDate>Wed, 19 Aug 2009 01:48:28 +0000</pubDate>
		<dc:creator>mpricope</dc:creator>
				<category><![CDATA[Uncategorized]]></category>

		<guid isPermaLink="false">http://miti.pricope.com/2009/08/19/data-centric-development-with-flash-builder-4-max/</guid>
		<description><![CDATA[These days I&#8217;ve worked to finish my Max BYOL (Bring Your Own Laptop) lab. It&#8217;s about how you can easily develop data-centric front ends using the new data features in Flash Builder 4. I will be presenting this lab together with Enrique Duvos. In this 90-min hands-on lab you will be building data-driven front ends [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://max.adobe.com"><img src="http://miti.pricope.com/wp-content/uploads/2009/08/MAX09_140x130_speaker_000.jpg" alt="" width="140" height="130" align="left" /></a> These days I&#8217;ve worked to finish my <a href="http://max.adobe.com/sessions/byol/">Max BYOL</a> (Bring Your Own Laptop) lab. It&#8217;s about how you can easily develop data-centric front ends using the new data features in Flash Builder 4. I will be presenting this lab together with <a href="http://duvos.com">Enrique Duvos</a>.</p>
<p>In this 90-min hands-on lab you will be building data-driven front ends that connect to either PHP, Java or ColdFusion &#8230; yeah we prepared materials for all these back-ends. I can&#8217;t wait to see how this will work live.</p>
<p>Plus you will add some advanced pieces of functionality like paging through large record-sets and client-side data management. If I got you interested then you can already  book your place in the room using <a href="http://max.adobe.com/scheduler/">Adobe MAX scheduler</a>.</p>
<p>And if you have not registered yet for MAX, please take a look at the following two entries from <a href="http://www.ashorten.com/2009/08/04/travel-to-max-from-europe-and-save/">Andrew Shorten</a> and <a href="http://www.webkitchen.be/2009/07/28/getting-to-adobe-max-2009-on-a-budget-get-a-400-discount/">Serge Jespers</a>. There are great discounts available!!!</p>
]]></content:encoded>
			<wfw:commentRss>http://miti.pricope.com/2009/08/19/data-centric-development-with-flash-builder-4-max/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Skinning a list in Flex 4 &#8211; Magnifier Effect</title>
		<link>http://miti.pricope.com/2009/08/16/skinning-a-list-in-flex-4-magnifier-effect/</link>
		<comments>http://miti.pricope.com/2009/08/16/skinning-a-list-in-flex-4-magnifier-effect/#comments</comments>
		<pubDate>Sun, 16 Aug 2009 07:49:40 +0000</pubDate>
		<dc:creator>mpricope</dc:creator>
				<category><![CDATA[flex]]></category>
		<category><![CDATA[video]]></category>

		<guid isPermaLink="false">http://miti.pricope.com/2009/08/16/skinning-a-list-in-flex-4-magnifier-effect/</guid>
		<description><![CDATA[Here&#8217;s a little video about how to use different Spark components to make a magnifier effect for a list. To create this effect I did the following: used the Spark Component model with Skins and States employed the new Spark item renderer that support Designer/Developer workflow Parametrize Spark Skins with CSS You can download the [...]]]></description>
			<content:encoded><![CDATA[<p>Here&#8217;s a little video about how to use different Spark components to make a magnifier effect for a list. To create this effect I did the following:</p>
<ul>
<li>used the Spark Component model with Skins and States </li>
<li>employed the new Spark item renderer that support Designer/Developer workflow</li>
<li>Parametrize Spark Skins with CSS</li>
</ul>
<p>You can download the final project from <a href="http://miti.pricope.com/samples/magnifierList/magnifierList.fxp">here</a> and watch the video <a href="http://miti.pricope.com/samples/video/skinning-list-flex4-magnifier-effect.html">here</a>.</p>
<p><a href="http://miti.pricope.com/samples/video/skinning-list-flex4-magnifier-effect.html"><img src="http://miti.pricope.com/wp-content/uploads/2009/08/magnifierEffect.jpg" width="450" height="337" /></a><br/>
		    </p>
]]></content:encoded>
			<wfw:commentRss>http://miti.pricope.com/2009/08/16/skinning-a-list-in-flex-4-magnifier-effect/feed/</wfw:commentRss>
		<slash:comments>11</slash:comments>
		</item>
		<item>
		<title>Integrating PayPal Express Checkout with AIR and Flex</title>
		<link>http://miti.pricope.com/2009/07/30/integrating-paypal-express-checkout-with-air-and-flex/</link>
		<comments>http://miti.pricope.com/2009/07/30/integrating-paypal-express-checkout-with-air-and-flex/#comments</comments>
		<pubDate>Thu, 30 Jul 2009 10:13:45 +0000</pubDate>
		<dc:creator>mpricope</dc:creator>
				<category><![CDATA[air]]></category>
		<category><![CDATA[flex]]></category>
		<category><![CDATA[payment gateways]]></category>
		<category><![CDATA[tutorials]]></category>

		<guid isPermaLink="false">http://miti.pricope.com/2009/07/31/integrating-paypal-express-checkout-with-air-and-flex/</guid>
		<description><![CDATA[This article continues the series about integrating Flex and AIR with payment gateway services. Parts of this article are very similar with the other posts about this subject: Integrating PayPal Express Checkout with Flex(which I recommend reading before this article),Using Amazon Flexible Payment System with Flex and Using Amazon Flexible Payment System with Flex &#38; [...]]]></description>
			<content:encoded><![CDATA[<p><font color="#999999">This article continues the series about integrating Flex and AIR with payment gateway services. Parts of this article are very similar with the other posts about this subject: <br />
		      <a href="http://miti.pricope.com/2009/07/19/integrating-paypal-express-checkout-with-flex/">Integrating PayPal Express Checkout with Flex</a>(which I recommend reading before this article),<a href="http://miti.pricope.com/2009/07/11/using-amazon-flexible-payment-system-with-flex/">Using Amazon Flexible Payment System with Flex</a> and <a href="http://miti.pricope.com/2009/07/26/using-amazon-flexible-payment-system-with-flex-air/">Using Amazon Flexible Payment System with Flex &amp; AIR</a>.</font></p>
<p>I will focus mainly on how to take the PayPal + Flex workflow (described <a href="http://miti.pricope.com/2009/07/19/integrating-paypal-express-checkout-with-flex/">here</a>) out of the browser and into an AIR application. </p>
<p>Although AIR applications run on the desktop and the local security constraints are different from those in the browser, from a payment gateway point of view things don’t change at all. As a result, we can conclude that because AIR is a client technology hardcoding sensitive information into an AIR app is highly insecure (even though the code is compiled into bytecode). This means that any credential related info (like API_USERNAME, API_PASSWORD and API_SIGNATURE) should NOT be stored in the AIR application.</p>
<h3>Architectural Approach and UI solutions</h3>
<p>Summing this up, our architectural solution has to comply with some concurrent demands:</p>
<ul>
<li> an AIR front-end that is stateful and is built following the single page app paradigm</li>
<li>the need for security that requires that the AIR app should NOT deal with PayPal API credentials</li>
<li>The payment workflow has a part that is hosted on the PayPal servers and that is a standard request-response web application</li>
</ul>
<p>In order to address these I propose the following approach:</p>
<ul>
<li> all PayPal API calls should be done on the server side so that API credentials will be protected</li>
<li>the access to the PayPal web application should be done in a browser page. <font color="#FF0000"><strong>IMPORTANT SECURITY NOTE:</strong></font>  Although technically it might be possible to use the HTML container of the AIR runtime this is an unsecure practice because the end user cannot visually verify that he is entering his credentials on the PayPal site. In the browser he can check the URL and the security certificate.</li>
</ul>
<p>So the buyer workflow becomes:</p>
<ol>
<li>(Step 1) Chooses to checkout using PayPal in the AIR application (<font color="#FF0000">Security Note</font>: Starting from this point it is mandatory that all requests are done through https)</li>
<li>(Step 2) Sees a browser window open and logs into PayPal to authenticate his/her identity</li>
<li>(Step 3) Reviews the transaction on PayPal</li>
<li>(Step 4) Confirms the order and pays from your site</li>
<li>(Step 5) Reviews the order confirmation on your site</li>
<li>(Step 6) Returns to the AIR application</li>
</ol>
<p>&#160;</p>
<p>
<h3>Calling the PayPal part of the checkout process</h3>
</p>
<p>So the PayPal workflow should be open in a browser window. Here is how to do that in the AIR app:</p>
<p><pre class="brush: as3;">
var url:URLRequest = new URLRequest(URL_ROOT + &quot;/payPalAIR/startPaymentFlex.php&quot;);
url.data = new URLVariables();
var obj:URLVariables = new URLVariables();
url.data.movieId = '1';
url.data.paymentReason = 'Enter The Matrix';
url.method = &quot;GET&quot;;

navigateToURL(url, &quot;new&quot;);
currentState='Wait';
</pre>
</p>
<p>Everything else is pretty similar with how you <a href="2009/07/19/integrating-paypal-express-checkout-with-flex/#callPayPal">call the PayPal workflow from a Flex app</a>.</p>
<h3>Returning from PayPal and notifying the AIR application</h3>
<p>Here again we follow an approach similar with how you <a href="2009/07/19/integrating-paypal-express-checkout-with-flex/#returnFromPayPal">return from PayPal to a Flex application</a> (Step 4 and Step 5). </p>
<p>The only thing that differs is how we get back to the AIR application (Step 6). ExternalInterface is not suited for this job but we can use instead the LocalConnection to make the browser application communicate with the AIR one. LocalConnection, while being more secure than ExternalIterface, can still be exploited using techniques like DNS rewriting so we can&#8217;t pass sensitive information through it. Furthermore, since the AIR app is independent from the browser this means that our browser app has a different server session than the AIR App. So a simple notification is not enough: we need to also pass the session id. This is not sensitive information, but it will allow the AIR application to retrieve from the server any sensitive information that the browser application has set.</p>
<p>Let&#8217;s take a look on what we need to do right after we call the PAY operation in our return page. In the transaction detail page we will link to a little Flex application that will only communicate with the AIR application. We can use this little application to also forward the error and cancel messages. We will call it using an anchor parameter:</p>
<p><pre class="brush: xml;">
&lt;a class=&quot;home&quot; id=&quot;CallsLink&quot; href=&quot;payPalAIRReturn.html#method=doStatus&quot;&gt;Return to AIR&lt;/a&gt;
</pre>
</p>
<p>This little application will only contain some code that will get the cookie string from the browser (remember we need this to make the AIR application connect to the same server session) and send a message through LocalConnection to the AIR application:</p>
<p><pre class="brush: as3;">
private var outbound:LocalConnection = new LocalConnection();
protected function application1_applicationCompleteHandler(event:FlexEvent):void
{
	var browserManager:IBrowserManager = BrowserManager.getInstance();
	browserManager.init();
	var urlObj:Object = URLUtil.stringToObject(browserManager.fragment);
	if (urlObj.method) {
		//get the cookie string
		ExternalInterface.call('eval','window.cookieStr = function () {return document.cookie};')
			var cookieStr:String = ExternalInterface.call('cookieStr');
		outbound.connect(&quot;paymentSample&quot;);
		outbound.send(&quot;app#payPalAIR:paymentSample&quot;,urlObj.method,cookieStr);
		outbound.close();
	}
}
</pre>
</p>
<p>Please notice that when launching from Flex Builder the AIR Application has no Publisher ID so the connection name is “app#payPalAIR:paymentSample”. After packaging and installation the AIR app will get a Publisher ID so the connection name becomes something like this: app#payPalAIR.F0B3F68E1857B8A07069FED1D0638CAF200F76EB.1:paymentSample</p>
<p>You can get the publisher ID of the installed AIR app by looking at the META-INF/AIR/publisherid file within the application install directory.</p>
<p>Back in the AIR application we need to expose the functions through local connection:</p>
<p><pre class="brush: as3;">
private function initApp():void {
	//only allow connections from localhost
	//you need to replace &quot;localhost&quot; with the final domain
	//where your application will be hosted
	inbound.allowDomain(&quot;localhost&quot;);
	inbound.client = new Object();
	//this is the function that will be called by the Browser App
	inbound.client.doStatus = doStatus;
	inbound.client.doError = doError;
	inbound.client.doCancel = doCancel;

	//inbound.client.
	inbound.connect(&quot;paymentSample&quot;);

}
</pre>
</p>
<p>All methods (doStatus, do Error and doCancel) will receive the cookie string as a parameter. In do Status we need to check the transaction status on the server:</p>
<p><pre class="brush: as3;">
private function doStatus(cookieStr:String):void {
	var srv:HTTPService = new HTTPService();
	srv.headers.Cookie = cookieStr;
	srv.url = URL_ROOT + &quot;/payPalAIR/getPaymentStatus.php&quot;;
	srv.addEventListener(ResultEvent.RESULT,function (event:ResultEvent):void {

		Alert.show(event.result.status.type);
		nativeApplication.activate();
		if (event.result.status.type == 'SUCCESS') {
			currentState = 'Succes';
		} else {
			currentState = 'Fail';
		}
	});
	srv.addEventListener(FaultEvent.FAULT,function (event:FaultEvent):void {
		nativeApplication.activate();
		currentState = 'Fail';
		Alert.show(event.message.toString());
	});
	srv.send();
}
</pre>
</p>
<p>where getPaymentStatus.php is just a simple page that gets the status from the session and serialize it in a simple XML format:</p>
<p><pre class="brush: php;">
&lt;?php
session_start();
?&gt;
&lt;status&gt;
	&lt;type&gt;&lt;?php echo strtoupper ($_SESSION ['reshash'] [&quot;ACK&quot;] ) ?&gt;&lt;/type&gt;
&lt;/status&gt;
</pre>
</p>
<p>
<h3>Installing the sample files</h3>
</p>
<ol>
<li> In Flash Builder click File-&gt;Import .. and choose Flash Builder Project</li>
<li> Choose <a href="http://miti.pricope.com/samples/payPalAIRFiles/payPalAIR.fxp">payPalAIR.fxp</a></li>
<li> Unzip <a href="http://miti.pricope.com/samples/payPalAIRFiles/payPalAIR.zip"> payPalAIR.zip</a> into your Web Root folder (For example: /work/www).</li>
<li> Edit payPalAIR/ppNVP/constants.php and replace</li>
<p><pre class="brush: php;">
define('API_USERNAME', 'sdk-three_api1.sdk.com');
define('API_PASSWORD', 'QFZCWN5HZM8VBG7Q');
define('API_SIGNATURE', 'A.d9eRKfd1yVkRrtmMfCFLTqa6M9AyodL0SJkhYztxUi8W9pCXF6.4NI');
</pre>
</p>
<p>with your ownPayPal API_USERNAME, API_PASSWORD and API_SIGNATURE </p>
<li>In Flash Builder click File-&gt;Import … and choose Flash Builder Project.</li>
<li> Choose <a href="http://miti.pricope.com/samples/payPalAIRFiles/payPalAIRReturn.fxp">payPalAIRReturn.fxp</a></li>
<li> Fill the Output Folder Location (this one should point to where you have unzipped payPalAIR.zip, in your web root), Web Root and Root URL with your values. It should look something like this:</li>
<p>		    <img src="http://miti.pricope.com/wp-content/uploads/2009/07/Picture8.png" width="600" height="404" />
		  </ol>
<p><br/>
		    </p>
]]></content:encoded>
			<wfw:commentRss>http://miti.pricope.com/2009/07/30/integrating-paypal-express-checkout-with-air-and-flex/feed/</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
		<item>
		<title>Using Amazon Flexible Payment System with Flex &amp; AIR</title>
		<link>http://miti.pricope.com/2009/07/26/using-amazon-flexible-payment-system-with-flex-air/</link>
		<comments>http://miti.pricope.com/2009/07/26/using-amazon-flexible-payment-system-with-flex-air/#comments</comments>
		<pubDate>Sun, 26 Jul 2009 12:16:31 +0000</pubDate>
		<dc:creator>mpricope</dc:creator>
				<category><![CDATA[air]]></category>
		<category><![CDATA[flex]]></category>
		<category><![CDATA[payment gateways]]></category>
		<category><![CDATA[tutorials]]></category>

		<guid isPermaLink="false">http://miti.pricope.com/?p=181</guid>
		<description><![CDATA[I&#8217;ve already talked about using Flex with Amazon FPS, so now let&#8217;s see what is involved in taking this out of the browser into an AIR app. I recommend reading that article before reading this one, since many of the security considerations described there in detail are valid for AIR applications also. In this article [...]]]></description>
			<content:encoded><![CDATA[<p>I&#8217;ve already talked about <a href="http://miti.pricope.com/2009/07/11/using-amazon-flexible-payment-system-with-flex/">using Flex with Amazon FPS</a>, so now let&#8217;s see what is involved in taking this out of the browser into an AIR app. I recommend reading that article before reading this one, since many of the security considerations described there in detail are valid for AIR applications also. In this article I will only highlight the differences between building a Flex application that runs in the browser and one that runs on the desktop.</p>
<p>Although AIR applications run on the desktop and the local security constraints are different from those in the browser, from a payment gateway point of view things don&#8217;t change at all. As a result, we can conclude that because AIR is a client technology  hardcoding sensitive information into an AIR app is highly insecure (even though the code is compiled into bytecode). This means that any signature related computation should NOT be made in AIR and the Amazon Secret Key should NOT under any circumstance be put into an AIR App.</p>
<h3>Architectural Approach and UI solutions</h3>
<p>Summing this up, our architectural solution has to comply with two concurrent demands:</p>
<ul>
<li>an AIR front-end that is stateful and is built following the single page app paradigm </li>
<li>the security need that the AIR app should NOT deal with Amazon Security Key plus the need to go to the Amazon co-branded page to authenticate the users </li>
</ul>
<ul>In order to address these I propose the following approach:    </p>
<li>All payment related processing should be done on the server side to protect the Amazon Secret Key. Of course this means that the AIR app must be on-line when the payment takes place. </li>
<li>The access to the co-branded page should be done in a browser page. <font color="#ff0000"><strong>IMPORTANT SECURITY NOTE:</strong></font>&#160; Although technically it might be possible to use the HTML container of the AIR runtime this is an unsecure practice because the end user cannot visually verify that he is entering his credentials on the Amazon site. In the browser he can check the URL and the security certificate.</li>
</ul>
<h3><b>Calling the Amazon Co-Branded User Interface</b></h3>
<p>So the Amazon co-branded UI should be open in a browser window. Here is how to do that in the AIR app.</p>
<p><pre class="brush: as3;">
var url:URLRequest = new URLRequest(&quot;http://localhost/amazonAIR/startPayment.php&quot;);
url.data = new URLVariables();
var obj:URLVariables = new URLVariables();
url.data.movieId = 1;
url.data.paymentReason = 'Enter The Matrix';
url.method = &quot;GET&quot;;
navigateToURL(url, &quot;new&quot;);
</pre>
</p>
<p>Everything else is pretty similar with how <a href="http://miti.pricope.com/2009/07/11/using-amazon-flexible-payment-system-with-flex/#callingAmazonUI">you call the Amazon co-branded UI from a Flex app that runs in the browser</a>.</p>
<p>Exactly the same goes with <a href="http://miti.pricope.com/2009/07/11/using-amazon-flexible-payment-system-with-flex/#returnFromAmazon">returning from Amazon and making the Pay request</a>.</p>
<h3><b>Using LocalConnection to notify the AIR App</b></h3>
<p>The only thing left now is to notify the AIR application and bring it to front.</p>
<p>To do that we need to communicate between the browser app  and the AIR app. In order to achieve this we can use the LocalConnection  mechanism. LocalConnection objects can communicate among files that are running  on the same client computer, but they can be running in different applications  — for example, a file running in a browser and a SWF file running in Adobe AIR.</p>
<p>Now there is one important thing to remember about LocalConnection. It can be tricked using techniques like DNS rewriting. So we will not pass any sensitive information through LocalConnection. However, since the AIR app is independent from the browser this means that our browser app has a different server session than the AIR App. So a simple notification is not enough, we need to also pass the session id. This is not sensitive information, but it will allow the AIR application to retrieve from the server any sensitive information that the browser application has set.</p>
<p>Let&#8217;s take a look what we need to do right after the return.php page made the PAY operation.</p>
<p>For simplicity the returnAir.php page will have a link to a little Flex app that will communicate with the AIR app. All it needs to do is to get the cookie information and send it through LocalConnection to the AIR app:</p>
<p><pre class="brush: as3;">
private var outbound:LocalConnection = new LocalConnection();

private function gotoAIR():void {
	//get the cookie string
	ExternalInterface.call('eval','window.cookieStr = function () {return document.cookie};')
	var cookieStr:String = ExternalInterface.call('cookieStr');

	outbound.connect(&quot;paymentSample&quot;);
	outbound.send(&quot;app#amazonAIR:paymentSample&quot;,&quot;notifyPayment&quot;,cookieStr);
	//outbound.send(&quot;app#testAmazonAir.F0B3F68E1857B8A07069FED1D0638CAF200F76EB.1:paymentSample&quot;,&quot;notifyPayment&quot;,cookieStr);
	outbound.close();
}
</pre>
</p>
<p>Please notice that when launching from Flex Builder the AIR  Application has no Publisher ID so the connection name is &ldquo;app#amazonAIR:paymentSample&rdquo;.  After packaging and installation the AIR app will get a Publisher ID so the  connection name becomes something like this: app#amazonAIR.F0B3F68E1857B8A07069FED1D0638CAF200F76EB.1:paymentSample</p>
<p>You can get the publisher ID of the installed AIR App by  looking at the META-INF/AIR/publisherid file within the  application install directory.</p>
</p>
<p>Back in our AIR app we need to expose a function to be available  on LocalConnection.</p>
<p><pre class="brush: as3;">
//This will be used by return.php to notify the AIR App
//that the payment has been made
private var inbound:LocalConnection = new LocalConnection();

private function initApp():void {
	//only allow connections from localhost
	//you need to replace &quot;localhost&quot; with the final domain
	//where your application will be hosted
	inbound.allowDomain(&quot;localhost&quot;);
	inbound.client = new Object();
	//this is the function that will be called by the Browser App
	inbound.client.notifyPayment = paymentNotification;
	inbound.connect(&quot;paymentSample&quot;);
}
</pre>
</p>
<p>Where paymentNotification is a function that receives the cookie string as parameters and queries the server to check the transaction status:</p>
<p><pre class="brush: as3;">
public function paymentNotification(cookieStr:String):void {
	var srv:HTTPService = new HTTPService();
	srv.headers.Cookie = cookieStr;
	srv.url = &quot;http://localhost/amazonAIR/paymentStatus.php&quot;;
	srv.addEventListener(ResultEvent.RESULT,function (event:ResultEvent):void {
		nativeApplication.activate();
		if (event.result.status == 'OK') {
			currentState = 'Succes';
		} else {
			currentState = 'Fail';
		}
	});
	srv.send();
}
</pre>
</p>
<h3>Installing the sample files</h3>
<ol>
<li>In Flash Builder click File-&gt;Import .. and choose Flash Builder Project</li>
<li>Choose <a href="http://miti.pricope.com/samples/amazonAIRFiles/amazonAIR.fxp">AmazonAIR.fxp</a></li>
<li>Unzip <a href="http://miti.pricope.com/samples/amazonAIRFiles/amazonAIR.zip">amazonAIR.zip</a> into your Web Root folder (For example: /work/www).</li>
<li>Edit amazonAIR/amazon-fps/src/Amazon/FPS/Samples/.config.inc.php and replace
	          </li>
<p><pre class="brush: php;">
define('AWS_ACCESS_KEY_ID', 'YOUR ACCESS KEY');
define('AWS_SECRET_ACCESS_KEY', 'YOUR SECRET ACCESS KEY');
</pre>
</p>
<p>with your own Amazon ACCESS key and SECRET_ACCESS_KEY.</p>
<li>In Flash Builder click File-&gt;Import … and choose Flash Builder Project.</li>
<li>Choose <a href="http://miti.pricope.com/samples/amazonAIRFiles/amazonAIRReturn.fxp">amazonAIRReturn.fxp</a></li>
<li>Fill the Output Folder Location (this one should point to where you have unzipped amazonAIR.zip, in your web root), Web Root and Root URL with your values. It should look something like this:</li>
</ol>
<p><img src="http://miti.pricope.com/wp-content/uploads/2009/07/Picture7.png" width="600" height="431" /></p>
]]></content:encoded>
			<wfw:commentRss>http://miti.pricope.com/2009/07/26/using-amazon-flexible-payment-system-with-flex-air/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>The infamous Error #2044: Unhandled StatusEvent:. level=error, code= on LocalConnection</title>
		<link>http://miti.pricope.com/2009/07/24/the-infamous-error-2044-unhandled-statusevent-levelerror-code-on-localconnection/</link>
		<comments>http://miti.pricope.com/2009/07/24/the-infamous-error-2044-unhandled-statusevent-levelerror-code-on-localconnection/#comments</comments>
		<pubDate>Fri, 24 Jul 2009 08:27:36 +0000</pubDate>
		<dc:creator>mpricope</dc:creator>
				<category><![CDATA[Flash Player 10]]></category>
		<category><![CDATA[flex]]></category>
		<category><![CDATA[tips & tricks]]></category>

		<guid isPermaLink="false">http://miti.pricope.com/?p=176</guid>
		<description><![CDATA[This is a blog post to all that was almost to throw their computers out of the window because they got &#34;Error #2044: Unhandled StatusEvent:. level=error, code=&#34; trying to communicate through LocalConnection. So I am trying to send a message from a Flex application running in Flash Player to an AIR application. In the AIR [...]]]></description>
			<content:encoded><![CDATA[<p>This is a blog post to all that was almost to throw their computers out of the window because they got &quot;Error #2044: Unhandled StatusEvent:. level=error, code=&quot; trying to communicate through LocalConnection.</p>
<p>So I am trying to send a message from a Flex application running in Flash Player to an AIR application. In the AIR application (called testAIR) I have something like:</p>
<p><pre class="brush: as3;">
private function initApp():void {
	var inbound:LocalConnection = new LocalConnection();
	//only allow connections from localhost
	inbound.allowDomain(&quot;localhost&quot;);
	inbound.client = new Object();
	//this is the function that will be called by the Browser App
	inbound.client.notifyPayment = function test():void {
		Alert.show(&quot;HERE&quot;);
	};
	inbound.connect(&quot;paymentSample&quot;);
}
</pre>
</p>
<p>pretty straightforward, right from the book.</p>
<p>In the Flex app I just do:</p>
<p><pre class="brush: as3;">
outbound.connect(&quot;paymentSample&quot;);
outbound.send(&quot;app#testAIR:paymentSample&quot;,&quot;notifyPayment&quot;);
outbound.close();
</pre>
</p>
<p>You might think that this should work. Well &#8230; NOT.&#160; This is because in the AIR app the inbound LocalConnection is a variable that is declared in the local scope of a method. Now I was expecting that when I call&#160; the connect method the inbound object will be referenced by another object (some LocalConnection manager, or event handler) and it will not get garbage collected after the method ends. Well, apparently is not the case. Either there is a bug in AIR, either this reference is a weak reference so it gets garbage collected. This means that by the time you try to send the message from Flash Player your inbound object is long gone!</p>
<p>The resolution is quite simple. You just need to reference the inbound object somewhere else, making him a member of class or something. In my case I just declare it as a private variable inside my MXML component:</p>
<p><pre class="brush: as3;">
private var inbound:LocalConnection = new LocalConnection();

private function initApp():void {
	//only allow connections from localhost
	inbound.allowDomain(&quot;localhost&quot;);
       ....
</pre>
</p>
<p>Hope this will help someone <img src='http://miti.pricope.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
]]></content:encoded>
			<wfw:commentRss>http://miti.pricope.com/2009/07/24/the-infamous-error-2044-unhandled-statusevent-levelerror-code-on-localconnection/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>Integrating PayPal Express Checkout with Flex</title>
		<link>http://miti.pricope.com/2009/07/19/integrating-paypal-express-checkout-with-flex/</link>
		<comments>http://miti.pricope.com/2009/07/19/integrating-paypal-express-checkout-with-flex/#comments</comments>
		<pubDate>Sun, 19 Jul 2009 07:00:14 +0000</pubDate>
		<dc:creator>mpricope</dc:creator>
				<category><![CDATA[flex]]></category>
		<category><![CDATA[payment gateways]]></category>
		<category><![CDATA[tutorials]]></category>

		<guid isPermaLink="false">http://miti.pricope.com/2009/07/19/integrating-paypal-express-checkout-with-flex/</guid>
		<description><![CDATA[In this post I will discuss how you can integrate Flex with a PayPal payment service, so parts of this article are similar with my previous post about Amazon FP. PayPal is one of the most popular (if not the most popular) payment service, so here I go with a discussion on how you can [...]]]></description>
			<content:encoded><![CDATA[<p><span style="color: #999999;">In this post I will discuss how you can integrate Flex with a PayPal payment service, so parts of this article are similar with my previous post about <a href="http://miti.pricope.com/2009/07/11/using-amazon-flexible-payment-system-with-flex/">Amazon FP</a>.</span></p>
<p>PayPal is one of the most popular (if not the most popular) payment service, so here I go with a discussion on how you can integrate PayPal Express Checkout with a Flex application running in Flash Player. The challenge of integrating payment services into RIAs is due to the fact that currently, payment services like PayPal are designed to work in request-response paradigm which is the standard paradigm for web-based applications and while RIAs are of course stateful./</p>
<p>But let&#8217;s take a simple RIA scenario:</p>
<p>John visits onDemand.tv, a new on demand video site. He  selects to watch The Matrix. Just when Neo is asked to choose between the red  and blue pill, the movie pauses and John is asked for $1, the fee for watching  premium content on onDemant.tv. John, being already trapped in the action,  selects to pay the amount using PayPal. After the transaction succeeds John  happily enters The Matrix.</p>
<h3>Security  Considerations</h3>
<p>One reason for the success of e-commerce is that the Internet has proven to be a secure medium for transferring money and making payments. PayPal uses several security elements to make sure that all the  payments processed through the service are as secure as possible:</p>
<ul>
<li>Usage  of https for communicating with PayPal Adaptive Payments Web Services ensures that the communication is protected from third party access.</li>
<li>A  set of API_USERNAME, API_PASSWORD and API_SIGNATURE values ensures that the calling party is uniquely identified</li>
<li>A  part of the payment approval process is hosted on the PayPal servers. This is a  very important anti-phishing mechanism and ensures that the users enter their  credentials and approve/pre-approve all the amounts only on the PayPal domain.</li>
</ul>
<p>Looking at these security elements of the PayPal APIs we can make a very important observation regarding protecting the PayPal API  credentials: because Flex is a client technology (and even though the code is  compiled into bytecode), hardcoding sensitive information into a Flex App is  highly insecure. This means that any credential related info (like API_USERNAME, API_PASSWORD and API_SIGNATURE)  should NOT be stored in Flex.</p>
<h3><strong>Architectural  Approach and UI solutions</strong></h3>
<p>Summing this up, our architectural solution has to comply  with three concurrent demands:</p>
<ul>
<li>a  Flex RIA front-end that is stateful and is built following the single page app  paradigm</li>
<li>the need for security that requires that the Flex App should NOT deal with PayPal  API credentials</li>
<li>The  payment workflow has a part that is hosted on the PayPal servers and that is a  standard request-response web application</li>
</ul>
<p>In order to address these I propose the following approach:</p>
<ul>
<li> all PayPal API calls should be done on the server side so that API credentials will be protected</li>
<li>the access to the PayPal web application should be done in a pop-up/new page so that the Flex Application will stay in the Single Page Paradigm and thus preserve its state</li>
</ul>
<p>The user workflow for the checkout process is shown in the  following diagram:</p>
<p><img src="http://miti.pricope.com/wp-content/uploads/2009/07/clip_image002.png" alt="" width="500" height="133" /></p>
<p>In this workflow, the buyer:</p>
<ol>
<li>(Step 1) Chooses to checkout using PayPal in the RIA application (<span style="color: #ff0000;">Security Note:</span> Starting from this point it is mandatory that all requests are done through https)</li>
<li>(Step 2) Sees a new window/pop-up open and he logs into PayPal to authenticate his/her identity</li>
<li>(Step 3) Reviews the transaction on PayPal</li>
<li>(Step 4) Confirms the order and pays from your site</li>
<li>(Step 5) Reviews the order confirmation on your site</li>
<li>(Step 6) Closes the pop-up and returns to Flex Application</li>
</ol>
<h3><strong><a name="callPayPal">Calling  the PayPal part of the checkout process</a></strong></h3>
<p>As I said above the PayPal API credentials need to stay on  the server, so PayPal API invocation should be done from the server as well.  For these examples we will use PHP as a  server language and also the PayPal Name-Value Pair (NVP) API sample code (which you can download from <a href="https://cms.paypal.com/us/cgi-bin/?cmd=_render-content&amp;content_ID=developer/library_code">here</a>). Of course you  can use any server language, the principles and techniques highlighted here  remain the same.</p>
<p>First I will open a pop-up window from Flex:</p>
<pre class="brush: as3;">
//Open the Pop-Up Window first. Using the
//ExternalInterface call we can control the window appereance
ExternalInterface.call('window.open','about:blank',
	'payPalWindow','height=500,width=900,toolbar=no,scrollbars=yes');
</pre>
<p>Send a request to a server page in the newly opened window containing user choice</p>
<pre class="brush: as3;">
var url:URLRequest = new URLRequest(URL_ROOT + &quot;/payPalFlex/startPaymentFlex.php&quot;);
url.data = new URLVariables();
var obj:URLVariables = new URLVariables();
url.data.movieId = '1';
url.data.paymentReason = 'Enter The Matrix';
url.method = &quot;GET&quot;;
navigateToURL(url, &quot;payPalWindow&quot;);
</pre>
<p>Now on the server page we follow the PayPal NVP samples and we will generate the URL that will redirect the user to PayPal site:</p>
<pre class="brush: php;">
$serverName = $_SERVER ['SERVER_NAME'];
$serverPort = $_SERVER ['SERVER_PORT'];
$url = dirname ( 'http://' . $serverName . ':' . $serverPort . $_SERVER ['REQUEST_URI'] );

function getMovieAmount($movieId) {
	//you can replace this function with a more sophisticated one
	return 1;
}

$paymentAmount = getMovieAmount($_GET['movieId']); //$_REQUEST ['paymentAmount'];
$currencyCodeType = 'USD'; //$_REQUEST ['currencyCodeType'];
$paymentType = 'Sale'; //$_REQUEST ['paymentType'];

/* The returnURL is the location where buyers return when a
payment has been succesfully authorized.
The cancelURL is the location buyers are sent to when they hit the
cancel button during authorization of payment during the PayPal flow
*/

$returnURL = urlencode ( $url . '/GetExpressCheckoutDetails.php?currencyCodeType=' . $currencyCodeType . '&amp;paymentType=' . $paymentType . '&amp;paymentAmount=' . $paymentAmount );
$cancelURL = urlencode ( &quot;$url/cancel.php?paymentType=$paymentType&quot; );

/* Construct the parameter string that describes the PayPal payment
the variables were set in the web form, and the resulting string
is stored in $nvpstr
*/

$nvpstr = &quot;&amp;Amt=&quot; . $paymentAmount . &quot;&amp;PAYMENTACTION=&quot; . $paymentType . &quot;&amp;ReturnUrl=&quot; . $returnURL . &quot;&amp;CANCELURL=&quot; . $cancelURL . &quot;&amp;CURRENCYCODE=&quot; . $currencyCodeType;

/* Make the call to PayPal to set the Express Checkout token
If the API call succeded, then redirect the buyer to PayPal
to begin to authorize payment.  If an error occured, show the
resulting errors
*/
$resArray = hash_call ( &quot;SetExpressCheckout&quot;, $nvpstr );
$_SESSION ['reshash'] = $resArray;

$ack = strtoupper ( $resArray [&quot;ACK&quot;] );

if ($ack == &quot;SUCCESS&quot;) {
	// Redirect to paypal.com here
	$token = urldecode ( $resArray [&quot;TOKEN&quot;] );
	$payPalURL = PAYPAL_URL . $token;
	header ( &quot;Location: &quot; . $payPalURL );
} else {
	//Redirecting to APIError.php to display errors.
	$location = &quot;APIError.php&quot;;
	header ( &quot;Location: $location&quot; );
}
</pre>
<p>As you noticed we store the result of the API call in session to use it  later.</p>
<p>In a real e-commerce site we strongly suggest to also log  application state in a database. This way you will have access later on to all  transaction steps.</p>
<h3><strong><a name="returnFromPayPal">Returning  from PayPal and notifying the Flex App</a></strong></h3>
<p>After the user completes the workflow on the  PayPal site he needs to complete the payment on our site: the review transaction page (Step 4) and the review order confirmation (Step 5).</p>
<p>Although we could make the user close the pop-up window just now and continue the workflow in the Flex App, this might not be a good idea because we would add an extra step between payment review on the PayPal site (Step 3) and payment approval on our site (Step 4).</p>
<p>So I choose to implement the payment approval using standard PHP and HTML and reuse the PHP NVP API Samples from PayPal for calling GetExpressCheckoutDetails API (Step 4) and DoExpressCheckoutPayment API (Step 5). You can take a look at these files in the attached samples.</p>
<p>What remains to be done now is to close the pop-up window, return to the Flex App, and verify if the transaction succeeded. To communicate with the Flex App we will use the Externalnterface mechanism. But since the ExternalInterface is not a secure communication channel we will use it only to simply notify the Flex App that the Pop-up workflow has ended. The status will be retrieved by the Flex App from the server. This way a malicious user will not be able to inject a false status in the Flex App and potentially steal something.</p>
<p>First , after we call the DoExpressCheckoutPayment API, we save the results in session:</p>
<pre class="brush: php;">
$resArray=hash_call(&quot;DoExpressCheckoutPayment&quot;,$nvpstr);
$_SESSION ['reshash'] = $resArray;
</pre>
<p>Now in Flex we will have a method that check the status and decided if the transaction failed or not:</p>
<pre class="brush: as3;">
private function paymentComplete():void {
	var srv:HTTPService = new HTTPService();
	srv.url = URL_ROOT + &quot;/payPalFlex/getPaymentStatus.php&quot;;
	//srv.resultFormat
	srv.addEventListener(ResultEvent.RESULT,function (event:ResultEvent):void {

		Alert.show(event.result.status.type);
		if (event.result.status.type == 'SUCCESS') {
			currentState = 'Succes';
		} else {
			currentState = 'Fail';
		}
	});
	srv.addEventListener(FaultEvent.FAULT,function (event:FaultEvent):void {
		currentState = 'Fail';
		Alert.show(event.message.toString());
	});
	srv.send();
}
</pre>
<p>where getPaymentStatus.php is just a simple PHP page that retrieves that status from the DoExpressCheckoutPayment result previously stored in session:</p>
<pre class="brush: php;">
&lt;status&gt;
  &lt;type&gt;&lt;?php echo strtoupper ($_SESSION ['reshash'] [&quot;ACK&quot;] ) ?&gt;&lt;/type&gt;
&lt;/status&gt;
</pre>
<p>The paymentComplete method needs to be explicitly exposed through the ExternalInterface API in order to be available to JavaScript calls. This can be done when the Flex application initializes: the applicationComplete event is a good candidate for this.</p>
<pre class="brush: as3;">
ExternalInterface.addCallback('paymentComplete',paymentComplete);
</pre>
<p>The only thing that remains now to be done is to close the pop-up window and notify the Flex App:</p>
<pre class="brush: xml;">
&lt;script type=&quot;text/javascript&quot;&gt;
	function gotoflex() {
		window.opener.window.document.getElementById('payPalFlex').paymentComplete();
		window.close();
	}
&lt;/script&gt;
&lt;a class=&quot;home&quot; id=&quot;CallsLink&quot; href=&quot;javascript:gotoflex()&quot;&gt;Return to Flex&lt;/a&gt;
</pre>
<h3>Installing the sample files</h3>
<ol>
<li>Unzip <a href="http://miti.pricope.com/samples/payPalFlex/payPalFlexPHP.zip">payPalFlexPHP.zip</a> into your Web Root folder (For example: /work/www).</li>
<li>Edit payPalFlex/ppNVP/constants.php and replace
<pre class="brush: php;">
define('API_USERNAME', 'sdk-three_api1.sdk.com');
define('API_PASSWORD', 'QFZCWN5HZM8VBG7Q');
define('API_SIGNATURE', 'A.d9eRKfd1yVkRrtmMfCFLTqa6M9AyodL0SJkhYztxUi8W9pCXF6.4NI');
</pre>
<p>with your ownPayPal API_USERNAME, API_PASSWORD and API_SIGNATURE</li>
<li>In Flash Builder click File-&gt;Import … and choose Flash Builder Project.</li>
<li>Choose <a href="http://miti.pricope.com/samples/payPalFlex/payPalFlex.fxp">payPalFlex.fxp</a></li>
<li>Fill the the Output Folder Location, Web Root and Root URL with your values. It should look something like this:</li>
</ol>
<p><img src="http://miti.pricope.com/wp-content/uploads/2009/07/Picture1.png" alt="" width="500" height="266" /></p>
]]></content:encoded>
			<wfw:commentRss>http://miti.pricope.com/2009/07/19/integrating-paypal-express-checkout-with-flex/feed/</wfw:commentRss>
		<slash:comments>17</slash:comments>
		</item>
	</channel>
</rss>
