ホームページの問題点とサーバ処理の基本と必要性

サーバ処理について説明します。

下記のように、商品一覧を表形式で出力しているホームページがあるとします。

商品マスタ
商品コード商品名単価
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>

関連記事

  • WEBアプリの基本的な仕組みと考え方

    WEBアプリの基本的な仕組みを説明します。まずは、WEBアプリで頻繁に登場する用語の説明を交えながら、ホームページの仕組みについて復習します。


  • 登録時にクライアントとサーバでデータの入力チェックを行う方法

    classic aspで登録時にクライアントとサーバでデータの入力チェックを行う方法について説明します。誤って不正なデータを登録してしまうのを防ぐために、ユーザが入力した内容をチェックする処理を実装し...


  • ホームページの問題点とサーバ処理の基本と必要性

    サーバ処理でhtmlファイルをそのまま出力している場合は、データが変わるごとに、htmlファイルを書き換えなければなりません。


  • ホームページの基本的な仕組みと考え方

    ホームページとWEBアプリケーションの違いは、ホームページとは基本的に作成者が一方的に情報を公開するサイトのことを差します。


  • GETとPOSTの違い

    GETとPOSTの違いについて説明します。formのmethod属性には、GETとPOSTの2種類があります。method属性では送信(リクエスト)の方法を指定しています。何も指定しない場合はGETで...


  • サーバ処理でクライアントからの情報を取得する方法

    classic aspでサーバ処理でクライアントからの情報を取得する方法について説明します。クライアント側からサーバ側への送信処理は実装できたので、次はサーバ側でデータの登録を行う処理を実装します。


  • cssで三角形を表示する方法

    画像を使わずに、cssでスタイルを指定するだけで三角形を表示させる方法を紹介します。三角形を表示させるにはborder(枠線)を使用します。縦と横が重なる部分は、どちらかのスタイル(青か赤)を優先させ...


  • 唐松岳・八方尾根に日帰り登山レビュー

    唐松岳に日帰り登山に行ってきました。登山道は森の中を歩く箇所は少なく、ほとんど開けた場所で、風が下から吹いてきてとても気持ちが良いです。途中までリフトが使えることや、道がとても歩きやすいことから、唐松...


  • canvasのアニメーションで軌跡・残像・フェードアウトを表現する

    アニメーションを応用し軌跡や残像を残したり。フェードアウトする方法を紹介します。軌跡を残すためにはクリアする処理をなくす必要があります。クリアをしなければ、前回描画した状態に対して追記する形になるため...


  • LaravelのElixirでbrowserSyncを導入する

    LaravelのElixirでビルド後にブラウザを自動で再表示するために、browserSyncを導入しました。browserSyncをするためには「laravel-elixir-browsersyn...