WebStorm 2025.3 ヘルプ

HTTP クライアント変数

HTTP リクエストを作成する場合、変数を使用してその要素をパラメーター化できます。変数は、リクエストのホスト、ポート、パスの値、クエリパラメーターまたは値、ヘッダー値、リクエストの本文内または外部ファイルで使用される任意の値を保持できます。

リクエスト内で変数を使用する

  • 変数を {{variable}} として二重波括弧で囲みます。

変数名には、文字、数字、アンダースコアシンボル _、ハイフンシンボル -、またはドットシンボル . を含めることができます (変数名のドットについては下記の注意を参照してください)。

変数型

HTTP クライアントにはいくつかの種類の変数があります。これらはスコープと優先度が異なります。変数名が競合する場合は、リストの上位にある変数の値が使用されます。

  • 環境変数は専用の環境ファイルで定義され、任意の .http ファイルで使用できます。名前が競合する場合は、パブリック変数がプライベート変数よりも優先されます。

    client.variables.environment または request.environment を使用してアクセスします。

  • グローバル変数は応答ハンドラーと事前リクエストスクリプトで定義されています。

    client.variables.global または client.global を使用してアクセスします。

  • インプレース変数は .http ファイル内で定義され、同じファイル内でのみ使用できます。

    client.variables.file を使用してアクセスします。

  • リクエストごとの変数はリクエストの前に定義され、後続の単一のリクエスト内でのみ使用できます。

    client.variables.request または request.variables を使用してアクセスします。

  • さらに、HTTP クライアントは組み込み動的変数に動的に生成された値を提供します。これらの変数には予約名が付いています。

異なる型の変数の操作を簡素化するため、HTTP クライアントは単一のアクセスポイント client.variables を提供します。このアクセスポイントをリクエスト前処理スクリプトやレスポンスハンドラースクリプトで使用することで、すべての変数スコープにアクセスできます。client.global、request.environment、request.variables などの既存のアクセスポイントも保持されます。

環境変数

環境変数を使用すると、プロジェクト内に一連の環境定義を格納できます。例: リクエストでホスト名を明示的に指定する代わりに、さまざまな環境で {{host}} 変数を作成できます。開発環境ではローカルホスト名、本番環境ではパブリックホスト名です。次に、現在の .http ファイルエディターの上部にある実行リストを使用して、環境を選択できます。

  • 環境がありません : このオプションを選択すると、現在のファイルでリクエストを実行するときに環境は使用されません。リクエストに変数が含まれていない場合は、これを選択します。

  • 環境名（本番環境や開発環境など）: 選択した環境は、現在のファイル内のすべてのリクエストに使用されます。The Run button をクリックしたときに環境を選択する必要はありません。これは、同じ環境で複数のリクエストを実行し、リクエストを実行するたびにそれを選択したくない場合に役立ちます。

  • <実行前に環境を選択する> : このオプションを選択すると、The Run button をクリックするたびに環境を選択する必要があります。これは、環境を頻繁に切り替え、実行ごとに明示的に環境を選択して、必要な環境で要求を確実に実行する場合に便利です。

Run request: select environment

選択した環境は、リクエストの構造を見る、ブラウザーでのリクエストのオープン、リクエストの実行、および実行 / デバッグ構成の作成の場合に、デフォルトの環境として使用されます。

環境変数を定義する

環境変数は環境ファイルで定義されます。

  1. リクエストのエディターパネルの上部にある実行リストで、環境を追加する場所を選択します。

    • 環境を公開する場合は、環境を Public ファイルに追加…を選択します。これにより、http-client.env.json ファイルに環境が追加されます。このファイルには、ホスト名、ポート、クエリパラメーターなどの一般的な変数を含めることができ、プロジェクトと一緒に配布することを目的としています。

    • 環境をプライベートにする場合は、環境を Private ファイルに追加…を選択します。これにより、環境が http-client.private.env.json ファイルに追加されます。このファイルには、パスワード、トークン、証明書、その他の機密情報が含まれる場合があります。http-client.private.env.json ファイルで指定された変数の値は、パブリック環境ファイルの値をオーバーライドします。

  2. 作成したファイルに目的の変数を入力します。

    次のサンプル http-client.env.json 環境ファイルは、開発と本番の 2 つの環境を定義しています。追加の http-client.private.env.json ファイルは機密認証データを保持します。

    { "development": { "host": "localhost", "id-value": 12345, "username": "", "password": "", "my-var": "my-dev-value" }, "production": { "host": "example.com", "id-value": 6789, "username": "", "password": "", "my-var": "my-prod-value" } }
    { "development": { "username": "dev-user", "password": "dev-password" }, "production": { "username": "user", "password": "password" } }

    HTTP リクエストの例は次のとおりです。

    GET http://{{host}}/api/json/get?id={{id-value}} Authorization: Basic {{username}} {{password}} Content-Type: application/json { "key": "{{my-var}}" }

    WebStorm では、リクエストを実行する前に、リクエストのエディターパネルの上部にある実行リストを使用して実行環境を選択できます。

    選択に応じて、結果の要求は次のいずれかになります。

    GET http://localhost/api/json/get?id=12345 Authorization: Basic dev-user dev-password Content-Type: application/json { "key": "my-dev-value" }
    GET http://example.com/api/json/get?id=6789 Authorization: Basic user password Content-Type: application/json { "key": "my-prod-value" }

リクエストの実行時に変数が解決されない場合、WebStorm は通知を表示し、別の実行環境をすばやく作成、更新、選択できるようにします。

Unresolved Variable in HTTP request notification

複数の環境ファイルを管理する

プロジェクトには、HTTP リクエストファイルと対応する環境ファイルを含む複数のディレクトリが存在する場合があります。この場合、リクエストの環境を選択する際に次のセクションを使用できます。

  • ファイルに対しては、現在のディレクトリと親ディレクトリに保存されている環境を示します。

    このリストから環境を選択すると、HTTP クライアントは現在のディレクトリに保存されているファイル (パブリックおよびプライベート) 内でその環境を見つけようとします。この環境にファイルがない場合は、親ディレクトリをチェックします。

  • プロジェクト全体からは、プロジェクトの他のすべての場所 (現在のディレクトリと親ディレクトリを除く) に保存されている環境を示します。これらのディレクトリのファイルに、ファイルに対してセクションの環境と同じ名前の環境が含まれている場合、その環境はリストに表示されません。

    プロジェクト内のどこにでも表示されるようにしたい場合は、環境に一意の名前を付けることができます。

HTTP Client environments

これを例で説明してみましょう。次のようなプロジェクト構造があるとします。

root/http-client.env.json # public file with 'dev' environment and 'host' variable root/service1/http-client.private.env.json # private file with 'dev' environment and "key": "myKey1" variable root/service2/http-client.private.env.json # private file with 'dev' environment and "key": "myKey2" variable

service1 ディレクトリに保存されている .http ファイルは、dev 環境を選択すると、key 変数の myKey1 値を使用します。service2 ディレクトリに保存された .http ファイルは、key 変数の myKey2 値を使用します。

プライベートファイルに host 変数が含まれている場合、プライベートファイルはパブリックファイルよりも優先されるため、.http ファイルはその値を使用します。それ以外の場合は、パブリックファイルの値が使用されます。

インプレース変数

インプレース変数のスコープは、それが宣言された .http ファイルです。同じファイル内の複数のリクエストで同じ変数を参照する場合は、インプレース変数を使用します。

インプレース変数を作成するには、HTTP メソッドセクションの上に「@ 」と入力し、その後に変数の名前を入力します。例:

@myhost = example.org GET {{myhost}}/users ### GET {{myhost}}/stats

リクエストごとの変数

request.variables.set(variableName, variableValue) メソッドを使用して、HTTP 要求で使用される変数の値を設定できます。HTTP リクエストの上に、{% ... %} でラップされたプレリクエストスクリプトを記述します。例:

< {% request.variables.set("firstname", "John") %} GET http://example.org/{{firstname}}

プレリクエストスクリプトで定義された変数は、スクリプトに続く単一のリクエスト内でのみ使用できます。

変数の初期化コンテキストアクション (Alt+Enter) を使用すると、インプレース変数または環境変数をすばやく追加したり、リクエスト前ハンドラースクリプトで変数を初期化したりできます。

Initialize variable intention action

プレリクエストスクリプトでは、HTTP クライアント暗号 API を使用して、SHA-1、SHA-256、SHA-512、MD5 などの暗号化ハッシュ関数に基づいて HTTP 署名を生成し、変数としてリクエストに渡すこともできます。例:

< {% const signature = crypto.hmac.sha256() .withTextSecret(request.environment.get("secret")) // get variable from http-client.private.env.json .updateWithText(request.body.tryGetSubstituted()) .digest().toHex(); request.variables.set("signature", signature) const hash = crypto.sha256() .updateWithText(request.body.tryGetSubstituted()) .digest().toHex(); request.variables.set("hash", hash) %} POST https://httpbin.org/post X-My-Signature: {{signature}} X-My-Hash: {{hash}} Content-Type: application/json

動的変数

動的変数は、リクエストを実行するたびに値を生成します。それらの名前は $ で始まります:

  • $uuid または $random.uuid : 普遍的に一意の識別子を生成します (UUID-v4)

  • $timestamp : 現在の UNIX タイムスタンプを生成します

  • $isoTimestamp : UTC タイムゾーンの ISO-8601 形式で現在のタイムスタンプを生成します。

  • $randomInt : 0 〜 1000 のランダムな整数を生成します。

  • $random.integer(from, to) : from (両端を含む) と to (両端を含まない) の間のランダムな整数を生成します (たとえば、random.integer(100, 500))。パラメーターを指定しない場合は、0 ～ 1000 のランダムな整数が生成されます。

  • $random.float(from, to) : from (両端を含む) と to (両端を含まない) の間のランダムな浮動小数点数を生成します (たとえば、random.float(10.5, 20.3))。パラメーターを指定しない場合は、0 ～ 1000 のランダムな浮動小数点数が生成されます。

  • $random.alphabetic(length) : 長さ length (0 より大きい必要があります) の大文字と小文字のシーケンスを生成します。

  • $random.alphanumeric(length) : 長さ length (0 より大きい必要があります) の大文字と小文字、数字、アンダースコアのシーケンスを生成します。

  • $random.hexadecimal(length) : 長さ length (0 より大きい必要があります) のランダムな 16 進文字列を生成します。

  • $random.email : ランダムなメールアドレスを生成します。

  • $exampleServer : は、HTTP クライアントのみを使用してアクセスできる WebStorm 組み込み Web サーバーに置き換えられます。この変数は、GraphQL および WebSocket の例で使用されます。

より動的な変数

住所、色、会社名など、他の型のランダムデータを生成できます。HTTP クライアントは、Java 偽者(英語)ライブラリの次のクラス (およびパラメーターを必要としないメソッド) をサポートしています。

  • $random.address

  • $random.beer

  • $random.bool

  • $random.business

  • $random.ChuckNorris.fact

  • $random.code

  • $random.color

  • $random.commerce

  • $random.company

  • $random.crypto

  • $random.educator

  • $random.finance

  • $random.hacker

  • $random.idNumber

  • $random.internet

  • $random.lorem

  • $random.name

  • $random.number

  • $random.phoneNumber

  • $random.shakespeare

  • $random.superhero

  • $random.team

  • $random.university

使用可能な変数の提案を取得するには、「{{$random.}} 」と入力し始めます。

URL パラメーターや本文などのリクエスト部分で動的変数を使用します。

POST http://localhost/api/post?id={{$uuid}} { "time": {{$timestamp}}, "price": {{$random.integer(10, 1000)}}, }

事前リクエストハンドラースクリプトと応答ハンドラースクリプトでは、通常の JavaScript 変数と同様に、波括弧なしで使用します。例:

< {% const longUUID = $random.uuid request.variables.set("generatedQuery", longUUID) %} GET https://examples.http-client.intellij.net/get ?generatedQuery={{generatedQuery}} > {% client.log(`Today is ${$isoTimestamp}`) %}

システム環境変数

HTTP クライアントでは、オペレーティングシステムの環境変数を使用できます。

これらにアクセスするには、{{$env.ENV_VAR}} 構文を使用します。ここで、ENV_VAR は環境変数の名前です。事前リクエストハンドラースクリプトと応答ハンドラースクリプトでは、通常の JavaScript 変数と同様に、波括弧なしで使用します。例:

GET http://localhost:63345/{{$env.USER}} > {% const myUser = $env.USER client.log(myUser) %}

変数名の入力を開始すると、使用可能な変数の提案が表示されます。

System environment variable in HTTP Client

変数内のコレクションを反復処理する

環境変数および事前リクエストスクリプトで初期化される変数は、ID またはユーザー名のリストなどの要素のコレクションを表すことができます。このような変数が HTTP リクエストで使用されると、HTTP クライアントはこのリストの各要素に対して個別のリクエストを送信します。WebStorm は、このような変数に対して JSONPath 式もサポートしており、特定の要素または要素のサブセットにアクセスし、それぞれに対してリクエストを送信できます。

たとえば、ID によって書籍に関する情報を返すサーバーがある場合、JSON 配列 [1,2,3,4,5] を変数 id に割り当て、それを本文または URL 部分で使用できます。

< {% request.variables.set("id", [1,2,3,4,5]) %} GET http://localhost:8080/books/{{id}}

HTTP クライアントは、各リクエストのコレクションから後続の項目に変数を置き換えながら、5 つの連続したリクエストを送信します。

同様に、リクエスト本文でコレクションを使用することもできます。次の例では、HTTP クライアントは本文に異なる値を持つ 3 つのリクエストを送信します: name: Alice、name: Bob、name: Charlie

< {% request.variables.set("name", ["Alice", "Bob", "Charlie"]) %} GET http://localhost:8080/users Content-Type: application/json { "name": {{name}} }

JSONPath を使用すると、配列内の JSON オブジェクトの特定のパラメーターにアクセスすることもできます。例: 次のクエリでは、HTTP クライアントは、users という変数内のすべてのオブジェクトの各 name 値に対するリクエストを送信します。

変数で JSONPath を使いやすくするために、WebStorm は、既知の JSON オブジェクトパラメーターの補完、検証、ハイライトなどの JSONPath コーディング支援を提供します。JSONPath 言語は、動的変数を除くすべての HTTP クライアント変数 (二重の波括弧で囲まれている) に挿入されます。

GET http://localhost:8080/users/{{users[*].name}}
Iterate over collections in variables

事前リクエストスクリプトおよび応答ハンドラースクリプトのループ内の現在のインデックスを取得するには、request.iteration() メソッドを使用します。例: 0 は、配列の最初の項目が処理され、最初のリクエストが送信されていることを示します。

request.iteration() の例

### Use request.iteration() < {% request.variables.set("clients", [ // test data {"id": 1, "firstName": "George", "lastName": "Franklin", balance: 100}, {"id": 2, "firstName": "John", "lastName": "Doe", balance: 1500}, {"id": 3, "firstName": "Eduardo", "lastName": "Rodriquez", balance: 10} ]) %} POST https://examples.http-client.intellij.net/post Content-Type: application/json { "clientId": {{$.clients..id}}, "firstName": "{{$.clients..firstName}}", "lastName": "{{$.clients..lastName}}", "balance": "{{$.clients..balance}}" } > {% client.log(request.iteration()) // prints 0 for 1st request, 1 for 2nd, 2 for 3rd let current = request.variables.get("clients")[request.iteration()] client.test(`Account ${current.lastName} has initial balance ${current.balance}`, () => { let responseBalance = jsonPath(response.body, "$.json.balance") client.assert(responseBalance == current.balance) }) %}

事前リクエストスクリプトおよび応答ハンドラースクリプトのループ内でインデックスによって値を取得するには、request.templateValue(Integer) メソッドを使用します。

request.templateValue() の例

### Use templateValue < {% request.variables.set("books", [{ "books": { "title": "Ulysses", "year": 1922 } }, { "books": { "title": "Dune", "year": 1965 }}]) %} GET http://localhost:8080/books Content-Type: application/json { "bookTitle": "{{$.books..title}}", "bookYear": "{{$.books..year}}" } > {% let bookTitle = request.templateValue(0) client.log(`book title is: ${bookTitle}`) // prints Ulysses in 1st request, Dune in 2nd client.log(request.iteration()) let bookYear = request.templateValue(1) client.log(`book year is: ${bookYear}`) // prints 1922 in 1st request, 1965 in 2nd %}
2025 年 11 月 18 日
HTTP リクエスト構文の調査 OAuth 2.0 認証

関連ページ：

HTTP クライアントリファレンス

オブジェクトは、HTTP クライアントセッションのメタデータへのアクセスを提供し、HTTP レスポンスと出力内のテキストをで変換します。このオブジェクトは WebStorm が起動するたびに再初期化され、WebStorm の再起動間ではデータは保持されません。オブジェクトは、変数ストレージとして機能するネストされたグローバルオブジェクトも公開します。メソッド：テスト名前がで本体がのテストを作成します。すべてのテストは、応答ハンドラースクリプトの後に実行されます。テスト結果は、サービスツールウィ...

HTTP クライアント

HTTP クライアントプラグインを使用すると、WebStorm コードエディターで HTTP リクエストを直接作成、編集、実行できます。HTTP リクエストを作成して実行する必要がある場合、主に 2 つのユースケースがあります。RESTful Web サービスを開発していて、それが期待どおりに機能し、仕様に準拠してアクセス可能であり、正しく応答することを確認したい場合。RESTful Web サービスに対応するアプリケーションを開発している場合。この場合、開発を開始する前にサービスへのアクセスと...

ファイル構造

WebStorm を使用すると、構造ツールウィンドウおよび構造ポップアップでファイルの構造を表示および移動できます。構造ツールウィンドウのツールバーでクリックし、表示する要素を選択します。プロジェクトがバージョン管理されている場合、構造ツールウィンドウと構造ポップアップに VCS ステータスの色が表示されます。これは、ファイルの変更を追跡できます。変更されたオブジェクトの名前は青色になり、新しく追加されたオブジェクトの名前は緑色でハイライトされます。構造のアイコンにマウスを合わせると、ツールチッ...

言語インジェクション

デフォルトでは、IDE は一時的に言語を挿入します。これは、埋め込まれた要素を削除すると、インジェクションも失われることを意味します。言語インジェクションを使用すると、ファイルのメイン言語とは異なるプログラミング言語のコードを操作できます。WebStorm は、HTML、CSS、XML、JSON、RegExp、文字列とテンプレートリテラル内、XML に似た言語のタグと属性内の他のコードフラグメントを編集するための包括的な言語支援を提供します。言語インジェクションを追加する：永続的な言語インジェ...

HTTP リクエスト構文の調査

このセクションでは、HTTP リクエストの形式について説明します。HTTP リクエストの送信と HTTP レスポンスの表示の詳細については、「HTTP クライアント」を参照してください。WebStorm コードエディターで HTTP リクエストを作成するには、次の一般的な構文を使用します。Method Request-URI HTTP-Version Header-field: Header-value Request-BodyHTTP リクエストでコメントを使用するリクエスト内で、またはで任意...

OAuth 2.0 認証

HTTP クライアントは OAuth 2.0 認証をサポートします。アクセストークンを取得し、OAuth 2.0 で保護されたリソースへのリクエストを認証できます。ユーザー認証情報を入力できるようにするために、HTTP クライアントは組み込みの JCEF ブラウザーにログインフォームを表示します。この非モーダルブラウザーでは、IDE での作業が妨げられることはなく、たとえば、ユーザー名とパスワードをコピーして貼り付けることができます。一般的なフローには次の手順が含まれます。認証設定を指定する (認...