JavaScript および Web コンテキスト管理

JavaScript には、HTML 技術だけでは達成できないことを行うための Web 開発者向けオプションが多数用意されているため、単純に HTML を解析するだけでは Silk Performer 再生エンジンを使用してシミュレートできません。 つまり、JavaScript がコンテキスト喪失の原因となります。

多くの場合、JavaScript のアクションから発生する HTTP リクエストは WebPageLink や WebPageSubmit 関数の観点では説明できないため、Recorder はコンテキストのない関数を生成する必要があります。

このトピックではいくつかの例を示しますが、発生する可能性のあるすべてのシナリオをすべて網羅しているわけではありません。

JavaScript リダイレクトと再ロード

これは、JavaScript を使用して別の URL にリダイレクトし、これにより状態情報 (負荷分散、セッション ID など) が導入される例です。 

<html>
  <head>
    <title>Login</title>
  </head>
  <body
    onload="location='http://www4.company.com/usr/6543/login.asp'">
  </body>
</html>

JavaScript によってロードされる埋め込みオブジェクト

この例では、JavaScript を使用して埋め込みオブジェクトをロードする方法について説明します。 Silk Performer HTML パーサーはこれらの URL を埋め込みオブジェクトとして表示しないため、Recorder でスクリプト関数を生成しなければなりません。生成しない場合は、再生エンジンによってイメージがダウンロードされません。

これらの埋め込みオブジェクトの URL は相対的に指定されることにも注意してください。 ブラウザは相対 URL が含まれる HTML ドキュメントの基本 URL を使用して、これらの相対 URL を絶対 URL に解決します。 つまり、その結果生じる URL には動的情報が含まれます (http://www4.company.com/usr/6543/right_arrow.gif など)。 

<html>
  <head>
    <title>Login</title>
  </head>
  <body onload="PreLoadImages('right_arrow.gif', 'left_arrow.gif', 'up_arrow.gif', 'down_arrow.gif')">
  </body>
</html>

動的 HTML

document.write(…) JavaScript 関数により、クライアント側で HTML コードを動的に変更できます。 AD サーバーでは一般的にこの技術を使用します。

次に例を示します。 

document.write('<script language=javascript
  src="http://ads.com/ad/offer.asp?date=' +
       escape(date) + '"></scr'+'ipt>');

JavaScript によるフォーム送信

JavaScript では、次の操作により、送信前に HTML フォームを変更できます。

  • フォーム フィールド値の変更 (非表示フィールドを含む)
  • フォーム フィールドの追加
  • フォーム フィールドの削除
  • フォーム フィールドの名前の変更 (フォーム フィールドを削除し、別のフィールドを同じ位置に追加するのと同じ操作)
  • アクション URL を変更する

サンプル HTML コード (フォーム フィールド名を変更)： 

<form name="tabform"
      action="/cgi-bin/tabgui.asp"
      method="POST"
      target=_self>
  <input type=hidden name="session" value="6543">
  <input type=hidden name="tabevent" value="">
  <input type=hidden name="tabeventparam" value="">
</form>
<a href="JavaScript:selectTab('3')">Stock Watch List</a>

function selectTab(tabIndex)
{
  // change value of field #2
  document.tabform.elements[1].value = "select";
  // change name of field #3, originally "tabeventparam"
  document.tabform.elements[2].name = "TabIndex";
  // change value of field #3, now "TabIndex"
  document.tabform.elements[2].value = tabIndex;
  document.tabform.submit();
}

上記の例は、JavaScript がフォームを送信する方法を表しています。 HTML でのフォーム定義は、送信前に JavaScript が操作する単なるテンプレートです。 2 番目のフィールドの値 (「tabevent」、インデックス 1) は「select」に変更され、3 番目のフィールドの名前 (「tabeventparam」、インデックス 2) は「TabIndex」に変更され、値は「3」に変更されます。

次の例は、JavaScript を使用してフォームのアクション URL を変更する方法を表しています。 

function SubmitSearch(linkUrl)
{
  document.searchForm.action = linkUrl;
  document.searchForm.submit();
}
..
<form name="searchForm"
      method="POST"
      target=_self>
  <input type=input name="searchString" value="">
  <input type=hidden name="BV_SessionID"
                     value="@@@@1245417051.1003814911@@@@">
</form>
<a href="JavaScript:SubmitSearch('http://my.server.com/search.asp')">
   Search this site</a>
<a href="JavaScript:SubmitSearch('http://my.mirror.com/search.asp')">
   Search mirror site</a>
親トピック: Recorder がコンテキストを失う状況