2006年09月03日
川俣晶の縁側ソフトウェア技術雑記total 9555 count

VisualStudio 2005で、ASP.NET抜きのクライアント側JavaScriptコードをデバッグ実行する方法

Written By: 川俣 晶連絡先

 ASP.NETがAjaxベースで動作して、ページ遷移せずにイベントをサーバ側で処理できる素敵な未来の話は歓迎するとして、未だその未来に達していない目の前の現状についての話です。

 ごくストレートにAjaxプログラムを開発する場合、それはクライアント側のJavaScriptコードとサーバ側のコードが直接的に絡まないで別個に動くことを意味します。これが何を意味するのかというと、たとえサーバ側技術にASP.NETを利用した場合であっても、クライアント側のデバッグの際には「ASP.NETに関わりを持たない単なるJavaScript埋め込みHTMLファイル」の中にブレークポイントを置いて実行する必要が出たりするわけです。

 ところが、MSDNでVisualStudio 2005のJScriptのデバッグのあたりを調べても、コマンドラインプログラムのケースと、ASP.NETのケースしか説明が見つかりませんでした。

 しかし、ページ閲覧中にJavaScriptのエラーが出た場合はプロセスにアタッチしてトレース実行できるのだから、直接デバッグに入る方法があるはずだと思って試行錯誤して割り出しました。

 ちなみに、よくある話題のように思いますが、軽く検索しても出てこなかったので、ここにメモっておきます。

クライアント側JavaScriptコードにブレークポイントを設定して止める手順 §

 表題通りの結果を得るための(たぶん最短の)手順を、プロジェクト作成の段階から以下にまとめます。

  • メニュー: ファイル→新規作成→Webサイト
  • 空のWebサイトを選択、場所を適切に設定後、OKをクリック (言語は何でも構わないVisual BasicでもC#でも)
  • メニュー: Webサイト→新しい項目の追加
  • HTMLページを選択し、名前を適切に書き直して「追加」をクリック
  • 下記のコード例のようにJavaScriptコードを書き足す
  • 適当な行(alertの行等)にキャレットを置いてF9キーを押してブレークポイント追加
  • F5キー(実行)を押す
  • Web.configを追加してデバッグを有効にするか、という質問が出るので、「……有効にする」を選択した状態でOKをクリック
  • IEが開き、プログラムが実行される
  • 動作が中断され、VisualStudio 2005上でブレークポイントを設定した箇所で止まっていることが分かる
  • この時点で変数の名前の上にマウスポインタを当てると、変数値を見ることができる
  • F5キーを押して継続実行させる (プログラムが動作する)
  • IEを閉じると、デバッグセッションも終了する

コード例 §

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >

<head>

    <title>無題のページ</title>

<script language="javascript" type="text/javascript">

function testjs()

{

    var a=1;

    var b=2;

    var c=a+b;

    alert(c);

}

</script>

</head>

<body onload="testjs();">

</body>

</html>

Facebook

キーワード【 川俣晶の縁側ソフトウェア技術雑記
【技術雑記】の次のコンテンツ
2006年
09月
05日
VS.Php 2.0でリンク先PHPページをデバッグする方法
3days 0 count
total 5303 count
【技術雑記】の前のコンテンツ
2006年
09月
01日
ソフト冒険記・Visual Studio 2005でPHP開発を行うVS.Php 2.0~使って簡単、デバッグも可能!!
3days 0 count
total 5167 count

このコンテンツを書いた川俣 晶へメッセージを送る

[メッセージ送信フォームを利用する]

メッセージ送信フォームを利用することで、川俣 晶に対してメッセージを送ることができます。

この機能は、100%確実に川俣 晶へメッセージを伝達するものではなく、また、確実に川俣 晶よりの返事を得られるものではないことにご注意ください。

このコンテンツへトラックバックするためのURL

https://mag.autumn.org/tb.aspx/20060903165322
サイトの表紙【技術雑記】の表紙【技術雑記】のコンテンツ全リスト 【技術雑記】の入手全リスト 【技術雑記】のRSS1.0形式の情報このサイトの全キーワードリスト 印刷用ページ

管理者: 川俣 晶連絡先

Powered by MagSite2 Version 0.36 (Alpha-Test) Copyright (c) 2004-2021 Pie Dey.Co.,Ltd.