Flex - Layanan RPC
Flex menyediakan layanan RPC untuk menyediakan data sisi server ke sisi klien. Flex memberikan cukup banyak kontrol ke data sisi server.
Dengan menggunakan layanan Flex RPC, kita dapat menentukan tindakan pengguna yang akan dijalankan di sisi server.
Layanan Flex RPC dapat diintegrasikan dengan teknologi sisi server apa pun.
Salah satu Layanan RPC Flex menyediakan dukungan bawaan untuk data biner terkompresi yang akan ditransfer melalui kabel dan cukup cepat.
Flex menyediakan tiga jenis Layanan RPC berikut
Sr Tidak | Layanan & Deskripsi RPC |
---|---|
1 | HttpService Tag <mx: HTTPService> digunakan untuk mewakili objek HTTPService dalam file MXML. Saat Anda melakukan panggilan ke metode send () objek HTTPService, itu membuat permintaan HTTP ke URL yang ditentukan, dan respons HTTP dikembalikan. Anda juga dapat menggunakan metode HTTP HEAD, OPTIONS, TRACE, dan DELETE. |
2 | WebService <Mx: WebService> digunakan untuk mendapatkan akses ke operasi layanan web yang sesuai dengan SOAP. |
3 | RemoteObject Tag <mx: RemoteObject> digunakan untuk mewakili objek HTTPService dalam file MXML. Tag ini memberi Anda akses ke metode objek Java menggunakan pengkodean Action Message Format (AMF). |
Kami akan membahas Layanan HTTP secara rinci. Kami akan menggunakan file sumber XML yang ditempatkan di server dan mengaksesnya di sisi klien melalui Layanan HTTP.
Items.xml
<items>
<item name = "Book" description = "History of France"></item>
<item name = "Pen" description = "Parker Pen"></item>
<item name = "Pencil" description = "Stationary"></item>
<items>
Deklarasi HTTPService
Sekarang deklarasikan HTTPService dan berikan url dari file di atas
<fx:Declarations>
<mx:HTTPService id = "itemRequest"
url = "http://www.tutorialspoint.com/flex/Items.xml" />
</fx:Declarations>
Panggilan RPC
Lakukan panggilan ke metode itemRequest.send () dan ikat nilai dari objek lastResult webservice itemRequest ke komponen Flex UI.
...
itemRequest.send();
...
<mx:DataGrid id = "dgItems" height = "80%" width = "75%"
dataProvider = "{itemRequest.lastResult.items.item}">
<mx:columns>
<mx:DataGridColumn headerText = "Name" dataField = "name" />
<mx:DataGridColumn headerText = "Description" dataField = "description" />
</mx:columns>
</mx:DataGrid>
Contoh Panggilan Layanan RPC
Sekarang, Mari kita ikuti langkah-langkah untuk menguji layanan RPC dalam aplikasi Flex -
Langkah | Deskripsi |
---|---|
1 | Buat proyek dengan nama HelloWorld di bawah paket com.tutorialspoint.client seperti yang dijelaskan di bab Flex - Buat Aplikasi . |
2 | Ubah HelloWorld.mxml seperti yang dijelaskan di bawah ini. Jaga sisa file tidak berubah. |
3 | Kompilasi dan jalankan aplikasi untuk memastikan logika bisnis berfungsi sesuai kebutuhan. |
Berikut adalah konten file mxml yang dimodifikasi src/com.tutorialspoint/HelloWorld.mxml.
<?xml version = "1.0" encoding = "utf-8"?>
<s:Application xmlns:fx = "http://ns.adobe.com/mxml/2009"
xmlns:s = "library://ns.adobe.com/flex/spark"
xmlns:mx = "library://ns.adobe.com/flex/mx"
minWidth = "500" minHeight = "500" creationComplete = "init(event)">
<fx:Style source = "/com/tutorialspoint/client/Style.css" />
<fx:Script>
<![CDATA[
import mx.events.FlexEvent;
import mx.rpc.events.FaultEvent;
import mx.rpc.events.ResultEvent;
protected function init(event:FlexEvent):void {
itemRequest.send();
}
]]>
</fx:Script>
<fx:Declarations>
<mx:HTTPService id = "itemRequest"
url = "http://www.tutorialspoint.com/flex/Items.xml" />
</fx:Declarations>
<s:BorderContainer width = "630" height = "480" id = "mainContainer"
styleName = "container">
<s:VGroup width = "100%" height = "100%" gap = "10"
horizontalAlign = "center" verticalAlign = "middle">
<s:Label id = "lblHeader" text = "RPC Service Demonstration"
fontSize = "40" color = "0x777777" styleName = "heading" />
<s:Panel id = "parentPanel" title = "Using RPC Services"
width = "500" height = "200" >
<s:layout>
<s:VerticalLayout gap = "10"
verticalAlign = "middle" horizontalAlign = "center" />
</s:layout>
<mx:DataGrid id = "dgItems" height = "80%" width = "75%"
dataProvider = "{itemRequest.lastResult.items.item}">
<mx:columns>
<mx:DataGridColumn headerText = "Name" dataField = "name" />
<mx:DataGridColumn headerText = "Description"
dataField = "description" />
</mx:columns>
</mx:DataGrid>
</s:Panel>
</s:VGroup>
</s:BorderContainer>
</s:Application>
Setelah Anda siap dengan semua perubahan yang dilakukan, mari kita kompilasi dan jalankan aplikasi dalam mode normal seperti yang kita lakukan di bab Flex - Membuat Aplikasi . Jika semuanya baik-baik saja dengan aplikasi Anda, itu akan menghasilkan hasil sebagai berikut: [ Coba online ]