[{"data":1,"prerenderedAt":2028},["ShallowReactive",2],{"navigation_docs":3,"-adapters-browser":191,"-adapters-browser-surround":2023},[4,30,65,115,132,146],{"title":5,"path":6,"stem":7,"children":8,"page":29},"Getting Started","/getting-started","1.getting-started",[9,14,19,24],{"title":10,"path":11,"stem":12,"icon":13},"Introduction","/getting-started/introduction","1.getting-started/1.introduction","i-lucide-info",{"title":15,"path":16,"stem":17,"icon":18},"Installation","/getting-started/installation","1.getting-started/2.installation","i-lucide-download",{"title":20,"path":21,"stem":22,"icon":23},"Quick Start","/getting-started/quick-start","1.getting-started/3.quick-start","i-lucide-zap",{"title":25,"path":26,"stem":27,"icon":28},"Agent Skills","/getting-started/agent-skills","1.getting-started/4.agent-skills","i-lucide-sparkles",false,{"title":31,"path":32,"stem":33,"children":34,"page":29},"Core Concepts","/core-concepts","2.core-concepts",[35,40,45,50,55,60],{"title":36,"path":37,"stem":38,"icon":39},"Wide Events","/core-concepts/wide-events","2.core-concepts/1.wide-events","i-lucide-layers",{"title":41,"path":42,"stem":43,"icon":44},"Structured Errors","/core-concepts/structured-errors","2.core-concepts/2.structured-errors","i-lucide-shield-alert",{"title":46,"path":47,"stem":48,"icon":49},"Best Practices","/core-concepts/best-practices","2.core-concepts/3.best-practices","i-lucide-shield-check",{"title":51,"path":52,"stem":53,"icon":54},"Typed Fields","/core-concepts/typed-fields","2.core-concepts/4.typed-fields","i-simple-icons-typescript",{"title":56,"path":57,"stem":58,"icon":59},"Sampling","/core-concepts/sampling","2.core-concepts/5.sampling","i-lucide-filter",{"title":61,"path":62,"stem":63,"icon":64},"Client Logging","/core-concepts/client-logging","2.core-concepts/6.client-logging","i-lucide-monitor",{"title":66,"path":67,"stem":68,"children":69,"page":29},"Adapters","/adapters","3.adapters",[70,75,80,85,90,95,100,105,110],{"title":71,"path":72,"stem":73,"icon":74},"Overview","/adapters/overview","3.adapters/1.overview","i-custom-plug",{"title":76,"path":77,"stem":78,"icon":79},"Axiom","/adapters/axiom","3.adapters/2.axiom","i-custom-axiom",{"title":81,"path":82,"stem":83,"icon":84},"OTLP","/adapters/otlp","3.adapters/3.otlp","i-simple-icons-opentelemetry",{"title":86,"path":87,"stem":88,"icon":89},"PostHog","/adapters/posthog","3.adapters/4.posthog","i-simple-icons-posthog",{"title":91,"path":92,"stem":93,"icon":94},"Sentry","/adapters/sentry","3.adapters/5.sentry","i-simple-icons-sentry",{"title":96,"path":97,"stem":98,"icon":99},"Better Stack","/adapters/better-stack","3.adapters/6.better-stack","i-simple-icons-betterstack",{"title":101,"path":102,"stem":103,"icon":104},"Custom Adapters","/adapters/custom","3.adapters/7.custom","i-lucide-code",{"title":106,"path":107,"stem":108,"icon":109},"Pipeline","/adapters/pipeline","3.adapters/8.pipeline","i-lucide-workflow",{"title":111,"path":112,"stem":113,"icon":114},"Browser","/adapters/browser","3.adapters/9.browser","i-lucide-globe",{"title":116,"path":117,"stem":118,"children":119,"page":29},"Enrichers","/enrichers","4.enrichers",[120,123,128],{"title":71,"path":121,"stem":122,"icon":28},"/enrichers/overview","4.enrichers/1.overview",{"title":124,"path":125,"stem":126,"icon":127},"Built-in","/enrichers/built-in","4.enrichers/2.built-in","i-lucide-puzzle",{"title":129,"path":130,"stem":131,"icon":104},"Custom","/enrichers/custom","4.enrichers/3.custom",{"title":133,"path":134,"stem":135,"children":136,"page":29},"NuxtHub","/nuxthub","5.nuxthub",[137,141],{"title":71,"path":138,"stem":139,"icon":140},"/nuxthub/overview","5.nuxthub/1.overview","i-lucide-database",{"title":142,"path":143,"stem":144,"icon":145},"Retention","/nuxthub/retention","5.nuxthub/2.retention","i-lucide-clock",{"title":147,"path":148,"stem":149,"children":150,"page":29},"Examples","/examples","6.examples",[151,156,161,166,171,176,181,186],{"title":152,"path":153,"stem":154,"icon":155},"Next.js","/examples/nextjs","6.examples/1.nextjs","i-simple-icons-nextdotjs",{"title":157,"path":158,"stem":159,"icon":160},"SvelteKit","/examples/sveltekit","6.examples/2.sveltekit","i-simple-icons-svelte",{"title":162,"path":163,"stem":164,"icon":165},"TanStack Start","/examples/tanstack-start","6.examples/3.tanstack-start","i-custom-tanstack",{"title":167,"path":168,"stem":169,"icon":170},"NestJS","/examples/nestjs","6.examples/4.nestjs","i-simple-icons-nestjs",{"title":172,"path":173,"stem":174,"icon":175},"Express","/examples/express","6.examples/5.express","i-simple-icons-express",{"title":177,"path":178,"stem":179,"icon":180},"Hono","/examples/hono","6.examples/6.hono","i-simple-icons-hono",{"title":182,"path":183,"stem":184,"icon":185},"Fastify","/examples/fastify","6.examples/7.fastify","i-simple-icons-fastify",{"title":187,"path":188,"stem":189,"icon":190},"Elysia","/examples/elysia","6.examples/8.elysia","i-custom-elysia",{"id":192,"title":193,"body":194,"description":2013,"extension":2014,"links":2015,"meta":2019,"navigation":2020,"path":112,"seo":2021,"stem":113,"__hash__":2022},"docs/3.adapters/9.browser.md","Browser Drain",{"type":195,"value":196,"toc":1993},"minimark",[197,201,205,411,415,472,476,483,497,685,691,694,899,903,909,1005,1011,1074,1078,1092,1097,1101,1104,1198,1222,1226,1232,1235,1386,1389,1533,1537,1547,1946,1959,1966,1970,1989],[198,199,200],"p",{},"Most observability tools focus on server-side logs. The browser drain gives you a framework-agnostic way to send structured logs from the browser to any HTTP endpoint — no vendor SDK, no framework coupling.",[202,203,20],"h2",{"id":204},"quick-start",[206,207,213],"pre",{"className":208,"code":209,"filename":210,"language":211,"meta":212,"style":212},"language-typescript shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import { initLogger, log } from 'evlog'\nimport { createBrowserLogDrain } from 'evlog/browser'\n\nconst drain = createBrowserLogDrain({\n  drain: { endpoint: 'https://logs.example.com/v1/ingest' },\n})\ninitLogger({ drain })\n\nlog.info({ action: 'page_view', path: location.pathname })\n","app.ts","typescript","",[214,215,216,255,276,283,305,333,342,359,364],"code",{"__ignoreMap":212},[217,218,221,225,229,233,236,239,242,245,248,252],"span",{"class":219,"line":220},"line",1,[217,222,224],{"class":223},"s7zQu","import",[217,226,228],{"class":227},"sMK4o"," {",[217,230,232],{"class":231},"sTEyZ"," initLogger",[217,234,235],{"class":227},",",[217,237,238],{"class":231}," log",[217,240,241],{"class":227}," }",[217,243,244],{"class":223}," from",[217,246,247],{"class":227}," '",[217,249,251],{"class":250},"sfazB","evlog",[217,253,254],{"class":227},"'\n",[217,256,258,260,262,265,267,269,271,274],{"class":219,"line":257},2,[217,259,224],{"class":223},[217,261,228],{"class":227},[217,263,264],{"class":231}," createBrowserLogDrain",[217,266,241],{"class":227},[217,268,244],{"class":223},[217,270,247],{"class":227},[217,272,273],{"class":250},"evlog/browser",[217,275,254],{"class":227},[217,277,279],{"class":219,"line":278},3,[217,280,282],{"emptyLinePlaceholder":281},true,"\n",[217,284,286,290,293,296,299,302],{"class":219,"line":285},4,[217,287,289],{"class":288},"spNyl","const",[217,291,292],{"class":231}," drain ",[217,294,295],{"class":227},"=",[217,297,264],{"class":298},"s2Zo4",[217,300,301],{"class":231},"(",[217,303,304],{"class":227},"{\n",[217,306,308,312,315,317,320,322,324,327,330],{"class":219,"line":307},5,[217,309,311],{"class":310},"swJcz","  drain",[217,313,314],{"class":227},":",[217,316,228],{"class":227},[217,318,319],{"class":310}," endpoint",[217,321,314],{"class":227},[217,323,247],{"class":227},[217,325,326],{"class":250},"https://logs.example.com/v1/ingest",[217,328,329],{"class":227},"'",[217,331,332],{"class":227}," },\n",[217,334,336,339],{"class":219,"line":335},6,[217,337,338],{"class":227},"}",[217,340,341],{"class":231},")\n",[217,343,345,348,350,353,355,357],{"class":219,"line":344},7,[217,346,347],{"class":298},"initLogger",[217,349,301],{"class":231},[217,351,352],{"class":227},"{",[217,354,292],{"class":231},[217,356,338],{"class":227},[217,358,341],{"class":231},[217,360,362],{"class":219,"line":361},8,[217,363,282],{"emptyLinePlaceholder":281},[217,365,367,370,373,376,378,380,383,385,387,390,392,394,397,399,402,404,407,409],{"class":219,"line":366},9,[217,368,369],{"class":231},"log",[217,371,372],{"class":227},".",[217,374,375],{"class":298},"info",[217,377,301],{"class":231},[217,379,352],{"class":227},[217,381,382],{"class":310}," action",[217,384,314],{"class":227},[217,386,247],{"class":227},[217,388,389],{"class":250},"page_view",[217,391,329],{"class":227},[217,393,235],{"class":227},[217,395,396],{"class":310}," path",[217,398,314],{"class":227},[217,400,401],{"class":231}," location",[217,403,372],{"class":227},[217,405,406],{"class":231},"pathname ",[217,408,338],{"class":227},[217,410,341],{"class":231},[202,412,414],{"id":413},"how-it-works","How It Works",[416,417,418,436,443,454,461],"ol",{},[419,420,421,424,425,424,428,431,432],"li",{},[214,422,423],{},"log.info()"," / ",[214,426,427],{},"log.warn()",[214,429,430],{},"log.error()"," push events into a ",[433,434,435],"strong",{},"memory buffer",[419,437,438,439,442],{},"Events are ",[433,440,441],{},"batched"," by size (default 25) or time interval (default 2 s)",[419,444,445,446,449,450,453],{},"Batches are sent via ",[214,447,448],{},"fetch"," with ",[214,451,452],{},"keepalive: true"," so requests survive page navigation",[419,455,456,457,460],{},"When the page becomes hidden (tab switch, navigation), buffered events are flushed via ",[214,458,459],{},"navigator.sendBeacon"," as a fallback",[419,462,463,464,467,468,471],{},"Your ",[433,465,466],{},"server endpoint"," receives a ",[214,469,470],{},"DrainContext[]"," JSON array and processes it however you like",[202,473,475],{"id":474},"two-tier-api","Two-Tier API",[477,478,480],"h3",{"id":479},"createbrowserlogdrainoptions",[214,481,482],{},"createBrowserLogDrain(options)",[198,484,485,486,489,490,493,494,372],{},"High-level, pre-composed: creates a pipeline with batching, retry, and auto-flush on ",[214,487,488],{},"visibilitychange",". Returns a ",[214,491,492],{},"PipelineDrainFn\u003CDrainContext>"," directly usable with ",[214,495,496],{},"initLogger({ drain })",[206,498,500],{"className":208,"code":499,"language":211,"meta":212,"style":212},"import { initLogger, log } from 'evlog'\nimport { createBrowserLogDrain } from 'evlog/browser'\n\nconst drain = createBrowserLogDrain({\n  drain: { endpoint: 'https://logs.example.com/v1/ingest' },\n  pipeline: { batch: { size: 50, intervalMs: 5000 } },\n})\n\ninitLogger({ drain })\nlog.info({ action: 'click', target: 'buy-button' })\n",[214,501,502,524,542,546,560,580,619,625,629,643],{"__ignoreMap":212},[217,503,504,506,508,510,512,514,516,518,520,522],{"class":219,"line":220},[217,505,224],{"class":223},[217,507,228],{"class":227},[217,509,232],{"class":231},[217,511,235],{"class":227},[217,513,238],{"class":231},[217,515,241],{"class":227},[217,517,244],{"class":223},[217,519,247],{"class":227},[217,521,251],{"class":250},[217,523,254],{"class":227},[217,525,526,528,530,532,534,536,538,540],{"class":219,"line":257},[217,527,224],{"class":223},[217,529,228],{"class":227},[217,531,264],{"class":231},[217,533,241],{"class":227},[217,535,244],{"class":223},[217,537,247],{"class":227},[217,539,273],{"class":250},[217,541,254],{"class":227},[217,543,544],{"class":219,"line":278},[217,545,282],{"emptyLinePlaceholder":281},[217,547,548,550,552,554,556,558],{"class":219,"line":285},[217,549,289],{"class":288},[217,551,292],{"class":231},[217,553,295],{"class":227},[217,555,264],{"class":298},[217,557,301],{"class":231},[217,559,304],{"class":227},[217,561,562,564,566,568,570,572,574,576,578],{"class":219,"line":307},[217,563,311],{"class":310},[217,565,314],{"class":227},[217,567,228],{"class":227},[217,569,319],{"class":310},[217,571,314],{"class":227},[217,573,247],{"class":227},[217,575,326],{"class":250},[217,577,329],{"class":227},[217,579,332],{"class":227},[217,581,582,585,587,589,592,594,596,599,601,605,607,610,612,615,617],{"class":219,"line":335},[217,583,584],{"class":310},"  pipeline",[217,586,314],{"class":227},[217,588,228],{"class":227},[217,590,591],{"class":310}," batch",[217,593,314],{"class":227},[217,595,228],{"class":227},[217,597,598],{"class":310}," size",[217,600,314],{"class":227},[217,602,604],{"class":603},"sbssI"," 50",[217,606,235],{"class":227},[217,608,609],{"class":310}," intervalMs",[217,611,314],{"class":227},[217,613,614],{"class":603}," 5000",[217,616,241],{"class":227},[217,618,332],{"class":227},[217,620,621,623],{"class":219,"line":344},[217,622,338],{"class":227},[217,624,341],{"class":231},[217,626,627],{"class":219,"line":361},[217,628,282],{"emptyLinePlaceholder":281},[217,630,631,633,635,637,639,641],{"class":219,"line":366},[217,632,347],{"class":298},[217,634,301],{"class":231},[217,636,352],{"class":227},[217,638,292],{"class":231},[217,640,338],{"class":227},[217,642,341],{"class":231},[217,644,646,648,650,652,654,656,658,660,662,665,667,669,672,674,676,679,681,683],{"class":219,"line":645},10,[217,647,369],{"class":231},[217,649,372],{"class":227},[217,651,375],{"class":298},[217,653,301],{"class":231},[217,655,352],{"class":227},[217,657,382],{"class":310},[217,659,314],{"class":227},[217,661,247],{"class":227},[217,663,664],{"class":250},"click",[217,666,329],{"class":227},[217,668,235],{"class":227},[217,670,671],{"class":310}," target",[217,673,314],{"class":227},[217,675,247],{"class":227},[217,677,678],{"class":250},"buy-button",[217,680,329],{"class":227},[217,682,241],{"class":227},[217,684,341],{"class":231},[477,686,688],{"id":687},"createbrowserdrainconfig",[214,689,690],{},"createBrowserDrain(config)",[198,692,693],{},"Low-level transport function. Use this when you want full control over the pipeline configuration:",[206,695,697],{"className":208,"code":696,"language":211,"meta":212,"style":212},"import { createBrowserDrain } from 'evlog/browser'\nimport { createDrainPipeline } from 'evlog/pipeline'\nimport type { DrainContext } from 'evlog'\n\nconst transport = createBrowserDrain({\n  endpoint: 'https://logs.example.com/v1/ingest',\n})\nconst pipeline = createDrainPipeline\u003CDrainContext>({\n  batch: { size: 100, intervalMs: 10000 },\n  retry: { maxAttempts: 5 },\n})\n\nconst drain = pipeline(transport)\n",[214,698,699,718,738,760,764,779,795,801,826,853,872,879,884],{"__ignoreMap":212},[217,700,701,703,705,708,710,712,714,716],{"class":219,"line":220},[217,702,224],{"class":223},[217,704,228],{"class":227},[217,706,707],{"class":231}," createBrowserDrain",[217,709,241],{"class":227},[217,711,244],{"class":223},[217,713,247],{"class":227},[217,715,273],{"class":250},[217,717,254],{"class":227},[217,719,720,722,724,727,729,731,733,736],{"class":219,"line":257},[217,721,224],{"class":223},[217,723,228],{"class":227},[217,725,726],{"class":231}," createDrainPipeline",[217,728,241],{"class":227},[217,730,244],{"class":223},[217,732,247],{"class":227},[217,734,735],{"class":250},"evlog/pipeline",[217,737,254],{"class":227},[217,739,740,742,745,747,750,752,754,756,758],{"class":219,"line":278},[217,741,224],{"class":223},[217,743,744],{"class":223}," type",[217,746,228],{"class":227},[217,748,749],{"class":231}," DrainContext",[217,751,241],{"class":227},[217,753,244],{"class":223},[217,755,247],{"class":227},[217,757,251],{"class":250},[217,759,254],{"class":227},[217,761,762],{"class":219,"line":285},[217,763,282],{"emptyLinePlaceholder":281},[217,765,766,768,771,773,775,777],{"class":219,"line":307},[217,767,289],{"class":288},[217,769,770],{"class":231}," transport ",[217,772,295],{"class":227},[217,774,707],{"class":298},[217,776,301],{"class":231},[217,778,304],{"class":227},[217,780,781,784,786,788,790,792],{"class":219,"line":335},[217,782,783],{"class":310},"  endpoint",[217,785,314],{"class":227},[217,787,247],{"class":227},[217,789,326],{"class":250},[217,791,329],{"class":227},[217,793,794],{"class":227},",\n",[217,796,797,799],{"class":219,"line":344},[217,798,338],{"class":227},[217,800,341],{"class":231},[217,802,803,805,808,810,812,815,819,822,824],{"class":219,"line":361},[217,804,289],{"class":288},[217,806,807],{"class":231}," pipeline ",[217,809,295],{"class":227},[217,811,726],{"class":298},[217,813,814],{"class":227},"\u003C",[217,816,818],{"class":817},"sBMFI","DrainContext",[217,820,821],{"class":227},">",[217,823,301],{"class":231},[217,825,304],{"class":227},[217,827,828,831,833,835,837,839,842,844,846,848,851],{"class":219,"line":366},[217,829,830],{"class":310},"  batch",[217,832,314],{"class":227},[217,834,228],{"class":227},[217,836,598],{"class":310},[217,838,314],{"class":227},[217,840,841],{"class":603}," 100",[217,843,235],{"class":227},[217,845,609],{"class":310},[217,847,314],{"class":227},[217,849,850],{"class":603}," 10000",[217,852,332],{"class":227},[217,854,855,858,860,862,865,867,870],{"class":219,"line":645},[217,856,857],{"class":310},"  retry",[217,859,314],{"class":227},[217,861,228],{"class":227},[217,863,864],{"class":310}," maxAttempts",[217,866,314],{"class":227},[217,868,869],{"class":603}," 5",[217,871,332],{"class":227},[217,873,875,877],{"class":219,"line":874},11,[217,876,338],{"class":227},[217,878,341],{"class":231},[217,880,882],{"class":219,"line":881},12,[217,883,282],{"emptyLinePlaceholder":281},[217,885,887,889,891,893,896],{"class":219,"line":886},13,[217,888,289],{"class":288},[217,890,292],{"class":231},[217,892,295],{"class":227},[217,894,895],{"class":298}," pipeline",[217,897,898],{"class":231},"(transport)\n",[202,900,902],{"id":901},"configuration-reference","Configuration Reference",[477,904,906],{"id":905},"browserdrainconfig",[214,907,908],{},"BrowserDrainConfig",[910,911,912,928],"table",{},[913,914,915],"thead",{},[916,917,918,922,925],"tr",{},[919,920,921],"th",{},"Option",[919,923,924],{},"Default",[919,926,927],{},"Description",[929,930,931,948,971,986],"tbody",{},[916,932,933,939,942],{},[934,935,936],"td",{},[214,937,938],{},"endpoint",[934,940,941],{},"—",[934,943,944,947],{},[433,945,946],{},"(required)"," Full URL of the server ingest endpoint",[916,949,950,955,957],{},[934,951,952],{},[214,953,954],{},"headers",[934,956,941],{},[934,958,959,960,962,963,966,967,970],{},"Custom headers sent with each ",[214,961,448],{}," request (e.g. ",[214,964,965],{},"Authorization",", ",[214,968,969],{},"X-API-Key",")",[916,972,973,978,983],{},[934,974,975],{},[214,976,977],{},"timeout",[934,979,980],{},[214,981,982],{},"5000",[934,984,985],{},"Request timeout in milliseconds",[916,987,988,993,998],{},[934,989,990],{},[214,991,992],{},"useBeacon",[934,994,995],{},[214,996,997],{},"true",[934,999,1000,1001,1004],{},"Use ",[214,1002,1003],{},"sendBeacon"," when the page is hidden",[477,1006,1008],{"id":1007},"browserlogdrainoptions",[214,1009,1010],{},"BrowserLogDrainOptions",[910,1012,1013,1023],{},[913,1014,1015],{},[916,1016,1017,1019,1021],{},[919,1018,921],{},[919,1020,924],{},[919,1022,927],{},[929,1024,1025,1042,1057],{},[916,1026,1027,1032,1034],{},[934,1028,1029],{},[214,1030,1031],{},"drain",[934,1033,941],{},[934,1035,1036,1038,1039,1041],{},[433,1037,946],{}," ",[214,1040,908],{}," object",[916,1043,1044,1049,1054],{},[934,1045,1046],{},[214,1047,1048],{},"pipeline",[934,1050,1051],{},[214,1052,1053],{},"{ batch: { size: 25, intervalMs: 2000 }, retry: { maxAttempts: 2 } }",[934,1055,1056],{},"Pipeline configuration overrides",[916,1058,1059,1064,1068],{},[934,1060,1061],{},[214,1062,1063],{},"autoFlush",[934,1065,1066],{},[214,1067,997],{},[934,1069,1070,1071,1073],{},"Auto-register ",[214,1072,488],{}," flush listener",[202,1075,1077],{"id":1076},"sendbeacon-fallback","sendBeacon Fallback",[1079,1080,1082,1083,1085,1086,1088,1089,1091],"callout",{"color":375,"icon":1081},"i-lucide-radio","When ",[214,1084,992],{}," is enabled (the default) and the page becomes hidden, the drain automatically switches from ",[214,1087,448],{}," to ",[214,1090,459],{},". This ensures logs are delivered even when the user closes the tab or navigates away — no data loss on page exit.",[198,1093,1094,1096],{},[214,1095,1003],{}," has a browser-imposed payload limit (~64 KB). If the payload exceeds this, the drain throws an error. Keep batch sizes reasonable (the default of 25 is well within limits).",[202,1098,1100],{"id":1099},"authentication","Authentication",[198,1102,1103],{},"Pass custom headers to protect your ingest endpoint:",[206,1105,1107],{"className":208,"code":1106,"language":211,"meta":212,"style":212},"const drain = createBrowserLogDrain({\n  drain: {\n    endpoint: 'https://logs.example.com/v1/ingest',\n    headers: {\n      'Authorization': 'Bearer ' + token,\n    },\n  },\n})\n",[214,1108,1109,1123,1132,1147,1156,1182,1187,1192],{"__ignoreMap":212},[217,1110,1111,1113,1115,1117,1119,1121],{"class":219,"line":220},[217,1112,289],{"class":288},[217,1114,292],{"class":231},[217,1116,295],{"class":227},[217,1118,264],{"class":298},[217,1120,301],{"class":231},[217,1122,304],{"class":227},[217,1124,1125,1127,1129],{"class":219,"line":257},[217,1126,311],{"class":310},[217,1128,314],{"class":227},[217,1130,1131],{"class":227}," {\n",[217,1133,1134,1137,1139,1141,1143,1145],{"class":219,"line":278},[217,1135,1136],{"class":310},"    endpoint",[217,1138,314],{"class":227},[217,1140,247],{"class":227},[217,1142,326],{"class":250},[217,1144,329],{"class":227},[217,1146,794],{"class":227},[217,1148,1149,1152,1154],{"class":219,"line":285},[217,1150,1151],{"class":310},"    headers",[217,1153,314],{"class":227},[217,1155,1131],{"class":227},[217,1157,1158,1161,1163,1165,1167,1169,1172,1174,1177,1180],{"class":219,"line":307},[217,1159,1160],{"class":227},"      '",[217,1162,965],{"class":310},[217,1164,329],{"class":227},[217,1166,314],{"class":227},[217,1168,247],{"class":227},[217,1170,1171],{"class":250},"Bearer ",[217,1173,329],{"class":227},[217,1175,1176],{"class":227}," +",[217,1178,1179],{"class":231}," token",[217,1181,794],{"class":227},[217,1183,1184],{"class":219,"line":335},[217,1185,1186],{"class":227},"    },\n",[217,1188,1189],{"class":219,"line":344},[217,1190,1191],{"class":227},"  },\n",[217,1193,1194,1196],{"class":219,"line":361},[217,1195,338],{"class":227},[217,1197,341],{"class":231},[1079,1199,1201,1203,1204,1206,1207,1209,1210,1212,1213,1216,1217,449,1219,372],{"color":1200,"icon":44},"warning",[214,1202,954],{}," are applied to ",[214,1205,448],{}," requests only. The ",[214,1208,1003],{}," API does not support custom headers — when the page is hidden and ",[214,1211,1003],{}," is used, headers are not sent. If your endpoint requires authentication, consider validating via a session cookie (",[214,1214,1215],{},"credentials: 'same-origin'"," is set by default) or disable ",[214,1218,1003],{},[214,1220,1221],{},"useBeacon: false",[202,1223,1225],{"id":1224},"server-endpoint","Server Endpoint",[198,1227,1228,1229,1231],{},"Your server needs a POST endpoint that accepts a ",[214,1230,470],{}," JSON body. Here are examples for common frameworks:",[477,1233,172],{"id":1234},"express",[206,1236,1239],{"className":208,"code":1237,"filename":1238,"language":211,"meta":212,"style":212},"app.post('/v1/ingest', express.json(), (req, res) => {\n  for (const entry of req.body) {\n    console.log('[BROWSER]', JSON.stringify(entry))\n  }\n  res.sendStatus(204)\n})\n","server.ts",[214,1240,1241,1294,1322,1358,1363,1380],{"__ignoreMap":212},[217,1242,1243,1246,1248,1251,1253,1255,1258,1260,1262,1265,1267,1270,1273,1275,1278,1282,1284,1287,1289,1292],{"class":219,"line":220},[217,1244,1245],{"class":231},"app",[217,1247,372],{"class":227},[217,1249,1250],{"class":298},"post",[217,1252,301],{"class":231},[217,1254,329],{"class":227},[217,1256,1257],{"class":250},"/v1/ingest",[217,1259,329],{"class":227},[217,1261,235],{"class":227},[217,1263,1264],{"class":231}," express",[217,1266,372],{"class":227},[217,1268,1269],{"class":298},"json",[217,1271,1272],{"class":231},"()",[217,1274,235],{"class":227},[217,1276,1277],{"class":227}," (",[217,1279,1281],{"class":1280},"sHdIc","req",[217,1283,235],{"class":227},[217,1285,1286],{"class":1280}," res",[217,1288,970],{"class":227},[217,1290,1291],{"class":288}," =>",[217,1293,1131],{"class":227},[217,1295,1296,1299,1301,1303,1306,1309,1312,1314,1317,1320],{"class":219,"line":257},[217,1297,1298],{"class":223},"  for",[217,1300,1277],{"class":310},[217,1302,289],{"class":288},[217,1304,1305],{"class":231}," entry",[217,1307,1308],{"class":227}," of",[217,1310,1311],{"class":231}," req",[217,1313,372],{"class":227},[217,1315,1316],{"class":231},"body",[217,1318,1319],{"class":310},") ",[217,1321,304],{"class":227},[217,1323,1324,1327,1329,1331,1333,1335,1338,1340,1342,1345,1347,1350,1352,1355],{"class":219,"line":278},[217,1325,1326],{"class":231},"    console",[217,1328,372],{"class":227},[217,1330,369],{"class":298},[217,1332,301],{"class":310},[217,1334,329],{"class":227},[217,1336,1337],{"class":250},"[BROWSER]",[217,1339,329],{"class":227},[217,1341,235],{"class":227},[217,1343,1344],{"class":231}," JSON",[217,1346,372],{"class":227},[217,1348,1349],{"class":298},"stringify",[217,1351,301],{"class":310},[217,1353,1354],{"class":231},"entry",[217,1356,1357],{"class":310},"))\n",[217,1359,1360],{"class":219,"line":285},[217,1361,1362],{"class":227},"  }\n",[217,1364,1365,1368,1370,1373,1375,1378],{"class":219,"line":307},[217,1366,1367],{"class":231},"  res",[217,1369,372],{"class":227},[217,1371,1372],{"class":298},"sendStatus",[217,1374,301],{"class":310},[217,1376,1377],{"class":603},"204",[217,1379,341],{"class":310},[217,1381,1382,1384],{"class":219,"line":335},[217,1383,338],{"class":227},[217,1385,341],{"class":231},[477,1387,177],{"id":1388},"hono",[206,1390,1392],{"className":208,"code":1391,"filename":1238,"language":211,"meta":212,"style":212},"app.post('/v1/ingest', async (c) => {\n  const body = await c.req.json()\n  for (const entry of body) {\n    console.log('[BROWSER]', JSON.stringify(entry))\n  }\n  return c.body(null, 204)\n})\n",[214,1393,1394,1426,1454,1472,1502,1506,1527],{"__ignoreMap":212},[217,1395,1396,1398,1400,1402,1404,1406,1408,1410,1412,1415,1417,1420,1422,1424],{"class":219,"line":220},[217,1397,1245],{"class":231},[217,1399,372],{"class":227},[217,1401,1250],{"class":298},[217,1403,301],{"class":231},[217,1405,329],{"class":227},[217,1407,1257],{"class":250},[217,1409,329],{"class":227},[217,1411,235],{"class":227},[217,1413,1414],{"class":288}," async",[217,1416,1277],{"class":227},[217,1418,1419],{"class":1280},"c",[217,1421,970],{"class":227},[217,1423,1291],{"class":288},[217,1425,1131],{"class":227},[217,1427,1428,1431,1434,1437,1440,1443,1445,1447,1449,1451],{"class":219,"line":257},[217,1429,1430],{"class":288},"  const",[217,1432,1433],{"class":231}," body",[217,1435,1436],{"class":227}," =",[217,1438,1439],{"class":223}," await",[217,1441,1442],{"class":231}," c",[217,1444,372],{"class":227},[217,1446,1281],{"class":231},[217,1448,372],{"class":227},[217,1450,1269],{"class":298},[217,1452,1453],{"class":310},"()\n",[217,1455,1456,1458,1460,1462,1464,1466,1468,1470],{"class":219,"line":278},[217,1457,1298],{"class":223},[217,1459,1277],{"class":310},[217,1461,289],{"class":288},[217,1463,1305],{"class":231},[217,1465,1308],{"class":227},[217,1467,1433],{"class":231},[217,1469,1319],{"class":310},[217,1471,304],{"class":227},[217,1473,1474,1476,1478,1480,1482,1484,1486,1488,1490,1492,1494,1496,1498,1500],{"class":219,"line":285},[217,1475,1326],{"class":231},[217,1477,372],{"class":227},[217,1479,369],{"class":298},[217,1481,301],{"class":310},[217,1483,329],{"class":227},[217,1485,1337],{"class":250},[217,1487,329],{"class":227},[217,1489,235],{"class":227},[217,1491,1344],{"class":231},[217,1493,372],{"class":227},[217,1495,1349],{"class":298},[217,1497,301],{"class":310},[217,1499,1354],{"class":231},[217,1501,1357],{"class":310},[217,1503,1504],{"class":219,"line":307},[217,1505,1362],{"class":227},[217,1507,1508,1511,1513,1515,1517,1519,1522,1525],{"class":219,"line":335},[217,1509,1510],{"class":223},"  return",[217,1512,1442],{"class":231},[217,1514,372],{"class":227},[217,1516,1316],{"class":298},[217,1518,301],{"class":310},[217,1520,1521],{"class":227},"null,",[217,1523,1524],{"class":603}," 204",[217,1526,341],{"class":310},[217,1528,1529,1531],{"class":219,"line":344},[217,1530,338],{"class":227},[217,1532,341],{"class":231},[202,1534,1536],{"id":1535},"full-control","Full Control",[198,1538,1539,1540,449,1543,1546],{},"Combine ",[214,1541,1542],{},"createBrowserDrain",[214,1544,1545],{},"createDrainPipeline"," for maximum flexibility:",[206,1548,1550],{"className":208,"code":1549,"filename":210,"language":211,"meta":212,"style":212},"import { initLogger, log } from 'evlog'\nimport type { DrainContext } from 'evlog'\nimport { createBrowserDrain } from 'evlog/browser'\nimport { createDrainPipeline } from 'evlog/pipeline'\n\nconst pipeline = createDrainPipeline\u003CDrainContext>({\n  batch: { size: 100, intervalMs: 10000 },\n  retry: { maxAttempts: 5, backoff: 'exponential' },\n  maxBufferSize: 500,\n  onDropped: (events) => {\n    console.warn(`Dropped ${events.length} browser events`)\n  },\n})\n\nconst drain = pipeline(createBrowserDrain({\n  endpoint: 'https://logs.example.com/v1/ingest',\n  timeout: 3000,\n}))\n\ninitLogger({ drain })\n\nlog.info({ action: 'app_init' })\n\n// Flush on page unload\nwindow.addEventListener('beforeunload', () => drain.flush())\n",[214,1551,1552,1574,1594,1612,1630,1634,1654,1678,1708,1720,1738,1774,1778,1784,1789,1808,1823,1836,1843,1848,1863,1868,1896,1901,1908],{"__ignoreMap":212},[217,1553,1554,1556,1558,1560,1562,1564,1566,1568,1570,1572],{"class":219,"line":220},[217,1555,224],{"class":223},[217,1557,228],{"class":227},[217,1559,232],{"class":231},[217,1561,235],{"class":227},[217,1563,238],{"class":231},[217,1565,241],{"class":227},[217,1567,244],{"class":223},[217,1569,247],{"class":227},[217,1571,251],{"class":250},[217,1573,254],{"class":227},[217,1575,1576,1578,1580,1582,1584,1586,1588,1590,1592],{"class":219,"line":257},[217,1577,224],{"class":223},[217,1579,744],{"class":223},[217,1581,228],{"class":227},[217,1583,749],{"class":231},[217,1585,241],{"class":227},[217,1587,244],{"class":223},[217,1589,247],{"class":227},[217,1591,251],{"class":250},[217,1593,254],{"class":227},[217,1595,1596,1598,1600,1602,1604,1606,1608,1610],{"class":219,"line":278},[217,1597,224],{"class":223},[217,1599,228],{"class":227},[217,1601,707],{"class":231},[217,1603,241],{"class":227},[217,1605,244],{"class":223},[217,1607,247],{"class":227},[217,1609,273],{"class":250},[217,1611,254],{"class":227},[217,1613,1614,1616,1618,1620,1622,1624,1626,1628],{"class":219,"line":285},[217,1615,224],{"class":223},[217,1617,228],{"class":227},[217,1619,726],{"class":231},[217,1621,241],{"class":227},[217,1623,244],{"class":223},[217,1625,247],{"class":227},[217,1627,735],{"class":250},[217,1629,254],{"class":227},[217,1631,1632],{"class":219,"line":307},[217,1633,282],{"emptyLinePlaceholder":281},[217,1635,1636,1638,1640,1642,1644,1646,1648,1650,1652],{"class":219,"line":335},[217,1637,289],{"class":288},[217,1639,807],{"class":231},[217,1641,295],{"class":227},[217,1643,726],{"class":298},[217,1645,814],{"class":227},[217,1647,818],{"class":817},[217,1649,821],{"class":227},[217,1651,301],{"class":231},[217,1653,304],{"class":227},[217,1655,1656,1658,1660,1662,1664,1666,1668,1670,1672,1674,1676],{"class":219,"line":344},[217,1657,830],{"class":310},[217,1659,314],{"class":227},[217,1661,228],{"class":227},[217,1663,598],{"class":310},[217,1665,314],{"class":227},[217,1667,841],{"class":603},[217,1669,235],{"class":227},[217,1671,609],{"class":310},[217,1673,314],{"class":227},[217,1675,850],{"class":603},[217,1677,332],{"class":227},[217,1679,1680,1682,1684,1686,1688,1690,1692,1694,1697,1699,1701,1704,1706],{"class":219,"line":361},[217,1681,857],{"class":310},[217,1683,314],{"class":227},[217,1685,228],{"class":227},[217,1687,864],{"class":310},[217,1689,314],{"class":227},[217,1691,869],{"class":603},[217,1693,235],{"class":227},[217,1695,1696],{"class":310}," backoff",[217,1698,314],{"class":227},[217,1700,247],{"class":227},[217,1702,1703],{"class":250},"exponential",[217,1705,329],{"class":227},[217,1707,332],{"class":227},[217,1709,1710,1713,1715,1718],{"class":219,"line":366},[217,1711,1712],{"class":310},"  maxBufferSize",[217,1714,314],{"class":227},[217,1716,1717],{"class":603}," 500",[217,1719,794],{"class":227},[217,1721,1722,1725,1727,1729,1732,1734,1736],{"class":219,"line":645},[217,1723,1724],{"class":298},"  onDropped",[217,1726,314],{"class":227},[217,1728,1277],{"class":227},[217,1730,1731],{"class":1280},"events",[217,1733,970],{"class":227},[217,1735,1291],{"class":288},[217,1737,1131],{"class":227},[217,1739,1740,1742,1744,1747,1749,1752,1755,1758,1760,1762,1765,1767,1770,1772],{"class":219,"line":874},[217,1741,1326],{"class":231},[217,1743,372],{"class":227},[217,1745,1746],{"class":298},"warn",[217,1748,301],{"class":310},[217,1750,1751],{"class":227},"`",[217,1753,1754],{"class":250},"Dropped ",[217,1756,1757],{"class":227},"${",[217,1759,1731],{"class":231},[217,1761,372],{"class":227},[217,1763,1764],{"class":231},"length",[217,1766,338],{"class":227},[217,1768,1769],{"class":250}," browser events",[217,1771,1751],{"class":227},[217,1773,341],{"class":310},[217,1775,1776],{"class":219,"line":881},[217,1777,1191],{"class":227},[217,1779,1780,1782],{"class":219,"line":886},[217,1781,338],{"class":227},[217,1783,341],{"class":231},[217,1785,1787],{"class":219,"line":1786},14,[217,1788,282],{"emptyLinePlaceholder":281},[217,1790,1792,1794,1796,1798,1800,1802,1804,1806],{"class":219,"line":1791},15,[217,1793,289],{"class":288},[217,1795,292],{"class":231},[217,1797,295],{"class":227},[217,1799,895],{"class":298},[217,1801,301],{"class":231},[217,1803,1542],{"class":298},[217,1805,301],{"class":231},[217,1807,304],{"class":227},[217,1809,1811,1813,1815,1817,1819,1821],{"class":219,"line":1810},16,[217,1812,783],{"class":310},[217,1814,314],{"class":227},[217,1816,247],{"class":227},[217,1818,326],{"class":250},[217,1820,329],{"class":227},[217,1822,794],{"class":227},[217,1824,1826,1829,1831,1834],{"class":219,"line":1825},17,[217,1827,1828],{"class":310},"  timeout",[217,1830,314],{"class":227},[217,1832,1833],{"class":603}," 3000",[217,1835,794],{"class":227},[217,1837,1839,1841],{"class":219,"line":1838},18,[217,1840,338],{"class":227},[217,1842,1357],{"class":231},[217,1844,1846],{"class":219,"line":1845},19,[217,1847,282],{"emptyLinePlaceholder":281},[217,1849,1851,1853,1855,1857,1859,1861],{"class":219,"line":1850},20,[217,1852,347],{"class":298},[217,1854,301],{"class":231},[217,1856,352],{"class":227},[217,1858,292],{"class":231},[217,1860,338],{"class":227},[217,1862,341],{"class":231},[217,1864,1866],{"class":219,"line":1865},21,[217,1867,282],{"emptyLinePlaceholder":281},[217,1869,1871,1873,1875,1877,1879,1881,1883,1885,1887,1890,1892,1894],{"class":219,"line":1870},22,[217,1872,369],{"class":231},[217,1874,372],{"class":227},[217,1876,375],{"class":298},[217,1878,301],{"class":231},[217,1880,352],{"class":227},[217,1882,382],{"class":310},[217,1884,314],{"class":227},[217,1886,247],{"class":227},[217,1888,1889],{"class":250},"app_init",[217,1891,329],{"class":227},[217,1893,241],{"class":227},[217,1895,341],{"class":231},[217,1897,1899],{"class":219,"line":1898},23,[217,1900,282],{"emptyLinePlaceholder":281},[217,1902,1904],{"class":219,"line":1903},24,[217,1905,1907],{"class":1906},"sHwdD","// Flush on page unload\n",[217,1909,1911,1914,1916,1919,1921,1923,1926,1928,1930,1933,1935,1938,1940,1943],{"class":219,"line":1910},25,[217,1912,1913],{"class":231},"window",[217,1915,372],{"class":227},[217,1917,1918],{"class":298},"addEventListener",[217,1920,301],{"class":231},[217,1922,329],{"class":227},[217,1924,1925],{"class":250},"beforeunload",[217,1927,329],{"class":227},[217,1929,235],{"class":227},[217,1931,1932],{"class":227}," ()",[217,1934,1291],{"class":288},[217,1936,1937],{"class":231}," drain",[217,1939,372],{"class":227},[217,1941,1942],{"class":298},"flush",[217,1944,1945],{"class":231},"())\n",[1079,1947,1950,1951,1958],{"color":1948,"icon":1949},"neutral","i-lucide-arrow-right","See the full ",[1952,1953,1957],"a",{"href":1954,"rel":1955},"https://github.com/HugoRCD/evlog/tree/main/examples/browser",[1956],"nofollow","browser example"," for a working Hono server + browser page that demonstrates the complete flow end to end.",[1079,1960,1961,1962,1965],{"color":1948,"icon":104},"See the ",[1952,1963,1964],{"href":153},"Next.js example"," for a working implementation.",[202,1967,1969],{"id":1968},"next-steps","Next Steps",[1971,1972,1973,1979,1984],"ul",{},[419,1974,1975,1978],{},[1952,1976,1977],{"href":72},"Adapters Overview"," — Available built-in adapters",[419,1980,1981,1983],{},[1952,1982,106],{"href":107}," — Batching, retry, and buffer overflow handling",[419,1985,1986,1988],{},[1952,1987,101],{"href":102}," — Build your own drain function",[1990,1991,1992],"style",{},"html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}",{"title":212,"searchDepth":257,"depth":257,"links":1994},[1995,1996,1997,2001,2005,2006,2007,2011,2012],{"id":204,"depth":257,"text":20},{"id":413,"depth":257,"text":414},{"id":474,"depth":257,"text":475,"children":1998},[1999,2000],{"id":479,"depth":278,"text":482},{"id":687,"depth":278,"text":690},{"id":901,"depth":257,"text":902,"children":2002},[2003,2004],{"id":905,"depth":278,"text":908},{"id":1007,"depth":278,"text":1010},{"id":1076,"depth":257,"text":1077},{"id":1099,"depth":257,"text":1100},{"id":1224,"depth":257,"text":1225,"children":2008},[2009,2010],{"id":1234,"depth":278,"text":172},{"id":1388,"depth":278,"text":177},{"id":1535,"depth":257,"text":1536},{"id":1968,"depth":257,"text":1969},"Framework-agnostic browser log transport for sending client-side logs to your server via fetch or sendBeacon. Works with any frontend stack.","md",[2016,2018],{"label":1977,"icon":74,"to":72,"color":1948,"variant":2017},"subtle",{"label":106,"icon":109,"to":107,"color":1948,"variant":2017},{},{"title":111,"icon":114},{"title":193,"description":2013},"bRdRvOvX4y5ED0YNG3DN03sFBWNFR3WDEEIGEUhJ2gE",[2024,2026],{"title":106,"path":107,"stem":108,"description":2025,"icon":109,"children":-1},"Batch events, retry on failure, and protect against buffer overflow with the shared drain pipeline. Supports fan-out to multiple adapters.",{"title":71,"path":121,"stem":122,"description":2027,"icon":28,"children":-1},"Enrich your wide events with derived context like user agent, geo data, request size, and trace context. Built-in enrichers and custom enricher support.",1772901887841]