3 new headers added when querying a webApi but where did they come from?

Question

Capturing a click on a website in fiddler hoping to automate a process within an c# app. Fiddler captures 2 requests (OPTIONS and GET):

OPTIONS https://host... HTTP/1.1
Host: host
Connection: keep-alive
Accept: */*
Access-Control-Request-Method: GET
Access-Control-Request-Headers: pairm,pairx,pairz
Origin: https://host...
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.96 Safari/537.36 Edg/88.0.705.50
Sec-Fetch-Mode: cors
Sec-Fetch-Site: same-site
Sec-Fetch-Dest: empty
Referer: https://host...
Accept-Encoding: gzip, deflate, br
Accept-Language: en-GB,en;q=0.9,en-US;q=0.8,pl;q=0.7

returning this response:

HTTP/1.1 204 No Content
Server: nginx/1.16.1
Content-Type: text/html; charset=UTF-8
Connection: keep-alive
X-Powered-By: PHP/7.4.13
Cache-Control: no-cache, private
Date: Mon, 25 Jan 2021 13:58:03 GMT
Access-Control-Allow-Origin: *
Vary: Access-Control-Request-Method, Access-Control-Request-Headers
Access-Control-Allow-Methods: GET
Access-Control-Allow-Headers: pairm,pairx,pairz
Access-Control-Max-Age: 0

followed by another request:

GET https://host... HTTP/1.1
Host: host
Connection: keep-alive
Accept: application/json, text/plain, */*
PairZ: 2537624327195356974404768858565322431647991274896813
PairM: 2267673572979313282937216167457434744448197714372250
PairX: 6431909992249094676623824191533524405911989986455913
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.96 Safari/537.36 Edg/88.0.705.50
Origin: https://host...
Sec-Fetch-Site: same-site
Sec-Fetch-Mode: cors
Sec-Fetch-Dest: empty
Referer: https://host...
Accept-Encoding: gzip, deflate, br
Accept-Language: en-GB,en;q=0.9,en-US;q=0.8,pl;q=0.7

and response:

HTTP/1.1 200 OK
Server: nginx/1.16.1
Content-Type: application/json
Connection: keep-alive
X-Powered-By: PHP/7.4.13
Cache-Control: no-cache, private
Date: Mon, 25 Jan 2021 13:58:03 GMT
Access-Control-Allow-Origin: *
Content-Length: 2114

{json}

Nothing in the html/js, no cookies, no auth and no form data are exchanged and I can't figure out what mechanism is used here to add PairZ, PairM and PairZ and where do their values come from.

Any info in the docs (CORS or Caching) must be well hidden or maybe Im just blind but I can't find any workflows explaining how these 3 headers got in there. Any hints/help is much appreciated.

Answer 1

The OPTION request before the regular request is part of the browsers CORS mechanism.

Cross-origin resource sharing (CORS) is a mechanism that allows restricted resources on a web page to be requested from another domain outside the domain from which the first resource was served.

And OPTION request is part of this process that called preflight request This request suppose to check the server CORS setting before the real request. And the response from the preflight request determine weather you have permission to perform the real request.

The process look like this:

In your case you have GET request with custom headers.