Java Day Tokyo 2017 ダウンロード資料

Size: px

Start display at page:

Download "Java Day Tokyo 2017 ダウンロード資料"

ともひろえいさか
5 years ago
Views:

1 Java EE におけるフロントエンド開発と JSF2.3 アップデート日本オラクル株式会社クラウドテクノロジーコンサルティング事業本部シニアコンサルタント加藤田益嗣 Java Day Tokyo 年 5 月 17 日

2 Safe Harbor Statement The following is intended to outline our general product direction. It is intended for information purposes only, and may not be incorporated into any contract. It is not a commitment to deliver any material, code, or functionality, and should not be relied upon in making purchasing decisions. The development, release, and timing of any features or functionality described for Oracle s products remains at the sole discretion of Oracle. 2

3 自己紹介加藤田益嗣 (Katoda Masuji) 日本オラクルクラウドテクノロジーコンサルティング統括本部シニアコンサルタント Java Java EE の開発技術支援執筆 (Java EE 7 徹底入門翔泳社 2015 年 12 月 ) [ 第 2~4 章プレゼンテーション層の開発担当 ] 3

4 アジェンダ 1 2 Java EE におけるフロントエンド開発 JSF2.3 アップデート 4

5 アジェンダ 1 2 Java EE におけるフロントエンド開発 JSF2.3 アップデート 5

6 Java EE におけるフロントエンド開発 Java EE は Web アプリケーションを開発するために 3 層アーキテクチャを採用プレゼンテーション層ビジネスロジック層インテグレーション層 6

7 Java EE におけるフロントエンド開発の歴史 Java EE Servlet JSF JAX-RS Struts1.* Spring Seasar * 2.* 3.* 4.* 5.* End Of Life(EOL) 7

8 Java EE におけるフロントエンド開発の歴史 Java EE Servlet JSF JAX-RS Struts1.* Spring Seasar 年をピークに 1.2 サードパーティ製フレームワーク利の増加 * 2.* 3.* 4.* 5.* Java EE 機能拡充とサードパーティ製フレームワーク EOL により Java EE へ回帰 End Of Life(EOL) 8

9 Java EE におけるフロントエンド開発の歴史 Java EE Servlet JSF JAX-RS Struts1.* Spring Seasar * 2.* 3.* 4.* 5.* End Of Life(EOL) 9

10 Java EE 8 でフロントエンド開発にいる仕様 Servlet HTTP の動的コンテンツを生成するローレベルの API JSF Web アプリケーションの UI フレームワーク JAX-RS RESTful Web サービスを開発するための API MVC 1.0 は Java EE 8 の仕様から取り下げ 10

11 Web アプリケーションの利ユースケース JSF JAX-RS Spring 必要な機能 JSF JAX-RS+ クライアント Spring 送受信データ HTML XML JSON HTML ステート管理ステートフルステートレスステートレス (or ステートフル ) MVCアーキテクコンポーネントベースアクションベースアクションベースチャ仕様策定 JCPにより決定 JCPにより決定独自利ユースケース安定度重視のアプリケーション UI を簡単に開発複数画面 (Web やモバイルアプリ ) が必要 RESTAPI 提供が必要最新技術を使フレームワークの針を明確にして利することが重要 11

12 Web アプリケーションのフロントエンド開発に求められているもの開発容易性デザイン操作性レスポンス向上モバイルデバイス対応 12

13 JSF の開発容易性より開発容易性を目指した改善 JSF1 JSP XML JSFManagedBean JSFValidation JSF2 Facelets Annotation CDI BeanValidation 13

14 JSF のデザイン操作性 UI コンポーネント化することで容易にデザイン操作性を提供 UIコンポーネントの仕組みを提供 JavaScriptやCSSをパッケージング 14

15 JSF のレスポンス向上 Ajax に対応し部分更新を実現 JSF2.0よりAjaxに対応 JavaScriptの記載は最小限ブラウザブラウザ画面全体を更新サーバ処理 BackingBean 必要部分のみ更新サーバ処理 BackingBean 通常の画面更新 Ajax を使した画面更新 15

16 JSF のモバイルデバイス対応多くの UI コンポーネントがレスポンシブやモバイルデバイスに対応 JSFのサードパーティ製 UIコンポーネントの多くがレスポンシブやモバイルデバイス向けのインターフェースに対応仕組みは同様のままPC モバイル双の開発が可能 16

17 アジェンダ 1 2 Java EE におけるフロントエンド開発 JSF2.3 アップデート 17

18 JSF の機能 HTML 画面と Java の処理を EL 式を使用して簡単に紐付け画面 (Facelets) ユーザ登録ユーザID 名前登録 EL 式でバインド処理 (BackingBean) String userid; String name; void 登録処理 () { } JSF が提供する機能画面定義 (Facelets) UI コンポーネント ( タグライブラリ ) 入出値のマッピングルーティング入チェックコンバータ 18

19 JSF2.3(JSR#372) の最終投票が完了し承認 19

20 JSF2.3 で追加される機能 1. WebSocket 機能 2. CDIの機能拡充 3. 画面繰り返し処理の改善 4. BeanValidation 相関チェック対応 5. Date And Time API 対応 6. Ajax 機能の強化 7. その他 20

21 1.WebSocket 機能 21

22 1.WebSocket 機能 <f:websocket> タグを使用して WebSocket の機能を簡単に開発 JSF の WebSocket のサポートは以前より検討されていた JSF 2.3 では <f:websocket> タグが提供され WebSocket の実装を直接サポート 22

23 1.WebSocket 機能クライアント側の実装 channel と onmessage の指定は必須 <f:websocket channel= somechannel onmessage="somewebsocketlistener" /> function somewebsocketlistener(message, channel, event) { alert(message); } onmessage で指定した JavaScript のファンクションが呼び出される 23

24 1.WebSocket 機能クライアント側の実装 ( インライン ) <f:websocket channel="somechannel" onmessage="function(m){alert(m);}" /> onmessage 内にインライン記載も可能 24

25 1.WebSocket public class MyBean implements private PushContext somechannel; 通知するための PushContext を CDI で注入 public void sendmessage(object message) { somechannel.send(message); } send メソッドでメッセージを通知 25

26 1.WebSocket 機能サーバ側の実装 (channel private PushContext アノテーションでチャネル名の指定が可能 ( 省略時は変数名 = チャネル名 ) 26

27 1.WebSocket 機能エンドポイントの有効化 WebSocket のエンドポイントを有効化するには web.xml の設定が必要 <context-param> <param-name>javax.faces.enable_websocket_endpoint</param-name> <param-value>true</param-value> </context-param> 27

28 1.WebSocket 機能 WebSocket のポート指定 WebSocket のポート指定も可能 <context-param> <param-name>javax.faces.websocket_endpoint_port</param-name> <param-value>8000</param-value> </context-param> 28

29 1.WebSocket 機能 WebSocket サポートブラウザ Internet Explorer Mozilla Firefox Google Chrome Safari Opera (10 から ) 29

30 2.CDI の機能拡充 30

31 2.CDI の機能拡充 CDI でインジェクト可能なオブジェクトが追加以前のJSFではstaticメソッドを使してFacesContextやリクエスト情報等の各種インスタンスを取得していたテストでの置き換えが困難 ExternalContext externalcontext = FacesContext.getCurrentInstance().getExternalContext(); CDI 使してインスタンスの取得が可能になる記載が冗 31

32 2.CDI の機能拡充 CDI を使 private ExternalContext context; 取得可能なインスタンス javax.faces.application.resourcehandler javax.faces.context.externalcontext javax.faces.context.facescontext javax.faces.context.flash javax.servlet.http.httpsession 32

33 2.CDIの機能拡充 Map 型のインスタンスの取得 private Map<String, Object> @ViewMap 33

34 2.CDI の機能拡充 EL 式の評価に CDI を使 JSF 固有のEL 暗黙オブジェクトの評価にCDIを使 #{facescontext} インスタンスの解決に CDI の Producer を使 34

35 2.CDI の機能拡充インジェクション可能なクラスの拡充以下の JSF 管理対象オブジェクトに対して CDI のインジェクションが可能になる Converter Validator を使するには managed=true managed=true) public class MyConverter implements Converter { 35

36 3. 画面繰り返し処理の改善 36

37 3. 画面繰り返し処理の改善画面繰り返し処理で Iterable と Map をサポート List 配列 JSF 独自の DataModel に対しては以前から対応 JSF2.3 では <h:datatable>,<ui:repeat> で使可能なクラスとして Iterable と Map が追加された 37

38 3. 画面繰り返し処理の改善 Map を使した繰り返しの例 <ui:repeat var="row" value="#{mybackingbean.datamap}"> Key:#{row.key} Value:#{row.value}<br/> </ui:repeat> keyとvalueで値を取得 <h:datatable var="row value="#{mybackingbean.datamap}"> <h:column>#{row.key}</h:column> <h:column>#{row.value.name}</h:column> <h:column>#{row.value.age}</h:column> </h:datatable> 38

39 3. 画面繰り返し処理の改善カスタム DataModel 対応カスタム DataModel の利 = Child1.class) public class Child1Model<E> extends DataModel<E> public int getrowcount() { return 0; public E getrowdata() { return null; } // 中略 } DataModel が処理可能な型を指定 39

40 3. 画面繰り返し処理の改善 <ui:repeat> に begin,end 属性が追加 begin,end 属性の追加により BackingBean を使しない繰り返しが可能になる <ui:repeat begin="0" end="30" step="2" var="i"> #{i}<br /> </ui:repeat> 40

41 4.BeanValidation 相関チェック対応 41

42 4.BeanValidation 相関チェック対応以前の JSF の BeanValidation では単項目のみのチェックで複数項目に対応した相関チェックには対応していなかった値 A 値 B 値 A が入されている場合に値 B をチェックする JSF2.3 ではクラスレベルの BeanValidation が実できるように <f:validatewholebean> タグが追加された 42

43 4.BeanValidation 相関チェック対応クライアント側の実装 <h:panelgrid columns="2"> <h:outputtext value= パスワード " /> <h:inputsecret id="password1" value='#{backingbean.password1}'> <f:validatebean validationgroups="passwordvalidationgroup" /> </h:inputsecret> <h:outputtext value= パスワード ( 確認 )" /> <h:inputsecret id="password2" value='#{backingbean.password2}'> <f:validatebean validationgroups="passwordvalidationgroup" /> </h:inputsecret> </h:panelgrid> <f:validatewholebean value="#{backingbean} validationgroups="passwordvalidationgroup" /> 入フィールドの最後にクラスレベルのバリデーションを実施するタグを指定 43

44 4.BeanValidation 相関チェック対応 @Password(groups = PasswordValidationGroup.class) public class BackingBean implements Cloneable BeanValidation min=8, groups = PasswordValidationGroup.class) private min=8, groups = PasswordValidationGroup.class) private String password2; } //Getter,Setter,clone 44

45 4.BeanValidation 相関チェック対応サーバ側の実装 ( Password { String message() default パスワードが一致していません "; Class[] groups() default {}; Class[] payload() default {}; } バリデータのアノテーションを作成 45

46 4.BeanValidation 相関チェック対応サーバ側の実装 ( バリデータ実装 ) public class PasswordValidator implements ConstraintValidator<Password, BackingBean> public void initialize(password constraintannotation) { } public boolean isvalid(backingbean value, ConstraintValidatorContext context) { return value.getpassword1().equals(value.getpassword2()); } パスワード 1 と 2 が同じかをチェック 46

47 4.BeanValidation 相関チェック対応クラスレベルの BeanValidation の有効化クラスレベルの BeanValidation を有効化するには web.xml の設定が必要 <context-param> <param-name>javax.faces.validator.enable_validate_whole_bean</param-name> <param-value>true</param-value> </context-param> 47

48 5.Date And Time API 対応 48

49 5.Date And Time API 対応 Java SE 8で導入されたDate and Time API(JSR-310) に対応 <f:convertdatetime> タグで追加された日時クラスの利が可能タイプクラス名 date java.util.date time java.util.date both java.util.date localdate java.time.localdate localdatetime java.time.localtime localtime java.time.localdatetime offsettime java.time.offsettime offsetdatetime java.time.offsetdatetime zoneddatetime java.time.zoneddatetime 追加 49

50 5.Date And Time API 対応実装法 <h:inputtext value="#{mybean.offsettime}"> <f:convertdatetime type="offsettime" pattern="h:mm" /> </h:inputtext> タイプとパターンを指定 50

51 6.Ajax 機能の強化 51

52 6.Ajax 機能の強化 JSF はバージョン 2.0 より Ajax 機能に対応 JSF2.3 ではより Ajax を有効活できる機能が追加 52

53 6.Ajax 機能の強化 <h:commandscript> タグ <h:commandscript> タグにより JavaScript からの処理呼出しが容易になる JavaScript から呼び出せる sendmessage ファンクションが生成される <h:form> <h:commandscript name="sendmessage" action="#{mybean.sendmessage()}" render=":message"/> </h:form> 53

54 6.Ajax 機能の強化 JavaScript レスポンスの実 javax.faces.context.partialviewcontext.getevalscripts() を使してサーバから返信する JavaScript public class mybean private FacesContext context; } public void exec() { context.getpartialviewcontext().getevalscripts().add("alert('hello!')"); } 返信した JavaScript が返信した JavaScript が実される 54

55 6.Ajax 機能の強化コンポーネント検索機能の拡張 n 番目の子最も近い複合コンポーネントの親指定されたコンポーネントIDを持つすべてのコンポーネント子孫最も近いネーミングコンテナの親次のコンポーネントコンポーネントの親前のコンポーネント UIViewRoot 55

56 7. その他 56

57 7. その他 <f:importconstants> タグの追加 Converter Validatorのジェネリクス対応 javax.faces.beanパッケージの非推奨化 57

58 7. その他 <f:importconstants> タグの追加 <f:importconstants> タグが追加され EL 式で定数や enum が使可能になるクライアント <f:metadata> <f:importconstants type= MyBean" /> </f:metadata> <h:outputtext value="#{mybean.name}"/><br/> サーバ public class MyBean { public static final String NAME = Yamada"; } 58

59 7. その他 Converter Validator のジェネリクス対応 Converter Validator にジェネリクスが付与 (Converter<T> Validator<T> ) public class UserConverter implements Converter<User> { public User getasobject(facescontext fc, UIComponent uic, String s) { return new User(s); public String getasstring(facescontext fc, UIComponent uic, User u) { return u.getname(); } 59

60 7. その他 javax.faces.bean パッケージの非推奨化 JSF 独自の ManageBean が非推奨になる移のために CDI アノテーションが使可能になる 60

61 Java EE 8 は 2017 年 7 月にリリース予定 Public Review - Apr/May 2017 Proposed Final Draft - June 2017 Final Release - July 2017 Java EE schedule 61

62 Java コンサルティングサービス 62

63 日本オラクルの Java コンサルティングお客様のエンタープライズ環境で安心して Java テクノロジーをご利いただくための技術支援を提供特定の製品に依存せずプラットフォームニュートラルなアーキテクチャをベースとする技術支援 - 最新の Java テクノロジーと今後の Java ロードマップへの対応 - お客様の既存資産活のバランス - 技術支援を通したお客様との信頼関係構築と期的なご支援プラットフォームニュートラルなアーキテクチャの下オラクルのミドルウェア製品のアドバンテージ活のための技術支援 63

64 アプリケーションライフサイクルの全般でお客様が必要とする Java 技術支援を提供方向づけ推敲作成移運用アプリケーション開発支援アーキテクチャ作成支援お客様が作成したアーキテクチャのアセスメントプロトタイピングによるアーキテクチャ検証支援リファレンスプログラムの作成アーキテクチャ QA 支援マイグレーション支援 Java 最適化ファーストステップサービス (Java バージョンアップ対応のための簡易アセスメント ) プロトタイピングによる検証支援クラス設計 / 実装支援お客様が作成したクラス設計 / 実装のアセスメントテスト支援 ( 式検討環境構築計画 / 実施 ) 設計 / 実装 QA 支援性能チューニング支援トラブルシューティング支援機能追加 / 改修支援開発標準化支援 Java EE フレームワーク開発支援 ( 現アセスメント要件定義式設計 / 検証実装移 ) Java COE サービス ( 標準化組織設開発標準作成パイロット適ロールアウト / ガバナンスメンテナンス ) その他の支援 Java アドバイザリーサービス ( 定期的なオンサイトセッション開催による技術情報提供およびディスカッション ) Java メンタリングサービス ( 講義およびハンズオン形式のワークショップ ) 64

65 Oracle Digital はオラクル製品の導入をご検討いただく際の総合窓口電話とインターネットによるダイレクトなコニュニケーションでどんなお問い合わせにもすばやく対応しますもちろん無償どんなことでもご相談ください 65

66 66

Oracle パブリック・クラウド・サービス無料トライアル申込手順書

Oracle パブリック・クラウド・サービス無料トライアル申込手順書 Oracle パブリッククラウドサービス無料トライアル申込手順書日本オラクル Oracle Digital Safe Harbor Statement The following is intended to outline our general product direction. It is intended for information purposes only, and may