Leveraging BlazeDS, Java, and Flex: Dynamic Data Transfer

2,623 views

Published on

Presentation for 360|Flex 2012 in Denver.

Published in: Technology, Education
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,623
On SlideShare
0
From Embeds
0
Number of Embeds
572
Actions
Shares
0
Downloads
21
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Leveraging BlazeDS, Java, and Flex: Dynamic Data Transfer

  1. 1. LEVERAGING BLAZEDS, JAVA, AND FLEX:DYNAMIC DATA TRANSFER Joseph Labrecque 360|Flex – April 17th 2012
  2. 2. Joseph Labrecque, MAUniversity of Denver - OTLSenior Interactive Software EngineerAdjunct FacultyFractured Vision Media, LLCProprietorTwitter: @JosephLabrecqueWeb: http://josephlabrecque.com/
  3. 3. Who is using ColdFusion?
  4. 4. Who is using Java?
  5. 5. Who is using BlazeDS?
  6. 6. Who is using PHP + AMFPHP?
  7. 7. Who is using FLEX?
  8. 8. SESSION AGENDAWhat we will cover…• Technology choices involved• Systems configuration and documentation• Code snippet walkthough• Specific, cool use cases in university• Other stuff!
  9. 9. Technology Choices
  10. 10. BLAZEDSBlazeDS is the server-based Java remoting and webmessaging technology that enables developers toeasily connect to back-end distributed data andpush data in real-time to Apache Flex and AdobeAIR applications for more responsive rich Internetapplication (RIA) experiences.Just as with the Flex framework, BlazeDS isexpected to be contributed to the Apache SoftwareFoundation (ASF).
  11. 11. FLEXThe Apache Flex framework provides a highlyproductive, open source framework for buildingand maintaining expressive web applicationsthat deploy consistently on all major browsers,desktops and operating systems.It provides a modern, standards-based languageand programming model that supports commondesign patterns suitable for developers frommany backgrounds.Flex applications run in the ubiquitous AdobeFlash Player and Adobe AIR.
  12. 12. JAVAOracle Java is a programming language andcomputing platform first released by SunMicrosystems in 1995. It is the underlyingtechnology that powers state-of-the-artprograms including utilities, games, andbusiness applications.Java runs on more than 850 million personalcomputers worldwide, and on billions ofdevices worldwide, including mobile and TVdevices.
  13. 13. SPRINGSpring is the leading platform to buildand run enterprise Java applications.Led and sustained by SpringSource,Spring delivers significant benefits formany projects, increasing developmentproductivity and runtime performancewhile improving test coverage andapplication quality.
  14. 14. SPRING + BLAZEDSSpring BlazeDS Integration is a top-level Springproject, and a component of the completeSpring Web stack.This projects purpose is to make it easier tobuild Spring-powered Rich Internet Applicationsusing Apache Flex as the front-end client. Itaims to achieve this purpose by providing first-class support for using the open source AdobeBlazeDS project and its powerful remoting andmessaging facilities in combination with thefamiliar Spring programming model.
  15. 15. Systems Configuration
  16. 16. CHOICES / REASONSJAVA: Major apps use this or ColdFusionSPRING: Needed a modern framework for JavaFLEX: For advanced functionalityBLAZEDS: For AMF calls between Java and FlashHTML(5): Default web presentation technologySpring and BlazeDS work AWESOME together!
  17. 17. BLAZEDS CONFIGURATIONThere is a dismal lack of clearinstruction for configuringBlazeDS AMF services withSpring.Many of the resources that doexist refer to older versions of thesoftware or strict scenarios thatdo not apply to everyone usingSpring for their projects.
  18. 18. OFFICIAL SPRING DOCShttp://static.springsource.org/spring-flex/docs/1.0.x/reference/html/index.html
  19. 19. OFFICIAL ADOBE RESOURCES http://opensource.adobe.com/wiki/display/blazeds/BlazeDS
  20. 20. UNOFFICIAL GUIDE ;) http://inflagrantedelicto.memoryspiral.com/2011/01/get-up-and- running-with-blazeds-amf-in-spring-mvc/
  21. 21. Let’s talk code
  22. 22. Action Message FormatBinary format used to serialize objects graphs suchActionScript objects and XML, or send messagesbetween an Adobe Flash client and a remoteservice.Used across over 15 platforms:ColdFusion, Java, PHP, Python, Ruby, iOS, even JavaScript!
  23. 23. AMF0Introduced in Flash Player 6 (2001).NumberBooleanStringObjectNullArrayObject/Array End
  24. 24. AMF3Introduced in Flash Player 9 (2006).UndefinedNullFalseTrueIntegerDoubleStringXMLDateArrayObjectXML End
  25. 25. REMOTEOBJECTProvides access to Java objects through AMFcomponents within Flash Player.<s:RemoteObject></s:RemoteObject>RemoteObject instances can be set up via MXML orActionScript but they do rely upon the Flexframework.
  26. 26. ENDPOINTThe location of AMF services to access.http://josephlabrecque.com/messagebroker/amfNote that this URL will differ depending on how BlazeDSis configured via web.xml:<servlet-mapping> <servlet-name>spring</servlet-name> <url-pattern>/messagebroker/amf</url-pattern></servlet-mapping>
  27. 27. DESTINATIONThis is the service name established uponconfiguration:flexServiceDefined within any Java classes that will be used by Flash:import org.springframework.flex.remoting.RemotingDestination;@Service("flexService")@RemotingDestination(value="flexService",channels={"my-amf"})
  28. 28. RESULT/FAULTThis is a set of event handler methods defined in ourRemoteObject for handling the results of AMF calls.This is normally done through ActionScript.private function resultAMF(e:ResultEvent):void { var r:String = e.result as String;}
  29. 29. METHODA Flex-based representation of the actual remotemethod to be invoked.Includes a representation of all arguments expectedby this method as well.These values are able to use data binding.<s:method name=“remoteMethodName" ...
  30. 30. MXML<fx:Declarations> <s:RemoteObject id="ro" showBusyCursor="true" endpoint="{siteURL+messagebroker/amf}" destination="flexService" result="resultAMF(event)" fault="faultAMF(event)"> <s:method name="createAudioRecordingFileItem"> <s:arguments> <bytes>{mp3ByteArray}</bytes> <responseId>{rID}</responseId> <replace>{replace}</replace> </s:arguments> </s:method> </s:RemoteObject></fx:Declarations>
  31. 31. ActionScript – AMF InvokeInvoke the send() method upon the specific methoddefined within the RemoteObject instance.private function saveMP3():void { ro.createAudioRecordingFileItem.send();}
  32. 32. ActionScript – AMF ResultThe result event handler is invoked when asuccessful result is returned from an AMF call.import mx.rpc.events.ResultEvent;private function resultAMF(e:ResultEvent):void { var r:String = e.result as String;}
  33. 33. ActionScript – AMF FaultThe fault event handler is invoked when a fault istriggered as the result of an AMF call.import mx.rpc.events.FaultEvent;private function faultAMF(e:FaultEvent):void { Alert.show(e.fault.faultString, "Error!");}
  34. 34. Specific Use Cases
  35. 35. DU ASSESS-IT!Assess-It! is a web-based applicationthat supports academic programassessment at the University of Denver.Assess-It! supports three basicassessment models which weredeveloped based on input from facultyand staff who are engaged in academicprogram assessment at DU.https://assess-it.du.edu/
  36. 36. SINGLE UPLOAD W/ TINYMCEUsing TinyMCE for WYSIWYGtext processing.http://www.tinymce.com/No Java-based filemanagement! Just PHP… whatto do?We use Flex and BlazeDS:modified the TinyMCE imageinsert code. Easy!
  37. 37. MULTI-FILE UPLOADLooked at HTML <form> andJavaScript-based solutions.Many relied on Flash inbackend.Why not just do it ourselves?Allows multiple selection,batched upload, immediatefeedback for the user.
  38. 38. IMAGE GALLERY VIEWERQ: Could we have done this injQuery/HTML/JS?A: Sure.Q: Could we have done this injQuery/HTML/JS in a solid, tested,cross-browser method with greatuser interaction in a couple ofhours?A: Hell, no.
  39. 39. AUDIO RECORDINGOld recorder would save off toFlash Media Server as audio-onlyFLV. System then goes in via FTPto fetch it.New recorder does all therecording and encoding in theFlash Player. Then sends the bytesover to Java for file save via AMF.Uses:flash.utils.ByteArrayflash.events.SampleDataEventorg.bytearray.micrecorder.encoder.WaveEncoderfr.kikko.lab.ShineMP3Encoder
  40. 40. AUDIO PLAYBACKBasic playback of recorded filesusing the recorder module oruploaded MP3 files.Hooks into system through AMF.AMF not necessary.
  41. 41. Not all Flash
  42. 42. OTHER TECH…More than Flash… of course.• The markup is HTML(5).• Use of CSS3 for gradients, shadows, text.• TinyMCE and Flex integration.• Heavy use of JavaScript and jQuery.• jQuery makes JavaScript (fairly) usable!Actually really cool that we can do thisnow.
  43. 43. HTML & FRIENDS (+FLASH)A few words…• Most web applications I’m involved in are a wide mixture of both front-end and back-end tech.• This has been the case for many years – it just makes sense in many cases.• If you are requiring Flash for core functionality – may as well use it more liberally.• HTML(5) has its place… so does Flash and Flex.• Seems people are OVERREACTING. Cut it out. ;)
  44. 44. Thank you.@JosephLabrecque

×