スクリプトレットおよび動作について

Microsoft Office 2000/Visual Basic プログラマーズ ガイド   

スクリプトレットは、HTML コードおよびスクリプトで構成される軽くて再利用可能なコポーネント オブジェクト モデル (COM) コンポーネントで、特定の条件に基づいて作成されます。動作は、特定の機能を担う軽いコンポーネントです。HTML 要素に適用すると、動作により要素の既定動作が向上します。

スクリプトレットおよび動作は、Web ページで使用できる機能を持つ個別のドキュメント内にスクリプトが含まれるという点で類似しています。異なる点としては、動作は、HTML 要素に関連するイベントの応答として呼び出されるスクリプトを含む個別ファイルを示す STYLE 属性であり、スクリプトレットは、Web ページ内のスクリプトにおけるほぼ何に対しても使用できるということが挙げられます。

スクリプトレットは Internet Explorer 4.0 以降のバージョン、動作は Internet Explorer 5 以降のバージョンでサポートされています。スクリプトレットおよび動作の使用は、作成の目的および対象とするブラウザの種類によって異なります。ユーザーが Internet Explorer 4 を使用している場合、スクリプトレットを使用することになります。HTML で使用する必要なものがすべて含まれたコンポーネントを作成するには、DHTML スクリプトレットを使用し、STYLE 属性として使用する軽いコンポーネントを追加する場合は動作を使用します。

スクリプトレットを作成する

スクリプトレットは .sct または .htm の拡張子を持つ HTML コード ファイルで、HTML コードと VBScript コード、または JScript コード、あるいはその両方を使用し、HTML エディタで作成できます。また、Microsoft® Scriptlet Wizard (スクリプトレット ウィザード) を使用して作成することも可能です。Microsoft Visual Basic のバージョン 5.0 または 6.0 のクラス ビルダを使用した経験がある場合、ウィザードの使用方法については既にご存知でしょう。ウィザードでは、スクリプトレットに必要となる基本的な HTML コードを段階的に作成することができ、また、ほかの Web ページのスクリプトレットの参照に必要な HTML コードを含むサンプルのコンテナ ファイルが用意されています。スクリプトレット ウィザードは、Microsoft Scripting Technologies の Web サイト http://www.microsoft.com/japan/developer/scripting/ からダウンロードできます。

作成するスクリプトレットの種類

基本的なスクリプトレットの種類として、ユーザー インターフェイスを持つもの (DHTML スクリプトレット) と持たないもの (コードのみのスクリプトレット) があります。ユーザー インターフェイスを持つスクリプトレットはカプセル化されたスクリプトおよび DHTML コードで、ユーザー インターフェイスをほかの HTML ページで表示するようにデザインされています。たとえば、デジタル時計またはカレンダーを表示するスクリプトレットを作成できます。表示要素および適切な表示に必要となるすべてのコードがスクリプトレット内に含まれているため、ほかの COM コンポーネントと同様に繰り返し使用することができます。

ユーザー インターフェイスを持たないスクリプトレットは、オブジェクトのメソッドやプロパティと同様に機能するスクリプト プロシージャが記述された Web ページです。この種のスクリプトレットは、VBA クラス モジュールで作成されたカスタム オブジェクトに類似しています。クラス モジュールと同様、スクリプトレットには多くのプロシージャが含まれ、メソッドまたはプロパティとしてほかのオブジェクトで利用されるもの、スクリプトレット内からほかのプロシージャによってのみアクセス可能なものがあります。

スクリプトが含まれる再利用可能なオブジェクトを作成する理由は、VBA で再利用可能なオブジェクトを作成する場合と同じです。再利用可能なコード オブジェクトの利点の詳細については、第 9 章「カスタム クラスとオブジェクト」を参照してください。また、スクリプトレットの詳細については、Scriptlet Technology Web サイト http://msdn.microsoft.com/developer/sdk/inetsdk/help/scriptlets/scrlt.htm を参照してください。

DHTML スクリプトレットについて

DHTML スクリプトレットは、ほかの Web ページから利用できるユーザー インターフェイスを持つ Web ページです。DHTML スクリプトレットを作成するには、スクリプトレットとして保存するユーザー インターフェイスを表示する Web ページを作成します。その後、ユーザー インターフェイスが完全に機能するために必要なスクリプトを追加します。たとえば、次のサンプルは、ページでのデジタル時計の表示に必要なすべての HTML コードとスクリプトです。

<HTML>
<HEAD>
<SCRIPT LANGUAGE="VBScript">
<!--
Sub InitDigiTimer
   ' MoveTime プロシージャが 1 秒おきに
   ' 呼び出されるように指定します。
   window.setInterval "MoveTime", 1000
End Sub

Function MoveTime()   
   document.all("displayTime").innerText = time()
End Function

Sub window_onload()
   InitDigiTimer
End Sub
-->
</SCRIPT>
</HEAD>

<BODY>
<DIV   ID=displayTime
      STYLE=   "position:absolute;
             width: 120;
             height: 20;
             border:solid;
             border-color:lightblue;
             border-left-width:thin;
             border-right-width:thin;
             background-color:darkblue;
             color:yellow;
             text-align:center;
             font-family:arial;
             font-weight:bold">
</DIV>
</BODY>
</HTML>

図 12.3 は、この HTML コードによるブラウザでの表示結果を示したものです。

図 12.3 デジタル時計 スクリプトレット

このファイルをスクリプトレットとして使用する場合、コンテナ Web ページには時計および関連する書式のみが表示されます。たとえば、このファイル名を DateTime.htm とし、次の <OBJECT> タグをコンテナ ページに挿入してほかの Web ページ からスクリプトレットとして使用することができます。

<OBJECT   ID="scrltCode2"
         STYLE= "position:absolute;
                  width:150;
                  height:40;"
         TYPE="text/x-scriptlet"
         DATA="DateTime.htm">
</OBJECT>

DHTML スクリプトレットの作成に必要な <OBJECT> タグ属性は、TYPE および DATA のみです。TYPE 属性の設定は、常に "text/x-scriptlet" です。DATA 属性は、常にスクリプトレットとして参照するファイルのパスおよび名前を含めてください。時計のデザインを変更する場合は、DateTime.htm ファイル内の STYLE 属性の設定のみを変更します。STYLE 属性の設定を含めて上記の <DIV> タグにある <OBJECT> タグで囲み、コンテナ ページ内での時計の正確な位置を指定できます。

コードのみのスクリプトレットについて

この種のスクリプトレットを作成するには、<SCRIPT> タグを持つ HTML ファイルを作成してカスタム プロシージャを含める方法と、Scriptlet Wizard を使用する方法の 2 通りがあります。どちらの方法でも、スクリプトレット オブジェクト内のほかのプロシージャにのみ使用可能なプライベート プロシージャ、およびオブジェクトの Public プロパティおよびメソッドを示すプロシージャを含む基本テンプレートを作成することになります。

次のサンプルは、エラー処理の準備がされていない簡単な GetRecords.htm. という名前のコードのみのスクリプトレットの HTML コードとスクリプトです。このスクリプトレットは、ActiveX データ オブジェクト (ADO) の Recordset オブジェクトをコンテナ Web ページの呼び出し機能に返します。GetRecords.htm ファイルは、Office 2000 Developer CD-ROM の ODETools\V9\Samples\OPG\Samples\CH12 サブフォルダから利用できます。

get_ (読み取り) または put_ (書き込み) 接頭辞を Function プロシージャのプロパティ名に追加してスクリプトレットのプロパティを作成します。get_ と put_ プロシージャの両方をプロパティに作成した場合、プロパティにより、読み取り/書き込みの両方を行います。片方のみを使用した場合、読み取り専用、または書き込み専用のプロパティが作成されます。get_ および put_ を使用して作成されたプロシージャは、VBA クラス モジュールで使用される Property Get および Property Let プロシージャに類似しています。プロシージャが定義される前に、スクリプト ブロックの先頭で各プロパティの既定値を設定します。

public_ 接頭辞を Function プロシージャのメソッド名に追加してスクリプトレットの public メソッドを作成します。public_ 接頭辞のないプロシージャでは、スクリプトレット内のほかのプロシージャにのみ使用でき、コンテナ Web ページでは非表示となります。

<HTML>
<HEAD>
<TITLE>GetRecords スクリプトレット</TITLE>
</HEAD>

<SCRIPT LANGUAGE="VBScript">
<!--
' プロパティを規定値に初期化します。
Dim p_provider
Dim p_databasePath

p_provider = "Microsoft.Jet.OLEDB.4.0"
p_databasePath = "c:\program files\microsoft office\office\samples\nwind.mdb"

Function get_provider()
   get_provider = p_provider
End Function

Function put_provider(newValue)
   p_provider = newValue
End Function

Function get_databasePath()
   get_databasePath = p_databasePath
End Function
Function put_databasePath(newValue)
   p_databasePath = newValue
End Function

Function public_GetRecordset(strSQL)
   Dim rstRecordset
   Dim cnnConnection

   Set cnnConnection = CreateObject("ADODB.Connection")
   cnn.Provider = p_provider
   cnn.Open p_databasePath

   Set rstRecords = CreateObject("ADODB.Recordset")
   rstRecords.Open strSQL, cnn, 1, 3
   Set public_GetRecordset = rstRecords
End Function
-->
</SCRIPT>

<BODY>
</BODY>
</HTML>

コンテナ Web ページでは、前の DHTML スクリプトレットの場合と同様、<OBJECT> タグを使用してスクリプトレットへの参照を作成します。

<OBJECT
   ID="NWIND"
   STYLE="   position:absolute;
            width:0;
            height:0;
            top:0;
            left:0;"
   TYPE="text/x-scriptlet"
   DATA="GetRecords.htm">
</OBJECT>

<OBJECT> タグは "NWIND" の ID 属性の設定を使用しています。スクリプトレット内でプロシージャを呼び出す際にこの識別子を使用します。たとえば、コンテナ Web ページで次のスクリプトを使用し、参照先のスクリプトレットのカスタム GetRecordset メソッドを呼び出します。

<SCRIPT LANGUAGE="VBScript">
<!--
Sub DisplayCustomerInfo()
   Dim strCountry
   Dim strSQL
   Dim rstRecords

   strCountry = document.all("txtCustomerCountry").value
   strSQL = "SELECT * FROM Customers WHERE Country = '" & strCountry & "'"
   Set rstRecords = NWIND.GetRecordset(strSQL)
   ' ここで返されたレコードで作業します。
End Sub
-->
</SCRIPT>

このスクリプトレットは、複数のデータ ソースで作業する際に便利で柔軟性に富んでいます。必要な作業は、プロパティを設定して異なるデータ ソースを指定し、strSQL 変数で定義したレコードに合致するものを返すだけです。上記の例からもわかるように、スクリプトレットの使用は、関連するスクリプト プロシージャを再利用可能なオブジェクトに含める上で非常に効果的です。

スクリプトレットと Web ブラウザ セキュリティの インタラクションについて

セキュリティ問題を重視している Internet Explorer 4.0 以降などのホスト アプリケーションでは、スクリプトレットおよびスクリプトレットに含まれるコントロールは Internet Explorer セキュリティの対象となっています。Internet Explorer のセキュリティ レベルを設定するには、バージョン 4.0 以降では [表示] メニュー、5 以降のバージョンでは [ツール] メニューにある [インターネット オブション] をクリックし、[セキュリティ] タブをクリックします。

ユーザーのマシンでは、スクリプトレットのサーバーを含むゾーンのセキュリティ レベルを [中] または [低] に設定します。セキュリティ レベルを [高] に設定すると、スクリプトレットがユーザーのコンピューターにダウンロードされません。ゾーンのセキュリティ設定が [インターネット オプション] ダイアログ ボックスの [セキュリティ] タブで [カスタム] と選択されている場合、[スクリプトを実行しても安全だとマークされている ActiveX コントロールのスクリプト] および [安全だとマークされていない ActiveX コントロールの初期化とスクリプト実行] が、[有効にする] あるいは [ダイアログを表示する] に設定されている必要があります。

特にスクリプトレットに別のゾーンのサーバーにあるコントロールが含まれている場合、ほかのスクリプトレットを含め、スクリプトレットを持つすべてのコントロールについても設定方法は同じです。

スクリプトレットを使用するアプリケーションを配布する際には、ユーザーの Internet Explorer のセキュリティをスクリプトレットが使用できる適切なレベルに設定するよう確認してください。

Internet Explorer におけるセキュリティ設定の詳細については、Internet Explorer ヘルプを参照してください。

動作について

スクリプトレットおよび動作により、Web ページで使用できる再利用可能なコンポーネントを作成することができます。コードのブロックを含めることができ、また再利用も可能なため、ページのスクリプトをそのコンテンツから独立させることができます。Web ページで使用できる動作には、カスタムの動作およびビルトインの動作の 2 種類があります。

カスタムの動作

カスタムの動作はインターフェイス ハンドラにより統合されています。Internet Explorer にはインターフェイス ハンドラの 1 種である Behavior Handler があり、ページが参照する動作スクリプトレットと連動する方法を設定できます。Behavior Handler により、動作スクリプトレットの custom イベント利用、スクリプトレットが含まれるページの DHTML オブジェクトモデルへのアクセス、およびイベントがページで発生した場合に通知を受け取ることが可能になります。Behavior Handlerの詳細については、Behavior Handler リファレンス http://www.microsoft.com/workshop/components/scriptoid/reference/behavior.asp を参照してください。

カスタムの動作の基本となる部分は、.sct の拡張子を持つファイルに保存される <SCRIPTLET> タグ、<IMPLEMENTS> タグ、<SCRIPT> タグです。<IMPLEMENTS> タグでは、"オートメーション" の TYPE 属性を使用します。<SCRIP> タグには動作に関連付けるスクリプトが含まれています。

<SCRIPTLET>
<!--
   <IMPLEMENTS Type="Behavior">
   </IMPLEMENTS>
   <SCRIPT Language="VBScript">
      ' ここにスクリプトを追加します。
-->
   </SCRIPT>
</SCRIPTLET>

基本的な構成を作成すると、DHTML オブジェクトおよびメソッドを使用してカスタム イベントを作成、含まれるページの要素で発生したイベントと同期、またはカスタム プロパティおよびメソッドを利用することができます。次の例は、カスタム動作スクリプトの作成に関する概念を説明するものです。この動作では、attachEvent メソッドを使用して含まれるページのイベントを監視し、指定したイベントが発生すると、スクリプトを実行します。

<SCRIPTLET>
   <IMPLEMENTS Type="Behavior">
   </IMPLEMENTS>
   <SCRIPT Language="VBScript">
<!--
      Dim previousColor

      attachEvent("onmouseOver", event_onmouseOver)
      attachEvent("onmouseOut", event_onmouseOut)

      Function event_onMouseOver()
         previousColor = style.color
         style.color = "red"
      End Function

      Function event_onMouseOut()
         style.color = previousColor
      End Function
-->
   </SCRIPT>
</SCRIPTLET>

この動作が、STYLE 属性として HTML 要素に接続されると、mouseOver および mouseOut イベントに応答するスクリプトが実行されます。ポインタが要素上に置かれると、要素の色が赤に変化し、元の色は previousColor 変数に保存されます。ポインタが要素上から離れると、元の色に戻ります。要素の STYLE 属性として動作スクリプトレットを指定して、この動作を追加します。次はその例です。

<HTML>
<TITLE>動作デモ</TITLE>
<HEAD>
<STYLE>
   .HiLite {behavior:url(hilite.sct)}
</STYLE>
</HEAD>
<BODY>
この言葉は<SPAN style=hilite>大文字</SPAN>で表示されます。マウス ポインタを置くと、色が変わります。
</BODY>
</HTML>

ビルトインの動作

Internet Explorer にあるビルトインあるいは既定の動作を利用することも可能です。これらの動作は外部コンポーネントを追加記述することなく、ブラウザから直接利用できます。Internet Explorer で実行される動作は次の表のとおりです。

ビルトインの動作 説明
anchor フォルダ ビューへのブラウザ ナビゲーションを使用可能にする
clientCaps Internet Explore でサポートされている機能、および要求に応じてブラウザ コンポーネントをインストールする方法に関する情報提供
download ファイルのダウンロード方法、およびダウンロード完了後のコールバック機能の通知方法を提供
homePage ユーザーのホーム ページについての情報を含む
httpFolder フォルダ ビューへのブラウザ ナビゲーションを使用可能にするスクリプト機能を含む
saveFavorite 現在のページの状態をお気に入りに追加した際、そのページを保存する
saveHistory ユーザーが別のページに移動する際、現在のページの状態をお気に入りに追加して保存する
saveSnapshot フォームの値、スタイル、ダイナミックとしてアップロードしたコンテント、およびスクリプト変数値などのページ情報を、ローカルに保存した際に保持する
userData データを XML ストレージに記述してセッション情報を保持する

動作の名前および #default#BehaviorName を url 引数の値として使用する事により、ビルトインの動作を参照します。次はその例です。

<HTML>
<TITLE>ビルトインの動作デモ</TITLE>
<HEAD>
<STYLE>
   .saveFavorite {behavior:url(#default#savefavorite)}
</STYLE>
</HEAD>
<BODY>
<INPUT class=saveFavorite type=text width=35 value="これはテキストボックスです。">
</BODY>
</HTML>

ビルトインの動作の詳細については、第 9 章「カスタム クラスとオブジェクト」、Microsoft Site Builder Workshop Web サイトの Component Development トピック http://www.asia.microsoft.com/japan/sitebuilder/default.htm、および DHTML の動作トピック http://www.asia.microsoft.com/japan/sitebuilder/default.htm を参照してください。

表示: