ホームページの問題点とサーバ処理の基本と必要性
サーバ処理について説明します。
下記のように、商品一覧を表形式で出力しているホームページがあるとします。
商品コード | 商品名 | 単価 |
---|---|---|
1 | ペン | 100 |
2 | ノート | 100 |
サーバ処理でhtmlファイルをそのまま出力している場合は、新たに商品を追加したり、商品の値段が変わるごとに、htmlファイルを書き換えなければなりません。
<!DOCTYPE HTML>
<html>
<head>
<title>商品マスタ</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
</head>
<body>
<table class="common-table">
<caption>商品マスタ</caption>
<thead>
<tr>
<th>商品コード</th>
<th>商品名</th>
<th>単価</th>
</tr>
</thead>
<tbody>
<!-- ↓この部分を商品の状態によって随時更新しなければならない -->
<tr>
<td>1</td>
<td>ペン</td>
<td>100</td>
</tr>
<tr>
<td>2</td>
<td>ノート</td>
<td>200</td>
</tr>
<!-- ↑この部分を商品の状態によって随時更新しなければならない -->
</tbody>
</table>
</body>
</html>
商品データの件数分、明細の箇所を出力するように、サーバ側でプログラムを作成しておけば、商品の状態に応じてhtml
ファイルを変更することなく、最新の商品の状態を表示することができます。
htmlファイルでは、サーバでプログラムを実行できません。
- サーバに置いてあるhtmlファイルをaspファイルなど、プログラムを実行できるファイルに置き換えます。
- サーバ側でプログラムを実行し、レスポンスするhtmlデータを作成します。
- レスポンスされたあとは、htmlの場合と同じように、ブラウザに表示します。
サーバ側のプログラミング言語にはいろいろなものがありますが、今回はasp
を使用して説明します。
aspの基本的な文法でasp
の基本的な文法について説明します。
データベースから商品を取得して出力するサーバ処理を組み込んだaspファイルは下記のようになります。
<!DOCTYPE HTML>
<html>
<head>
<title>商品マスタ</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
</head>
<body>
<% response.write("テスト:サーバ処理で出力") %>
<table class="common-table">
<caption>商品マスタ</caption>
<thead>
<tr>
<th>商品コード</th>
<th>商品名</th>
<th>単価</th>
</tr>
</thead>
<tbody>
<%
dim Conn,Rs,strSql
set Conn = Server.CreateObject("ADODB.Connection")
set Rs = Server.CreateObject("ADODB.Recordset")
Conn.Open "接続文字列"
strSql = "SELECT 商品コード, 商品名, 単価 FROM 商品マスタ"
Rs.ActiveConnection = Conn
Rs.Open strSql,Conn,3,1
If Not Rs.EOF Then
Do While Not Rs.EOF
'1件ずつ出力する
response.write("<tr><td>" & Rs("商品コード") & "</td><td>" & Rs("商品名") & "</td><td>" & Rs("単価") & "</td>")
Rs.MoveNext
Loop
End If
Rs.Close
Conn.Close
%>
</tbody>
</table>
</body>
</html>
サーバ処理を行い、実際にレスポンスされるhtmlは下記のようになります。
<!DOCTYPE HTML>
<html>
<head>
<title>商品マスタ</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
</head>
<body>
テスト:サーバ処理で出力
<table class="common-table">
<caption>商品マスタ</caption>
<thead>
<tr>
<th>商品コード</th>
<th>商品名</th>
<th>単価</th>
</tr>
</thead>
<tbody>
<tr><td>1</td><td>ペン</td><td>100</td>
<tr><td>2</td><td>ノート</td><td>200</td>
</tbody>
</table>
</body>
</html>