HTML URL コーディング リファレンス マニュアル
URL - 統一資源ロケータ
WebブラウザはURLを使用してWebサーバーからページを要求します。
URLはウェブページのアドレスです。例えば: https://www.japanitguide.com
URL コーディング
URLはASCII文字セットのみを使用してインターネットを通じて送信されます。
URLにはしばしばASCIIセット以外の文字が含まれるため、URLは有効なASCII形式に変換される必要があります。
URLコーディングは、非ASCII文字を置き換えるために、"%"の後に続く2桁の16進数を使用します。
URLにはスペースを含めることはできません。URLコーディングでは、通常、スペースを置き換えるために"+"を使用します。
試してみましょう
以下の「送信」ボタンをクリックすると、ブラウザは入力内容を送信する前にURLエンコードします。サーバー上のページには受信した入力が表示されます。
他の文字を入力して、もう一度送信ボタンをクリックしてみてください。
URL コーディング関数
JavaScript、PHP、ASPはすべて、文字列をURLエンコードするための関数を提供しています。
JavaScript
JavaScriptでは、encodeURI()関数を使用します。以下に例を示します:
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>URL エンコードデモ</title>
<script>
function encodeURL() {
// テキスト入力から値を取得
var text = document.getElementById("textInput").value;
// エンコードされたURLを取得
var encodedText = encodeURIComponent(text);
// 結果を表示
document.getElementById("result").innerText = "エンコードされたURL: " + encodedText;
}
</script>
</head>
<body>
<h1>URL エンコードデモ</h1>
<label for="textInput">テキストを入力してください:</label>
<input type="text" id="textInput" placeholder="テキストを入力">
<button onclick="encodeURL()">URL エンコード</button>
<p id="result"></p>
</body>
</html>
PHP
PHPでは、rawurlencode()関数を使用します。以下に例を示します:
echo rawurlencode("Hello Günter");ASP
ASPでは、Server.URLEncode()関数を使用します。以下に例を示します:
<% Dim str str = "Hello Günter" Response.Write(Server.URLEncode(str)) %> 注: JavaScript 関数はスペースを%20にエンコードします。
URL コーディング 参考表
| 文字 | URL エンコード値 |
|---|---|
| スペース | %20 |
| ! | %21 |
| # | %23 |
| $ | %24 |
| % | %25 |
| & | %26 |
| ' | %27 |
| ( | %28 |
| ) | %29 |
| * | %2A |
| + | %2B |
| , | %2C |
| - | %2D |
| . | %2E |
| / | %2F |
| 0 | %30 |
| 1 | %31 |
| 2 | %32 |
| 3 | %33 |
| 4 | %34 |
| 5 | %35 |
| 6 | %36 |
| 7 | %37 |
| 8 | %38 |
| 9 | %39 |
| : | %3A |
| ; | %3B |
| < | %3C |
| = | %3D |
| > | %3E |
| ? | %3F |
| @ | %40 |
| A | %41 |
| B | %42 |
| C | %43 |
| D | %44 |
| E | %45 |
| F | %46 |
| G | %47 |
| H | %48 |
| I | %49 |
| J | %4A |
| K | %4B |
| L | %4C |
| M | %4D |
| N | %4E |
| O | %4F |
| P | %50 |
| Q | %51 |
| R | %52 |
| S | %53 |
| T | %54 |
| U | %55 |
| V | %56 |
| W | %57 |
| X | %58 |
| Y | %59 |
| Z | %5A |
| [ | %5B |
| \ | %5C |
| ] | %5D |
| ^ | %5E |
| _ | %5F |
| ` | %60 |
| a | %61 |
| b | %62 |
| c | %63 |
| d | %64 |
| e | %65 |
| f | %66 |
| g | %67 |
| h | %68 |
| i | %69 |
| j | %6A |
| k | %6B |
| l | %6C |
| m | %6D |
| n | %6E |
| o | %6F |
| p | %70 |
| q | %71 |
| r | %72 |
| s | %73 |
| t | %74 |
| u | %75 |
| v | %76 |
| w | %77 |
| x | %78 |
| y | %79 |
| z | %7A |
| { | %7B |
| | | %7C |
| } | %7D |
| ~ | %7E |
Q&A
Q: なぜURLがエンコードされる必要がありますか？
A: URLにはASCII文字以外の文字が含まれることが多いため、ASCII形式に変換してインターネット上で正しく送信する必要があります。
Q: URLエンコードでスペースはどのように表されますか？
A: スペースは%20または+としてエンコードされます。
Q: JavaScriptでURLエンコードを行うための関数は何ですか？
A: JavaScriptでURLエンコードを行うには、encodeURI()またはencodeURIComponent()関数を使用します。