4.4.4 カスタムフォームの作成

Interstage Portalworks 管理者ガイド

目次索引

4.4.4 カスタムフォームの作成

サンプルフォームや標準のレスポンスXSLTは、非常にシンプルです。WS USPでは、運用管理者が独自に作成したWeb サービスを呼び出すカスタムフォームやレスポンスを整形するカスタムXSLTを使用する機能があります。ここでは、例を使って、サンプルフォームをカスタマイズしてカスタムフォームを作る方法を説明します。カスタムXSLTの作り方については、“4.4.5 カスタムXSLTの作成”で説明します。

翻訳Webサービスを解説したページ（http://www.xmethods.com/ve2/ViewListing.po?serviceid=14）によると、パラメータ［translationmode］には、以下のようなキーワードが指定ができます。

translationmode	翻訳
"en_fr"	英語 -> フランス語
"en_de"	英語 -> ドイツ語
"en_it"	英語 -> イタリア語
"en_pt"	英語 -> ポルトガル語
"en_es"	英語 -> スペイン語
"fr_en"	フランス語 -> 英語
"de_en"	ドイツ語 -> 英語
"it_en"	イタリア語 -> 英語
"pt_en"	ポルトガル語 -> 英語
"es_en"	スペイン語 -> 英語

サンプルフォームのままでは、この表により［translationmode］に入力するキーワードを調べる必要があります。これでは、使い勝手が良くありません。そこで、［translationmode］をプルダウンから選択できるようなカスタムフォームを作ることにします。

カスタムフォームの作成は、以下の手順で行います。

サンプルフォームのソースを取得します。
サンプルフォームを編集し、カスタムフォームを作成します。
WS USPのフォルダにカスタムフォームを配置します。
別名パラメータを変更します。

■サンプルフォームのソースの取得

サンプルフォームのソースコードを表示するには、［source code］リンクをクリックしてください。すると、ダウンロードが始まります。これを任意の名前で保存してください。

ここでは、名前を「Translater.html」として保存することにします。

■サンプルフォーム編集によるカスタムフォームの作成

保存したファイル（Translater.html）をテキストエディタや市販のホームページ作成ソフトなどで編集します。

サンプルフォームのHTML

 1: <html>
 2:   <head>
 3:     <title>BabelFishService</title>
 4:   </head>
 5:   <body>
 6:     <h1>BabelFishService</h1>
 7:     <a href="$pwdir:c/$pwsrv;sponsorAction=show;type=form;WSDL=http%3A%2F%2Fwww.xmethods.net%2Fsd%2F2001%2FBabelFishService.wsdl">source code</a>
 8:     <h2>WSDL</h2>
 9:     <a href="http://www.xmethods.net/sd/2001/BabelFishService.wsdl">http://www.xmethods.net/sd/2001/BabelFishService.wsdl</a>
10:     <h2>Operations</h2>
11:     <ul>
12:       <!-- Binding : BabelFishBinding -->
13:       <li>BabelFish<form action="$pwdir:c/$pwsrv;pw%3AsponsorAction=invoke" method="POST">
14:           <input type="hidden" name="WSDL" value="http://www.xmethods.net/sd/2001/BabelFishService.wsdl"/>
15:           <input type="hidden" name="operation" value="BabelFish"/>
16:           <!-- PortType : BabelFishPortType -->
17:           <!-- Message : BabelFishRequest -->
18:           translationmode : <input type="text" name="translationmode"/>
19:           <br/>
20:           sourcedata : <input type="text" name="sourcedata"/>
21:           <br/>
22:           response format : 
23:           <input type="radio" name="ResXSLT" value="none"/>
24:           XML
25:           <input type="radio" name="ResXSLT" value="" checked="checked"/>
26:           HTML <br/>
27:           <input type="submit" value="invoke"/>
28:         </form>
29:       </li>
30:     </ul>
31:   </body>
32: </html>

ただし、サンプルフォームを編集するうえで、変更してはいけないものがあります。上記のHTMLフォームを例に、編集してはならない要素を以下に示します。

13行目の<form>タグの「action」属性
「$pwdir:c/$pwsrv;pw%3AsponsorAction=invoke」は、Web サービスを呼び出すためのPortalworks固有の文字列です。この値は、Portalworksを経由することによって適切なURLに変換されるため、変更しないでください。
14行目の<input>タグの「name」属性と「value」属性
利用するWebサービスのWSDLが指定されています。
15行目の<input>タグの「name」属性
「operation」は、オペレーション名を指定するキー名です。変更はできません。「value」属性には、利用するオペレーション名を指定します。この例では、BabelFishオペレーションしかないため、編集は不要です。
18行目、20行目の<input>タグの「name」属性
これらは、BabelFishオペレーションの引数名なので、変更はできません。

以下のカスタムフォーム（Translater.html）は、上記の属性値を変更せずに、作成した例です。

カスタムフォーム（Translater.html）

 1: <html>
 2:   <head>
 3:     <title>Translater</title>
 4:   </head>
 5:   <body>
 6:     
 7:     <h2>翻訳</h2>
 8:     <form action="$pwdir:c/$pwsrv;pw%3AsponsorAction=invoke" method="post">
 9:       <input type="hidden" name="WSDL"
10:   value="http://www.xmethods.net/sd/2001/BabelFishService.wsdl"/>
11:       <input type="hidden" name="operation" value="BabelFish"/>
12:       翻訳する文:
13:       <br>
14:       <textarea name="sourcedata" rows="5" cols="40"></textarea>
15:       <br>
16:       <select name="translationmode">
17:         <option value="en_fr">英語からフランス語へ</option>
18:         <option value="en_de">英語からドイツ語へ</option>
19:         <option value="en_it">英語からイタリア語へ</option>
20:         <option value="en_pt">英語からポルトガル語へ</option>
21:         <option value="en_es">英語からスペイン語へ</option>
22:         <option value="fr_en">フランス語から英語へ</option>
23:         <option value="de_en">ドイツ語から英語へ</option>
24:         <option value="it_en">イタリア語から英語へ</option>
25:         <option value="pt_en">ポルトガル語から英語へ</option>
26:         <option value="es_en">スペイン語から英語へ</option>
27:       </select>
28:       <input type="submit" value="翻訳"/>
29:       : 
30:       <input type="radio" name="ResXSLT" value="none">XML</input>
31:       <input type="radio" name="ResXSLT" value="" checked="checked">HTML</input>
32:       <br/>
33:     </form>
34:   </body>
35: </html>

カスタムフォームでは、翻訳する文の入力には、textareaを使い長い文章を入力できるようにし（14行目）、変換モードはプルダウンメニューから選択できるように変更（16行目～27行目）しています。

■WS USPのフォルダへのカスタムフォームの配置

作成したカスタムフォーム（Translater.html）を以下のフォルダ内に配置します。ただし、「custom」というフォルダが存在しない場合は、フォルダを新規に作成してから配置してください。

［J2EE共通ディレクトリ］\ijserver\PortalServer\apps\wscontrol.war\custom
(J2EE共通ディレクトリのデフォルトは、C:\Interstage\J2EE\var\deployment です。)
/opt/FJSVj2ee/var/deployment/ijserver/PortalServer/apps/wscontrol.war/custom

■別名パラメータの変更

運用管理の［サービス - 別名変更／参照／削除］から、Translaterサービスを選択し、別名パラメータ設定画面へと移動します。

別名パラメータに「カスタムFORMのURL」として、先ほど配置したカスタムフォームを指定します。この例では、「http://Portalworksサーバ名:ポート番号/wscontrol/custom/Translater.html」を指定します。

再度、ポータルページでTranslaterサービスのブリックに切り替えると、以下のようなフォームが表示されます。任意の文を入力して、［翻訳］ボタンをクリックすると、サンプルフォームと同様な結果が表示されることを確認してください。

目次索引