← Cloudflare Workers / workers / examples

Protokolování hlaviček do konzole

Pokud chcete rychle začít, klikněte na tlačítko níže.

Tím se vytvoří repozitář ve vašem účtu GitHub a aplikace se nasadí na Cloudflare Workers.

export default {
	async fetch(request) {
		console.log(new Map(request.headers));
		return new Response("Hello world");
	},
};

export default {
	async fetch(request): Promise<Response> {
		console.log(new Map(request.headers));
		return new Response("Hello world");
	},
} satisfies ExportedHandler;

from workers import WorkerEntrypoint, Response

class Default(WorkerEntrypoint):
    async def fetch(self, request):
        print(dict(request.headers))
        return Response('Hello world')

use worker::*;

#[event(fetch)]
async fn fetch(req: HttpRequest, _env: Env, _ctx: Context) -> Result<Response> {
    console_log!("{:?}", req.headers());
    Response::ok("hello world")
}

import { Hono } from 'hono';

const app = new Hono();

app.get('*', (c) => {
  // Different ways to log headers in Hono:

  // 1. Using Map to display headers in console
  console.log('Headers as Map:', new Map(c.req.raw.headers));

  // 2. Using spread operator to log headers
  console.log('Headers spread:', [...c.req.raw.headers]);

  // 3. Using Object.fromEntries to convert to an object
  console.log('Headers as Object:', Object.fromEntries(c.req.raw.headers));

  // 4. Hono's built-in header accessor (for individual headers)
  console.log('User-Agent:', c.req.header('User-Agent'));

  // 5. Using c.req.headers to get all headers
  console.log('All headers from Hono context:', c.req.header());

  return c.text('Hello world');
});

export default app;

Použijte Map pokud potřebujete zaznamenat Headers objekt do konzole:

console.log(new Map(request.headers));

Použijte spread operátor, pokud potřebujete rychle převést na řetězec Headers objekt:

let requestHeaders = JSON.stringify([...request.headers]);

Použijte Object.fromEntries pro převod hlaviček na objekt:

let requestHeaders = Object.fromEntries(request.headers);

Při ladění Workerů si prohlédněte hlavičky požadavku nebo odpovědi. Častou chybou je pokoušet se hlavičky vypsat do vývojářské konzole pomocí kódu, jako je tento:

console.log(request.headers);

Nebo takto:

console.log(`Request headers: ${JSON.stringify(request.headers)}`);

Oba pokusy vedou ke zdánlivě prázdnému objektu, totiž řetězci "{}" : i když volání request.headers.has("Your-Header-Name") může vrátit true. Jde o stejné chování, jaké implementují prohlížeče.

Důvodem je to, že Hlavičky ↗ objekty neukládají hlavičky do enumerovatelných vlastností JavaScriptu, takže konzole vývojáře ani JSON stringifier neumí přečíst názvy a hodnoty hlaviček. Ve skutečnosti nejde o prázdný objekt, ale o neprůhledný objekt.

Headers objekty jsou iterovatelné, což můžete využít k napsání několika rychlých jednořádkových příkazů pro ladicí výpis hlaviček.

První běžný přístup k tomu, jak Headers console.log()-friendly, znamená sestavit Map objekt z Headers objekt a zaznamenat Map objekt.

console.log(new Map(request.headers));

Funguje to z tohoto důvodu:

• Map objekty lze vytvořit z iterovatelných objektů, například Headers.

• Map objekt skutečně ukládá své položky do vyčíslitelných vlastností JavaScriptu, takže je konzole pro vývojáře může zobrazit.

Map přístup funguje pro volání console.log(). Pokud potřebujete převést hlavičky na řetězec, zjistíte, že převod Map nepřinese nic víc než [object Map].

I když Map ukládá svá data do enumerovatelných vlastností, tyto vlastnosti jsou Symbol ↗-klíčované. Z tohoto důvodu JSON.stringify() bude ignorovat vlastnosti s klíčem Symbol ↗ a obdržíte prázdný {}.

Místo toho můžete využít iterovatelnost Headers objekt novým způsobem použitím operátor spread ↗ (...) do něj.

let requestHeaders = JSON.stringify([...request.headers], null, 2);
console.log(`Request headers: ${requestHeaders}`);

ES2019 poskytuje Object.fromEntries ↗ což je volání, které převede hlavičky na objekt:

let headersObject = Object.fromEntries(request.headers);
let requestHeaders = JSON.stringify(headersObject, null, 2);
console.log(`Request headers: ${requestHeaders}`);

Výsledkem je něco jako:

Request headers: {
  "accept": "text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8",
  "accept-encoding": "gzip",
  "accept-language": "en-US,en;q=0.9",
  "cf-ipcountry": "US",
  // ...
}"