Search

Observe an HTTP QUERY request

Watch a browser preflight a safe QUERY request before sending its fixed JSON query content.

Difficulty
intermediate
Published
July 14, 2026
Last reviewed
Review due
  • methods
  • request content
  • cors
  • preflight

Prediction

The browser should send OPTIONS before QUERY because QUERY is not a CORS-safelisted method. The intended request should then carry JSON content even though its semantics are safe and idempotent.

Controlled observation

Choose one of two reviewed query shapes. Both target the same fixed resource, declare application/json, and return a small fixed dataset. The response’s Accept-Query field advertises the accepted query media type.

Explanation

QUERY places the query representation in request content while preserving safe and idempotent semantics. Its Content-Type defines the query format; Accept-Query advertises which formats the resource accepts. In a cross-origin browser, preflight separately asks whether the page may send the QUERY method and JSON content type.

Controlled exercise

Run this observation

Compare the browser-generated OPTIONS preflight with the intended safe QUERY request and its fixed JSON query content.

Ready. No request has run.

Controlled request

Method
QUERY
URL
https://lab.httpclarity.com/v1/query
Permitted headers
Accept: application/json; Content-Type: application/json
Body
29 bytes (fixed): {"status":"active","limit":2}

Browser-observed response

No response yet. The explanation and examples remain useful without JavaScript or the Worker.

Timing is browser elapsed time. Fetch hides Set-Cookie, raw wire bytes, reliable compressed size, and some redirect details.

Portable examples

cURL
'curl' '--include' '--request' 'QUERY' '--header' 'Accept: application/json' '--header' 'Content-Type: application/json' '--data' '{"status":"active","limit":2}' 'https://lab.httpclarity.com/v1/query'
Fetch API
const response = await fetch("https://lab.httpclarity.com/v1/query", {
  "method": "QUERY",
  "headers": {
    "Accept": "application/json",
    "Content-Type": "application/json"
  },
  "body": "{\"status\":\"active\",\"limit\":2}"
});
console.log(response.status, await response.text());
PHP
<?php
$options = ['http' => [
    'method' => 'QUERY',
    'ignore_errors' => true,
    'header' => 'Accept: application/json\\r\\nContent-Type: application/json',
    'content' => '{"status":"active","limit":2}',
]];
$context = stream_context_create($options);
$body = file_get_contents('https://lab.httpclarity.com/v1/query', false, $context);
var_dump($http_response_header, $body);

Need a full API client? Copy the generated cURL command, then import it in Hoppscotch. HTTPClarity sends no request data to Hoppscotch.

Continue in Hoppscotch

Primary sources