【VBScript】HelloWorldを表示させる



# 目次

[1. はじめに](#1はじめに)
[2. 環境](#2環境)
[3. 今回のゴール](#3今回のゴール)
[3-1. 書籍の通りにやってみる](#3-1書籍の通りにやってみる)
[3-2. 手直しする](#3-2手直しする)
[3-2-1. 小なりと大なりが表示されない](#3-2-1小なりと大なりが表示されない)
[3-2-2. 改行されない](#3-2-2改行されない)
[3-2-3. おまけ](#3-2-3おまけ)
[4. まとめ](#4まとめ)
[5. 最後に](#5最後に)


# 1.はじめに

現在、以下の書籍を学習しています。

https://www.amazon.co.jp/ASP%E3%81%AB%E3%82%88%E3%82%8BWeb%E3%82%A2%E3%83%97%E3%83%AA%E3%82%B1%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3%E3%82%B9%E3%83%BC%E3%83%91%E3%83%BC%E3%82%B5%E3%83%B3%E3%83%97%E3%83%AB-%E8%A5%BF%E6%B2%A2-%E7%9B%B4%E6%9C%A8/dp/4797318228

2001年出版と、なんと20年以上の書籍です。

現在だと技術的に非推奨の書き方をしている箇所があるなど、書籍通りの動きにならないことがあります。今回はその中からHello Worldの表示についてまとめていきたいと思います。


# 2.環境

- windows10 バージョン21H2
- Microsoft-IIS 10.0
- ASP 5.8（16384）


# 3.今回のゴール

HTMLのコードをVBScriptで出力しているイメージです。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/689555/4804e1d5-3fb6-783a-76ea-28f66c70acf2.png" width=50%>


## 3-1.書籍の通りにやってみる

書籍の通りにやってみると、以下の状態になります。

▼コード（`Response.Write`で出力しています）

```vb
<%@ Language = VBScript codepage = 65001 %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<%
Response.Write "<html>" & vbnewline
Response.Write "<head>" & vbnewline
Response.Write "<title>Hello World</title>" & vbnewline
Response.Write "</head>" & vbnewline
Response.Write "<body>" & vbnewline
Response.Write "Hello World" & vbnewline
Response.Write "</body>" & vbnewline
Response.Write "</html>" & vbnewline
%>
</body>
</html>
```

▼上記のコードで実行すると…
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/689555/3a8c82f8-d975-0cc7-a722-9081aa23974b.png" width=50%>
8行表示されるはずのコードが、「Hello World」しか表示されませんでした。


## 3-2.手直しする

### 3-2-1.小なりと大なりが表示されない

今回表示がされなかったところは、`<head>`などいずれも`<>`を使用している項目でした。

[【HTML】&lt; と &gt; の意味、略称の正式名称、違いと覚え方、属性値での利用](https://marycore.jp/prog/css/html-lt-gt/)より引用
> 本来、`<`, `>`はHTMLの特殊文字という扱いとなっているため、ブラウザ上でそのまま表示させることができません。そのため、これらの不等号を文章内で扱う場合には`&lt;`, `&gt;`による文字実体参照（実体参照）を用いる必要があります。
> 

他にも`&`をHTMLで表示したい場合`&amp;`を用いるなど、そのまま表示させるにはルールが決まっているようです。

https://ja.wikipedia.org/wiki/%E6%96%87%E5%AD%97%E5%8F%82%E7%85%A7

以下のように修正し、再度画面に出力しました。
| 項目 | 修正後 | 
|:-----------|:-----------|
| <| `&lt;` | 
| >| `&gt;` |
|`<html>`| `&lt;html&gt;` |

▼修正後のコード

```vb
<%@ Language = VBScript codepage = 65001 %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<%
Response.Write "&lt;html&gt;" & vbnewline
Response.Write "&lt;head&gt;" & vbnewline
Response.Write "&lt;title&gt;Hello World&lt;/title&gt;" & vbnewline
Response.Write "&lt;/head&gt;" & vbnewline
Response.Write "&lt;body&gt;" & vbnewline
Response.Write "Hello World" & vbnewline
Response.Write "&lt;/body&gt;" & vbnewline
Response.Write "&lt;/html&gt;" & vbnewline
%>
</body>
</html>
```

▼画面に出力
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/689555/d9ae84d9-bcec-4ffb-d83a-dca3769d8f42.png" width=80%>
無事に画面に出力することができました！
ですが、改行ができていないので修正していきます。

### 3-2-2.改行されない

`vbnewline`を&でつなげることで改行をしたかったのですが、少しスペースが開いただけでした。

まず、以下を参考に`vbCrLf`に置き換えてみました。

:::note 
実行環境がWindowsであるため、`vbCrLf = vbNewLine`と解釈しました。
リンクはVBAですが、文法はVBScriptとほとんど同じです。
:::

https://tooljp.com/windows/chigai/html/Windows/vbCrLf-vbLf-vbCr-vbnewline-chigai.html

画面に出力したところ、特に変化なしでした。

次に、以下を参考にReplace関数を使って置換した文字列を返すようにします。

https://senotepad.exblog.jp/17837710/

:::note 
Replace関数は`Replace(置換する文字列(A)を含む文字列式,A,B)`とすることで「Aを含む文字列のAをBに置換する」となります。
:::

```vb
'<html> & vbnewlineの場合
"&lt;html&gt;" & vbnewline
'Replace関数で置換
Replace("&lt;html&gt;" & vbnewline, vbnewline, "<br>")
'画面出力時
Response.Write(Replace("&lt;html&gt;" & vbnewline, vbnewline, "<br>"))
```

https://www.kanaya440.com/contents/script/vbs/function/string/replace.html

こちらを行うことで、改行することができました。

▼修正後のコード

```vb
<%@ Language = VBScript codepage = 65001 %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<%
Response.Write(Replace("&lt;html&gt;" & vbnewline, vbnewline, "<br>"))
Response.Write(Replace("&lt;head&gt;" & vbnewline, vbnewline, "<br>"))
Response.Write(Replace("&lt;title&gt;Hello World&lt;/title&gt;" & vbnewline, vbnewline, "<br>"))
Response.Write(Replace("&lt;/head&gt;" & vbnewline, vbnewline, "<br>"))
Response.Write(Replace("&lt;body&gt;" & vbnewline, vbnewline,  "<br>"))
Response.Write(Replace("Hello World" & vbnewline, vbnewline, "<br>"))
Response.Write(Replace("&lt;/body&gt;" & vbnewline, vbnewline, "<br>"))
Response.Write("&lt;/html&gt;")
%>
</body>
</html>

```

▼画面に出力
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/689555/cd13d533-9dc8-8856-880e-f92a210747b1.png" width=80%>

### 3-2-3.おまけ

やりたいことはできたのですが、「まとめて置換できないかな？」ということが浮かびました。

そこで変数を宣言して、最後に変換するようにします。

```vb
<%@ Language = VBScript codepage = 65001 %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>hello2</title>
</head>
<body>
<%
'変数を宣言
Dim sContents
' & でまとめて代入
sContents = "&lt;html&gt;" & vbnewline & "&lt;head&gt;" & vbnewline _
& "&lt;title&gt;Hello World&lt;/title&gt;" & vbnewline & "&lt;/head&gt;"& vbnewline _
& "&lt;body&gt;" & vbnewline & "Hello World" & vbnewline _
& "&lt;/body&gt;" & vbnewline & "&lt;/html&gt;"
sContents = Replace(sContents, vbnewline, "<br>")
Response.Write(sContents)
%>
</body>
</html>
```

https://atmarkit.itmedia.co.jp/ait/articles/0607/06/news114_2.html

今回は`sContents`がとても長いため、`_`を挟んで1行の処理を改行して見やすくしています。

https://bayashita.com/p/entry/show/68

以上でゴールの画面表示をすることができました。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/689555/cd13d533-9dc8-8856-880e-f92a210747b1.png" width=80%>

# 4.まとめ

今回はHTML周りのところでうまくいっていない2箇所について修正していきました。

ASPは、要求に従ってサーバ上でHTMLを生成して、クライアントのブラウザでは出来上がったHTMLファイルを表示しています。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/689555/85f3ae4b-61aa-af9b-6221-0401e6470476.png" width=80%>


サーバでの処理と表示のための処理について、それぞれ何が必要なのか意識していきたいと思います。

# 5.最後に

とても古くなってきている技術なのでそのまま当てはまる方は少数派かもしれませんが、同じ現象が起きている方の参考になれば幸いです。

読んで頂き、ありがとうございました。