Flex 如何使用JAVA對象串連SQLServer資料庫

以前我剛開始接觸Flex1.5的時候怎麼都不明白Flex是如何串連資料庫的，雖然知道有三種方式，但還是不懂，這個問題讓我頭痛了好長時間，後來終於恍然大悟。今天寫一篇如何在Flex中使用RemoteObject利用JAVA對象串連資料庫的教程，給初學者做參考，高手就不需要看了。

首先，做一點說明。Flex是不能直接連接資料庫的，這一點大家需要知道，它只能間接地串連資料庫。Flex中提供了三種方式：HttpService，WebService 和 RemoteObject。其中HttpService可以直接擷取XML中的資料，還可以通過JSP,ASP以及PHP讀取資料庫中的資料，這個比較簡單，而且網上也有很多例子，我就不多說了。WebService我不懂，請自己查資料。我一直用的是JAVA對象串連資料庫，感覺這個挺方便，而且J2EE的技術已經很成熟。今天的教程就是以 Flex + JAVA + SQLServer 擷取資料庫公告資訊為例簡單說一下RemoteObject的用法。

前提

1.確保你安裝了Flex Data Service。這個對於單個CUP無限APP是免費的，可以去Adobe下載。如果只是讀取XML檔案是不需要這個的，串連資料庫就需要它了。

2.安裝了Flex Builder或者有Flex SDK。我這裡使用的是Flex Builder（IDE就是方便啊 ^_^）。

3.安裝了SQLServer資料庫。

4.安裝了JRUN或者tomcat或其它的J2EE容器，因為發布的時候我們的程式要運行在J2EE平台上。

5.安裝了JDK。
JDK版本問題：由於我用的是Flex Data Service內建的JRUN，它不支援JDK5.0，所以我用的是JDK1.4.2，版本問題大家看具體情況來。

第一步：建立資料庫

這裡我們有一個公告表，表名為Bulletin。結構如下：

程式碼欄位名稱    欄位類型            說明

ID              自動編號          自動編號
title            Nvarchar(100)    題目
date          datatime                日期
author       Nvarchar(20)      作者
contents    ntext                內容

在資料庫中建立這個表。儲存之後進入下一步。

第二步：在JAVA中編寫擷取公告的代碼

首先，我們要建立一個公告類來專門儲存擷取的公告資訊，代碼如下。

NoticeInfo.java

程式碼package net.zhuoqun.connectDB;

import java.util.Date;
public class NoticeInfo {
    private String title;        // 標題
    private String author;  // 作者
    private String content;// 內容
    private Date dates;       // 時間
    
    public String getAuthor() {
        return author;
    }
    public void setAuthor(String author) {
        this.author = author;
    }
    ……………… // 其它get 和 set 方法。
}

建立好這個之後我們要建立一個資料查詢類：DataServiceImpl.java 來查詢資料庫，並將查詢結果傳給將要建立的Flex程式。由於我們不清楚有多少條記錄，所以就藉助一下JAVA中的ArrayList這個類，它位於java.util 包中。先建立一個ArrayList：

程式碼ArrayList noticeList = new ArrayList(); // 這裡我沒有用泛型，因為我用的JDK1.4.2.

查詢資料庫之後，每讀取一條記錄就添加到 noticeList。

程式碼while(rs.next()){
    NoticeInfo temp = new NoticeInfo();
    temp.setAuthor(rs.getString("author"));
    temp.setContent(rs.getString("content"));
    temp.setDates(rs.getDate("date"));
    temp.setTitle(rs.getString("title"));
    noticeList.add(temp);
}

查詢完畢之後你就可以把這個noticeList傳回去，你也可以傳回去一個 NoticeInfo 數組：

程式碼NoticeInfo[] notices = new NoticeInfo[noticeList.size()];
for(int i=0;i<noticeList.size();i++){
    notices[i] = (NoticeInfo)noticeList.get(i);
}
return notices;

我這裡用的是後一種方法。如果你直接把noticeList傳回去的話，記住一點，JAVA的ArrayList類型的對象到了Flex中會變成ArrayCollection類型的。

現在JAVA部分的代碼就寫好了。

DataServiceImpl.java 的全部代碼如下：

程式碼package net.zhuoqun.connectDB;

import java.sql.*;
import java.util.ArrayList;
import java.util.Date;

public class DataServiceImpl {
    
    private Connection conn = null;
    private Statement stmt = null;

    // 以下是資料庫以及驅動資訊
    public final static String DRIVER = "com.microsoft.jdbc.sqlserver.SQLServerDriver";
    public final static String CONN_STR_PRE = "jdbc:microsoft:sqlserver://";
    public final static String HOST_NAME = "localhost:1433;";
    public final static String DATABASE_NAME = "DatabaseName=mydata";
    public final static String USERNAME = "aaa";
    public final static String PASSWORD = "aaa";
    
    public DataServiceImpl(){
        
    }
    // 查詢資料庫
    private ResultSet executeQuery(String sqlText){
        try{
            Class.forName(DRIVER);
        }catch(ClassNotFoundException e){
            e.printStackTrace();
        }

        try{
            conn = DriverManager.getConnection(CONN_STR_PRE + HOST_NAME + DATABASE_NAME, USERNAME, PASSWORD);
            stmt = conn.createStatement();
            ResultSet rs = stmt.executeQuery(sqlText);
            return rs;
        }catch(SQLException e){
            e.printStackTrace();
        }
        return null;
    }

    // 查詢公告. 這個是本程式的關鍵代碼
    public NoticeInfo[] getNotices(){
        ArrayList noticeList = new ArrayList();
        
        String sqlText = "select author,content,date,title from Bulletin";
        
        ResultSet rs = executeQuery(sqlText);
        
        try{
            while(rs.next()){
                NoticeInfo temp = new NoticeInfo();
                temp.setAuthor(rs.getString("author"));
                temp.setContent(rs.getString("content"));
                temp.setDates(rs.getDate("date"));
                temp.setTitle(rs.getString("title"));
                noticeList.add(temp);
            }
            
            NoticeInfo[] notices = new NoticeInfo[noticeList.size()];
            for(int i=0;i<noticeList.size();i++){
                notices[i] = (NoticeInfo)noticeList.get(i);
            }
            return notices;
        }catch(SQLException e){
            e.printStackTrace();
            return null;
        }
    }
}

第三步： 配置Flex Data Service

1，把剛才寫的JAVA檔案編譯。開啟FDS的安裝資料夾，將編譯的檔案拷貝到/jrun4/servers/default/flex/WEB-INF/classes 檔案夾中，進行下面的配置。

2.開啟FDS的安裝資料夾。進入 jrun4/servers/default/flex/WEB-INF/flex 目錄。裡面是關於Flex Data Service 的設定檔，我們這裡只看RemoteObject如何配置，其它配置資訊請自己看協助。現在我們開啟裡面的 remoting-config.xml 檔案。向裡面添加如下資訊，作為<service>的子標籤：

程式碼<destination id="dataService">
     <properties>
          <source>net.zhuoqun.connectDB.DataServiceImpl</source>
     </properties>
</destination>

當你設定了 destination 的時候，你就引用了了可以用來串連相應類的資訊通道（messaging channel）。它的 id 必須在檔案中是獨一無二的。 source屬性是指你編譯的JAVA類在classes檔案夾中的路徑。由於我的DataServiceImpl類在classes/net/zhuoqun/connectDB中，所以source的值為net.zhuoqun.connectDB.DataServiceImpl。記住，不要寫.class尾碼。<properties> 標籤還可以有一個<scope>子標籤，其作用我在這裡就不說了，大家自己看相關文檔（關於FDS的配置其實有很多東西，這些在協助文檔裡都有，我這裡不多說了，也說不過來，自己看吧）。

現在我們已經配置好了背景 FDS，做完了整個程式的大部分工作，接下來就是前台Flex程式調用的事情了。

第四步：建立Flex程式

開啟Flex Builder，建立一個工程 ConnectDB。功能表列中 File -> New -> Flex Project，這時會彈出一個對話方塊，選擇 Flex Data Service最下面的，

其中還有兩個編譯選項，分別是“在Flex Builder中本地編譯”（編譯成SWF和HTML頁放到伺服器）和“當使用者瀏覽頁面時再編譯”，你可以根據需要選擇，這裡我們選擇第一個。

接下來設定FDS伺服器的根目錄和路徑：

輸入工程的名稱和目錄：

然後點擊下一步設定類路徑以及輸出檔案夾等等：

這些都設定好之後點擊 完成 就建立了一個Flex工程。

第五步：通過 RemoteObject 訪問資料庫

開啟工程中產生的主檔案 ConnectDB.mxml，聲明一個 RemoteObject ：

程式碼<mx:RemoteObject id="getData" destination="dataService" result="proccessResult(event.result)" fault="Alert.show(event.fault.faultString,'Error')"/>

其中 destination 的值是剛才我們在配置 FDS 的時候設定的 destination。 result 表示在這個RemoteObject 成功返回之後所要做的動作，這裡我們調用一個方法 proccessResult()來處理返回的資料，它的參數 event.result 就是從伺服器段獲得的資料，資料是作為一個對象傳過來的。 fault 表示在這個RemoteObject請求失敗時要做的處理，這裡我們會彈出一個顯示錯誤資訊的對話方塊。接下來我們要聲明一個DataGrid控制項來顯示公告的標題和發布日期：

程式碼<mx:DataGrid id="myDG">
    <mx:columns>
        <mx:DataGridColumn headerText="標題" dataField="title"/>
        <mx:DataGridColumn headerText="發布日期" dataField="dates" labelFunction="formatDate"/>
    </mx:columns>
</mx:DataGrid>

其中headerText是顯示在上方的表頭，dataField表示要顯示的資料域，為什麼資料域是title和dates呢？因為我們傳回的是一個 NoticeInfo 對象數組，雖然它是作為一個對象傳回來的，但是其中的資料結構並沒有變，那些資料域的名字也沒有變，所以我們可以根據 NoticeInfo 中的變數設定dataField。labelFunction 屬性是用來格式化顯示的，因為傳回來的是格林威治時間，所以我們需要將其格式化然後顯示出來。注意，這裡只是顯示兩個資料域，並不代表其它的資料都沒有了，它們仍然存在，只是沒有顯示出來。

接下來，在 <mx:Script> 標籤中編寫proccessResult()方法和格式化日期的 formatDate方法：

程式碼private function proccessResult(result:Object):void
{
    myDG.dataProvider = ArrayUtil.toArray(result);
}

private function formatDate(item:Object,column:DataGridColumn):String
{
    return df.format(item.dates);
}    // df 是一個 DateFormatter，在下面會給出。關於如何格式化DataGrid的顯示
    // 以及DateFormatter這裡就不討論了，協助裡寫得很清楚

這個函數只是簡單地將獲得的資料傳給 myDG 的 dataProvider。result 的類型是Object，因為資料是作為一個對象傳過來的。之所以調用 ArrayUtil.toArray() 這個方法，是因為返回的記錄可能只有一條，而myDG 的 dataProvider顯示單個對象的時候可能會出錯，所以安全起見先將其轉換成數組。

最後，我們編寫調用 RemoteObject 的方法，使其在程式啟動時就調用。

程式碼private function initApp():void
{
      getData.getNotices();
}

其中 getData 是RemoteObject的 id，getNotices()是DataServiceImpl.java中的方法。在這裡可以直接調用它。當然，如果DataServiceImpl.java有其它方法，也可以通過這種方式直接調用。接下來設定組件建立完畢時調用 initApp()方法，在 <mx:Application>中添加一個creationComplete屬性:

程式碼<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" fontSize="12"

creationComplete="initApp()">
……………………

ConnectDB.mxml的全部代碼：

程式碼<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" fontSize="12"

creationComplete="initApp()">
    <mx:Script>
        <![CDATA[
            import mx.controls.Alert;
            
            import mx.utils.ArrayUtil;
            
            private function initApp():void
            {
                getData.getNotices();
            }

            private function proccessResult(result:Object):void
            {
                myDG.dataProvider = ArrayUtil.toArray(result);
            }
            private function formatDate(item:Object,column:DataGridColumn):String
            {
                return df.format(item.dates);
            }// df 是一個 DateFormatter，在下面會給出。關於如何格式化DataGrid的顯示
            // 以及DateFormatter這裡就不討論了，協助裡寫得很清楚
        ]]>
    </mx:Script>
                <mx:DateFormatter id="df" formatString="YYYY-MM-DD"/>

    <mx:RemoteObject id="getData" destination="dataService" result="proccessResult(event.result)" fault="Alert.show(event.fault.faultString,'Error')"/>
    
    <mx:DataGrid id="myDG">
        <mx:columns>
            <mx:DataGridColumn headerText="標題" dataField="title"/>
            <mx:DataGridColumn headerText="發布日期" dataField="dates" labelFunction="formatDate"/>
        </mx:columns>
    </mx:DataGrid>

</mx:Application>

整個工程終於完成，啟動JRUN，然後運行。結果：

需要注意的地方：

1.注意你的 JRUN 或者其它容器對JDK版本的支援，不小心就會出錯。

2.在運行時如果控制台出現了 找不到/messagebroker/amf檔案 的錯誤，請看我以前找到的解決辦法：http://www.zhuoqun.net/article.asp?id=180

3.啟動並執行時候如果是擷取資料出錯的，控制台一般都會有提示資訊，可以給你很多提示。

總結

這篇簡單的教程算是給一些 Flex 的初學者一個入門，我技術也有限得很，寫得不好，勿怪。另外限於篇幅，很多細節方面我都沒有寫出來，如果有什麼看不明白的就去看協助文檔，那是最好的教科書。