JDeveloper(Struts & JSF)備忘記

Oracle Jdeveloper 10g 是開發 J2EE Struts 或 JSF 的優良IDE,
它以組件為概念, 就像開發桌面應用程式般簡單 ( 像使用Delphi開發 ),
它內置了 embedded OC4J , 使開發及測試環境更加輕鬆.
在開發階段不用煩惱怎樣配置容器, 使初學者更快進入狀況.

Jdeveloper 10g的新能在下面連結裡官方有詳細說明：
http://www.oracle.com/technology/products/jdev/collateral/1013newfeatures.htm#New%20look%20and%20feel

開始備忘記：
雖然整個備忘過程需要配合大量圖片說明, 但由於數量太多,
故這裡只簡單地用文字表達, 以求備忘過程更簡潔.

安裝JDK

安裝 Oracle 10g requirement:
Windows NT Server 4.0, Windows XP Profectional, Windows 2000 sp1, Windows Server 2003
RAM 512MB 以上, 本人覺得 512MB 太慢了, 最好是 1 GB, Virtual memory 為 RAM 的2倍
Hard disk 1.5 GB 以上

下載 Oracle 10g: http://download.oracle.com/otn/nt/oracle10g/10201/10201_database_win32.zip
Administrator登入後解壓後直接安裝, Oracle Universal Install 會指導整個過程
Global database name 為 odb.mydomain.com , SID 為 ORCL
設定所有帳戶使用同一個password 為 abc123
安裝完成後,
使用 http://odb.mydomain.com:5500/em 進入 Enterprise Manager
使用 http://odb.mydomain.com:5560/isqlplus 進入 iSQL*Plus

安裝 JDeveloper:
下載 http://download.oracle.com/otn/java/jdeveloper/1013/jdevstudio1013.zip
不用安裝直接將它解壓至C:\jdevstudio1013 並點選目錄下的 jdeveloper.exe 執行
第一次執行時 會出現Would you like to migrate from a previous version of JDeveloper?選擇否.

在 Application Navigator panel 選擇 Applications 右鍵 選 new Application,
輸入 AppTest 後按確定, project 為 Project1,
點選 Project1 按 new 選 Simple File > Java Class
Name 為 HelloWorld 點選 Generate Main Method

更改程式為:
package dew;

public class HelloWorld {
public HelloWorld() {
System.out.println("Hello World");
}

public static void main(String[] args) {
HelloWorld helloWorld = new HelloWorld();
}
}

按 F11 或 Run 就會看到輸出 Hello World

JDeveloper 是 Oracle的產品,對資料庫有很好的整合.
選擇 Connections Navigator > Database > New Database Connection > Next
Connection Name 為 ORCLConn, Connection Type 為 Oracle (JDBC)
[ 這裡亦可選擇其它的資料庫Driver ],按 Next
Username 為 sys , Password 為 abc123, Role 為 sysdba , 按 Next
Driver 選 thin
Host Name 為 odb.mydomain.com
JDBC Port 為 1521
SID 為 ORCL
按Next 後, 再按 Test Connnection 會 出現 Success!, 然後按完成,

創建用戶:
點選 ORCLConn > new > Database Objects > User
User Name 為 tester
password 為 tester
Confirm Password 為 tester
Default Tablespace 為 USERS
Temporary Tablespace 為 TEMP
按 確定

變更資料庫連接用戶:
點選 ORCLConn > properties > Authentication
Username 改為 tester
password 改為 tester
Role 改為 Normal
刪除 Role
點選 Test panel 並按 "Test Connnection" 會出現 Success!

建立表格:
展開 ORCLConn 後可看到 TESTER 的 Schema 及裡面的Objects
按 Tables > New Table > Next
Schema 選 TESTER
Name 為 DEPARTMENT > Next
按 "+" , Name 填 DEPARTMENT_ID , Type 選 NUMBER, size 填 10
再按 "+", Name 填 DEPARTMENT, Type 選 VARCHAR2, size 填 100
再按 "+", Name 填 DESCRIPTION, Type 選 VARCHAR2, size 填 200
按 Next, 選 DEPARTMENT_ID 為 primary key , 一直按 Next 及完成
展開 Tables 就會看到 DEPARTMENT TABLE

再建立表格 EMPLOYEE
Name 為 EMPLOYEE > Next
按 "+" , Name 填 EMPLOYEE_ID , Type 選 NUMBER, size 填 10
再按 "+", Name 填 NAME, Type 選 VARCHAR2, size 填 50
再按 "+", Name 填 EMAIL, Type 選 VARCHAR2, size 填 300
再按 "+", Name 填 DEPARTMENT_ID, Type 選 NUMBER, size 填 10
按 Next , 選 EMPLOYEE_ID 為 primary key ,
按 Next > Next , 現在設定 Foreign Keys, 點選 Add
Refereneced Table 選 Department, Local Column 選 DEPARTMENT_ID,
Referenced Column on DEPARTMENT 選 DEPARTMENT_ID, 然後按完成

展開 Tables ,點擊 DEPARTMENT 及在 Editor下方選 Data
按 "+", DEPARTMENT_ID 為 1, DEPARTMANT 為 IT, DESCRIPTION 為 INFORMATION TECHNOLOGY
再按 "+", DEPARTMENT_ID 為 2, DEPARTMANT 為 HR, DESCRIPTION 為 HUMAN RESOURCE
再按 "+", DEPARTMENT_ID 為 3, DEPARTMANT 為 MKT, DESCRIPTION 為 MARKETING
然後選 Commit Changes, 資料就會插入資料庫

點擊 EMPLOYEE 及選 Editor下方選 Data
按 "+", ID 為 1, NAME 為 joeyta, EMAIL 為 joeyta@joeyta.com, DEPARTMENT_ID 為 1
再按 "+", ID 為 2, NAME 為 peter, EMAIL 為 peter@joeyta.com, DEPARTMENT_ID 為 1
再按 "+", ID 為 3, NAME 為 mary, EMAIL 為 mary@joeyta.com, DEPARTMENT_ID 為 1
再按 "+", ID 為 4, NAME 為 luis, EMAIL 為 luis@joeyta.com, DEPARTMENT_ID 為 2
再按 "+", ID 為 5, NAME 為 ann, EMAIL 為 ann@joeyta.com, DEPARTMENT_ID 為 2
再按 "+", ID 為 6, NAME 為 suzana, EMAIL 為 suzana@joeyta.com, DEPARTMENT_ID 為 3
然後選 Commit Changes, 資料就會插入資料庫

建立Stored Procedure:
點選 Connections Navigator > Database > ORCLConn > TESTER
右建選 Procedures > new PL/SQL Procedure, Object Name 輸入 SP_GEN_EMPLOYEE 按確定
內容為:
PROCEDURE SP_GEN_EMPLOYEE (iDepartment_id IN NUMBER)
IS
cursor emp_cur IS
select * from employee
where department_id = iDepartment_id
order by employee_id;
emp_rec emp_cur%ROWTYPE;
BEGIN
open emp_cur;
loop
fetch emp_cur into emp_rec;
exit when emp_cur%notfound;
DBMS_OUTPUT.PUT_LINE(emp_rec.employee_id chr(9)
emp_rec.name chr(9)
emp_rec.department_id);
end loop;
close emp_cur;

END;

點選 Procedures > SP_GEN_EMPLOYEE > RUN , 輸出結果為
JDeveloper　會產生一個 anonymous的 PL/SQL Block 作測試
把內容更改為:
DECLARE
IDEPARTMENT_ID NUMBER;
BEGIN
IDEPARTMENT_ID := 1;

SP_GEN_EMPLOYEE(
IDEPARTMENT_ID => IDEPARTMENT_ID
);
END;

按確定後輸出為:
Connecting to the database ORCLConn.
1 joeyta 1
2 peter 1
3 mary 1
Process exited.
Disconnecting from the database ORCLConn.

安裝及啟動OC4J:
JDeveloper 裡已內含 OC4J (Oracle Container for J2EE)
為 Standalone OC4J 及 Embedded OC4J Server ( Embedded OC4J 為開發使用 )
進入 C:\jdevstudio1013\jdev\bin
執行 C:\jdevstudio1013\jdev\bin>start_oc4j
OC4J 的預設 Administrator 為 oc4jadmin
第一次執行時會要求輸入password, 輸入 password 為 admin
設定後,現在關閉OC4J可執行
C:\jdevstudio1013\jdev\bin>stop_oc4j oc4jadmin admin
再次執行 C:\jdevstudio1013\jdev\bin>start_oc4j
在IE裡輸入 http://localhost:8888/ , 按右邊的 Launch 連結 進入Applecation Server Control
使用者名稱為 oc4jadmin , password 為 admin , 登入後可對 OC4J 進行管理

JDeveloper設定Application Server:
點選 Connections Navigator > Application Server > New Application Server Connection > Next
Connection Name 輸入 AppServerConnection, Connection Type 選 Standalone OC4J 10g 10.1.3
( 這裡亦可以選其他的Application server )
按 Next, Username 為 oc4jadmin, Password 為 admin
按 Next, Host Name 為 localhost, 按 Next 及 按Test Connection 成功後會出現 Success!
最後按 完成

建立 ADF Model (Application Development Framework):
點選 "Application Navigator" panel > New Application
Application Name 為 AppProject
Application Template 選 Java Application [Swing, ADF BC], 按確定
展開AppProject > Model > New > ADF Business Components > Business Components from Tables
Connection 選 ORCLConn , 按確定 後 出現另一個wizard, 然後按 Next
設定 new entities objects and associations:
在 Available 的方塊裡 按 Ctrl 點選 Department 及 Employee 再按 ">" , 再按 Next
設定 new view objects and view links:
創建 Object 及 View 都是
在 Available 的方塊裡 按 Ctrl 點選 Department 及 Employee 再按 ">" , 再按 Next
填入 Name 為 DeptEmpModule 及 按 Next 及 選擇 Business Components Diagram 及 再按 Next > 完成
展開 Application Navigator > AppProject > Model > Application Sources
裡面包含了 Oracle ADF 相關的檔案及設定檔
( Entity Object, Association, View Object, View Link, Application Module )
測試module 及 管理資料:
展開AppProject > Model > Application Sources > dew.model > DeptEmpModule > test
就可以打開 ADF BC 的 Oracle Business Componets Browser 去測試一下數據

建立UI:
點選AppProject > View 選 New > ADF Swing 選 Form 按確定 及 Next 需要進行 7個Step
step 1:
選擇 Mater-Detail Tables 及 Form
step 2(Master 及 Detail Template): 使用預設值
step 3(Define data model): click New
會出現 Client Data Model Definition Wizard
使用預設值, 按 Next > Next > 完成
step 4, step 5 ,step 6, step 7: 使用預設值 並按 完成
就會建立 ADF Swing Client , 選 View　按Make 及 Run
就會出現 Master-Detail 的 Swing Clint 供 瀏覽,新增,修改,刪除數據

建立 JSP Web Application Project:
選 AppProject > New Project > Projects > Web Project ,
按確定後出現Create Web Project Wizard, 按 Next
step 1: Project Name 為 ViewController
step 2: 選Servlet 2.4/JSP 2.0 (J2EE 1.4)
step 3: 點選 "Add JSP Page"
Next > 完成 就會出現 Create JSP Wizard
step 1: File Name 為 DeptEmp.jsp
step 2, step 3, step 4 使用預設值 > 完成
展開 ViewController > Web Content 就可以看到DeptEmp.jsp
進入 DeptEmp.jsp Edit page, 可隨意輸入文字及改變style
選擇 View > Components palette ,選擇 CSS > JDeveloper
拖到編輯區就會把預設的JDeveloper css 加到 DeptEmp.jsp
選擇 View > Data Control palette , 展開 DeptEmpModuleDataControl
將 DepartmentView1 拖到編輯區 選 Forms > Read-Only Form
再次將 DepartmentView1 拖到編輯區Form裡, 選 Forms > Navigation Buttons
然後點選 DeptEmp.jsp 按 Make 及 Run
JDeveloper 會啟動內置的Embbeded OC4J 及 自動開啟IE
( Embbeded OC4J 是JDeveloper 內置的lighweight container, 用作測試 )
http://192.168.15.21:8988/AppProject-ViewController-context-root/DeptEmp.jsp
可以對數據進行瀏覽

到這裡為此, 感覺使用JDeveloper進行開發Client side, 就像Delphi開發一樣簡單
主要兩種方法:
(1)
Business Service (Connect DB)
ADF Data Controls Model 或 ADF Bindings Model
Contoller (Struts)
ADF UIX 或 JSP Web Client
(2)
Business Service (Connect DB)
ADF Data Controls Model 或 ADF Bindings Model
Swing model Java Client

JDeveloper建主Struts Web Projects:
建立表格:
Connection Navigator > Connections > Database > ORCLConn
展開 ORCLConn 後可看到 TESTER 的 Schema 及裡面的Objects
按 Tables > New Table > Next
step 1: Schema 選 TESTER, Name 為 USERS > Next
step 2:
按 "+" , Name 填 USER_ID , Type 選 VARCHAR2, size 填 10
再按 "+", Name 填 PASSWORD, Type 選 VARCHAR2, size 填 20
再按 "+", Name 填 TEL, Type 選 VARCHAR2, size 填 30
step 3:
選 USER_ID 為 primary key
step 4, step 5, step 6, step 7, step 8 按 Next 及 完成
展開 Tables 就會看到 USERS TABLE

增加 USERS 表數據:
點 ORCLConn 選 SQL WorkSheet , 輸入
insert into users(user_id, password, tel)
values('joeyta', 'joeyta', '99999999');
按左上角 Execute SQL Statement, 在 USERS table 裡就看到新增的數據

建主 Struts Web Project:
Applications > New Application
Application Name 為 LoginWS, Application Template 選 Web Application[JSP, Strues, ADF BC]
展開LoginWS , 可看到 Model 及 ViewController project
點 ViewController 選 Open Struts Page Flow
選 View > Components Palette > Struts Page Flow > Page
把 Page 拖到Struts-config.xml 編輯區, 就會產生 /untitled1.jsp , 將它更改成 /index.jsp
在 Components Palette 拖一個 Action 至編輯區中
就會產生一個 /action1 , 將它更改成 /LoginAction
然後繼續拉兩個 Page 到 編輯區, 改名為 /success.jsp 及 /failure.jsp

Double click /index.jsp 打開其作編輯
選 View > Components Palette > CSS , 把JDeveloper拖到編輯區
然後將 Components Palette 裡的 CSS 切換成 Strut HTML
選 Action 為 /LoginAction.do 按確定
將 Strut HTML 切換成 HTML Common, 然後將Table拖到編輯區
在 Table 第一個column 輸入 "帳號" 及 "密碼"
然後將 Components Palette 裡的 HTML Common 切換成 Strut HTML
拖選 Text Field 至編輯區中, Property 輸入 user_id 後按確定
拖選 Password Field 至編輯區中, Property 輸入 passwd 後按確定
拖選 Submit Button 至編輯區中

Double click /welcome.jsp 進入編輯
輸入 登入成功

Double click /failure.jsp 進入編輯
輸入 登入失敗

切換至 Struts-config.xml 編輯區
點選空白地方按右鍵,選Diagram > Refresh Diagram from All Pages
就會看到 /index.jsp 及 /LoginAction 之間有一條虛線連結一起
然後 點選 Struts Page Flow > Forward
把 /loginAction 連至 /success.jsp 及 /failure.jsp
然後 Double click /loginAction 並按 確定
LoginAction.java 的程式碼就會顯示
切換至 Struts-config.xml 編輯區
然後 點選 Struts Page Flow > Page Link
把 /failure.jsp 與 /index.jsp 連在一起

點選 view > Structure > struts-config > Insert inside struts-config > form-beans
點 form-beans 選 Insert inside form-beans > form-bean
name 為 login , type 選擇 org.apache.struts.action.DynaActionForm
點選 form-bean - login > Insert inside form-beans > form-property
name 為 user_id , type 為 java.lang.String
再點選 form-bean - login > Insert inside form-beans > form-property
name 為 passwd , type 為 java.lang.String

點選 Applications > LoginWS > ViewController > Web Content > WEB-INF > struts-config.xml > properties
選 Action Mappings > Form Bean > name 選 login , 按確定

ADD Oracle JDBC library:
點選 View Controller > Project Properties > Libraries > Add Library > Oracle JDBC > 確定

修改 LoginAction.java 為
public class LoginAction extends Action {
/**This is the main action called from the Struts framework.
* @param mapping The ActionMapping used to select this instance.
* @param form The optional ActionForm bean for this request.
* @param request The HTTP Request we are processing.
* @param response The HTTP Response we are processing.
*/
public ActionForward execute(ActionMapping mapping, ActionForm form,
HttpServletRequest request,
HttpServletResponse response) throws IOException,
ServletException {

String user_id = (String)((DynaActionForm)form).get("user_id");
String passwd = (String)((DynaActionForm)form).get("passwd");
int numColumns = 0;
Connection conn;
try {
DriverManager.registerDriver(new oracle.jdbc.driver.OracleDriver());
} catch (SQLException e) {
System.out.print("Driver Error");
}
try {
conn = DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521:orcl",
"tester", "tester");
Statement stmt = conn.createStatement();
ResultSet rs =
stmt.executeQuery("select count(1) counter from users where user_id = '" +
user_id + "' and password = '" + passwd +
"'");
ResultSetMetaData rmeta = rs.getMetaData();
numColumns = rmeta.getColumnCount();
System.out.println(numColumns);
conn.close();
if (numColumns == 1) {
return mapping.findForward("success");
} else {
return mapping.findForward("failure");
}
} catch (SQLException ce) {
System.out.print(ce);
}
return mapping.findForward("success");
}
}

進入 struts-config.xml 的編輯區 選 /index.jsp > run
就會啟動 Embedded OC4J 並彈出 IE browser, 就可以對登入頁面作測試

JDeveloper建主JSF Web Projects:
在最新版本的JDeveloper已內置了JSF,不需要對JSF做任何設定.
現在直接來建立一個Hello World的Project
File -> New -> Application -> Application
Application Name : FirstJSF
Application Template: Web Application[JSF, ADF BC]

點選FirstJSF -> ViewController -> Web Content 右鍵按New
選 JSP -> JSP
step 1:
File Name: HelloWorld.jsp
step 2: Next
step 3: Choose "JSF Core 1.0" and "JSF HTML 1.0"
from Available Libraries to Selected Libraries.
step 4: Finish

在FirstJSF -> ViewController -> Web Content下會出現HelloWorld.jsp
點選 View -> Component Palette -> JSF Core
把 View 拉到 HelloWorld.jsp裡
點選 View -> Component Palette -> JSF HTML
把 Output Text 拉到 HelloWorld.jsp
然後點選 HelloWorld.jsp 裡的Output Text 按右鍵選 Properties
Value 輸入 Hello World 然後按確定
Right click Helloworld.jsp -> Run
Embedded OC4J 就會自動啟動 並彈出 browser.
在browser裡 就會看到 Hello World.

以下有更多官方的教學：
http://www.oracle.com/technology/obe/obe1013jdev/index.htm