[{"data":1,"prerenderedAt":854},["ShallowReactive",2],{"navigation":3,"-guide-basics-routing":179,"-guide-basics-routing-surround":849},[4,86,128,156,163],{"title":5,"path":6,"stem":7,"children":8,"icon":85},"Guide","/guide","1.guide/0.index",[9,12,48,64],{"title":10,"path":6,"stem":7,"icon":11},"Getting Started","pixel:play",{"title":5,"icon":13,"path":14,"stem":15,"children":16,"page":47},"ph:book-open-duotone","/guide/basics","1.guide/1.basics",[17,22,27,32,37,42],{"title":18,"path":19,"stem":20,"icon":21},"Request Lifecycle","/guide/basics/lifecycle","1.guide/1.basics/1.lifecycle","icon-park-outline:handle-round",{"title":23,"path":24,"stem":25,"icon":26},"Routing","/guide/basics/routing","1.guide/1.basics/2.routing","solar:routing-bold",{"title":28,"path":29,"stem":30,"icon":31},"Middleware","/guide/basics/middleware","1.guide/1.basics/3.middleware","mdi:middleware-outline",{"title":33,"path":34,"stem":35,"icon":36},"Event Handlers","/guide/basics/handler","1.guide/1.basics/4.handler","mdi:function",{"title":38,"path":39,"stem":40,"icon":41},"Sending Response","/guide/basics/response","1.guide/1.basics/5.response","tabler:json",{"title":43,"path":44,"stem":45,"icon":46},"Error Handling","/guide/basics/error","1.guide/1.basics/6.error","tabler:error-404",false,{"title":49,"icon":50,"path":51,"stem":52,"children":53,"page":47},"API","material-symbols-light:api-rounded","/guide/api","1.guide/900.api",[54,59],{"title":55,"path":56,"stem":57,"icon":58},"H3","/guide/api/h3","1.guide/900.api/1.h3","material-symbols:bolt-rounded",{"title":60,"path":61,"stem":62,"icon":63},"H3Event","/guide/api/h3event","1.guide/900.api/2.h3event","material-symbols:data-object-rounded",{"title":65,"icon":66,"path":67,"stem":68,"children":69,"page":47},"Advanced","hugeicons:more-01","/guide/advanced","1.guide/901.advanced",[70,75,80],{"title":71,"path":72,"stem":73,"icon":74},"Plugins","/guide/advanced/plugins","1.guide/901.advanced/1.plugins","clarity:plugin-line",{"title":76,"path":77,"stem":78,"icon":79},"WebSockets","/guide/advanced/websocket","1.guide/901.advanced/2.websocket","hugeicons:live-streaming-02",{"title":81,"path":82,"stem":83,"icon":84},"Nightly Builds","/guide/advanced/nightly","1.guide/901.advanced/9.nightly","game-icons:barn-owl","i-ph:book-open-duotone",{"title":87,"path":88,"stem":89,"children":90,"icon":92},"H3 Utils","/utils","2.utils/0.index",[91,93,98,103,108,113,118,123],{"title":87,"path":88,"stem":89,"icon":92},"ph:function-bold",{"title":94,"path":95,"stem":96,"icon":97},"Request","/utils/request","2.utils/1.request","material-symbols-light:input",{"title":99,"path":100,"stem":101,"icon":102},"Response","/utils/response","2.utils/2.response","material-symbols-light:output",{"title":104,"path":105,"stem":106,"icon":107},"Cookie","/utils/cookie","2.utils/3.cookie","material-symbols:cookie-outline",{"title":109,"path":110,"stem":111,"icon":112},"Security","/utils/security","2.utils/4.security","wpf:key-security",{"title":114,"path":115,"stem":116,"icon":117},"Proxy","/utils/proxy","2.utils/5.proxy","arcticons:super-proxy",{"title":119,"path":120,"stem":121,"icon":122},"More utils","/utils/more","2.utils/9.more","mingcute:plus-line",{"title":124,"path":125,"stem":126,"icon":127},"Community","/utils/community","2.utils/99.community","lets-icons:external",{"title":129,"path":130,"stem":131,"children":132,"icon":134},"Examples","/examples","4.examples/0.index",[133,135,140,144,148,152],{"title":129,"path":130,"stem":131,"icon":134},"ph:code",{"title":136,"path":137,"stem":138,"icon":139},"Cookies","/examples/handle-cookie","4.examples/handle-cookie","ph:arrow-right",{"title":141,"path":142,"stem":143,"icon":139},"Sessions","/examples/handle-session","4.examples/handle-session",{"title":145,"path":146,"stem":147,"icon":139},"Static Assets","/examples/serve-static-assets","4.examples/serve-static-assets",{"title":149,"path":150,"stem":151,"icon":139},"Stream Response","/examples/stream-response","4.examples/stream-response",{"title":153,"path":154,"stem":155,"icon":139},"Validate Data","/examples/validate-data","4.examples/validate-data",{"title":157,"path":158,"stem":159,"children":160,"icon":162},"Migration guide for v1 to v2","/migration","5.migration/0.index",[161],{"title":157,"path":158,"stem":159,"icon":162},"icons8:up-round",{"title":164,"path":165,"stem":166,"children":167,"page":-1},"Blog","/blog","99.blog",[168,171,175],{"title":164,"path":165,"stem":169,"icon":170},"99.blog/index","i-lucide-file-text",{"title":172,"path":173,"stem":174,"icon":170},"H3 1.8 - Towards the Edge of the Web","/blog/v1.8","99.blog/1.v1.8",{"title":176,"path":177,"stem":178,"icon":170},"H3 v2 beta","/blog/v2-beta","99.blog/2.v2-beta",{"id":180,"title":23,"body":181,"description":843,"extension":844,"meta":845,"navigation":846,"path":24,"seo":847,"stem":25,"__hash__":848},"content/1.guide/1.basics/2.routing.md",{"type":182,"value":183,"toc":837,"icon":26},"minimark",[184,189,224,237,252,340,343,417,425,473,477,484,553,564,593,597,619,665,678,687,691,694,822,833],[185,186,188],"h2",{"id":187},"adding-routes","Adding Routes",[190,191,192,193,197,198,201,202,209,210,216,217,223],"p",{},"You can register route ",[194,195,196],"a",{"href":34},"handlers"," to ",[194,199,200],{"href":56},"H3 instance"," using ",[194,203,205],{"href":204},"/guide/api/h3#h3on",[206,207,208],"code",{},"H3.on",", ",[194,211,213],{"href":212},"/guide/api/h3#h3method",[206,214,215],{},"H3.[method]",", or ",[194,218,220],{"href":219},"/guide/api/h3#h3all",[206,221,222],{},"H3.all",".",[225,226,227],"tip",{},[190,228,229,230,236],{},"\nRouter is powered by ",[194,231,235],{"href":232,"rel":233},"https://github.com/h3js/rou3",[234],"nofollow","🌳 Rou3",", an ultra-fast and tiny route matcher engine.",[190,238,239,243,244,247,248,251],{},[240,241,242],"strong",{},"Example:"," Register a route to match requests to the ",[206,245,246],{},"/hello"," endpoint with HTTP ",[240,249,250],{},"GET"," method.",[253,254,255,305],"ul",{},[256,257,258,259,263],"li",{},"Using ",[194,260,261],{"href":212},[206,262,215],{},[264,265,270],"pre",{"className":266,"code":267,"language":268,"meta":269,"style":269},"language-js shiki shiki-themes github-light github-dark github-dark","app.get(\"/hello\", () => \"Hello world!\");\n","js","",[206,271,272],{"__ignoreMap":269},[273,274,277,281,285,288,292,295,299,302],"span",{"class":275,"line":276},"line",1,[273,278,280],{"class":279},"slsVL","app.",[273,282,284],{"class":283},"shcOC","get",[273,286,287],{"class":279},"(",[273,289,291],{"class":290},"sfrk1","\"/hello\"",[273,293,294],{"class":279},", () ",[273,296,298],{"class":297},"so5gQ","=>",[273,300,301],{"class":290}," \"Hello world!\"",[273,303,304],{"class":279},");\n",[256,306,258,307,311],{},[194,308,309],{"href":204},[206,310,208],{},[264,312,314],{"className":266,"code":313,"language":268,"meta":269,"style":269},"app.on(\"GET\", \"/hello\", () => \"Hello world!\");\n",[206,315,316],{"__ignoreMap":269},[273,317,318,320,323,325,328,330,332,334,336,338],{"class":275,"line":276},[273,319,280],{"class":279},[273,321,322],{"class":283},"on",[273,324,287],{"class":279},[273,326,327],{"class":290},"\"GET\"",[273,329,209],{"class":279},[273,331,291],{"class":290},[273,333,294],{"class":279},[273,335,298],{"class":297},[273,337,301],{"class":290},[273,339,304],{"class":279},[190,341,342],{},"You can register multiple event handlers for the same route with different methods:",[264,344,346],{"className":266,"code":345,"language":268,"meta":269,"style":269},"app\n  .get(\"/hello\", () => \"GET Hello world!\")\n  .post(\"/hello\", () => \"POST Hello world!\")\n  .any(\"/hello\", () => \"Any other method!\");\n",[206,347,348,353,375,396],{"__ignoreMap":269},[273,349,350],{"class":275,"line":276},[273,351,352],{"class":279},"app\n",[273,354,356,359,361,363,365,367,369,372],{"class":275,"line":355},2,[273,357,358],{"class":279},"  .",[273,360,284],{"class":283},[273,362,287],{"class":279},[273,364,291],{"class":290},[273,366,294],{"class":279},[273,368,298],{"class":297},[273,370,371],{"class":290}," \"GET Hello world!\"",[273,373,374],{"class":279},")\n",[273,376,378,380,383,385,387,389,391,394],{"class":275,"line":377},3,[273,379,358],{"class":279},[273,381,382],{"class":283},"post",[273,384,287],{"class":279},[273,386,291],{"class":290},[273,388,294],{"class":279},[273,390,298],{"class":297},[273,392,393],{"class":290}," \"POST Hello world!\"",[273,395,374],{"class":279},[273,397,399,401,404,406,408,410,412,415],{"class":275,"line":398},4,[273,400,358],{"class":279},[273,402,403],{"class":283},"any",[273,405,287],{"class":279},[273,407,291],{"class":290},[273,409,294],{"class":279},[273,411,298],{"class":297},[273,413,414],{"class":290}," \"Any other method!\"",[273,416,304],{"class":279},[190,418,419,420,424],{},"You can also use ",[194,421,422],{"href":219},[206,423,222],{}," method to register a route accepting any HTTP method:",[264,426,428],{"className":266,"code":427,"language":268,"meta":269,"style":269},"app.all(\"/hello\", (event) => `This is a ${event.req.method} request!`);\n",[206,429,430],{"__ignoreMap":269},[273,431,432,434,437,439,441,444,448,451,453,456,458,460,463,465,468,471],{"class":275,"line":276},[273,433,280],{"class":279},[273,435,436],{"class":283},"all",[273,438,287],{"class":279},[273,440,291],{"class":290},[273,442,443],{"class":279},", (",[273,445,447],{"class":446},"sQHwn","event",[273,449,450],{"class":279},") ",[273,452,298],{"class":297},[273,454,455],{"class":290}," `This is a ${",[273,457,447],{"class":279},[273,459,223],{"class":290},[273,461,462],{"class":279},"req",[273,464,223],{"class":290},[273,466,467],{"class":279},"method",[273,469,470],{"class":290},"} request!`",[273,472,304],{"class":279},[185,474,476],{"id":475},"dynamic-routes","Dynamic Routes",[190,478,479,480,483],{},"You can define dynamic route parameters using ",[206,481,482],{},":"," prefix:",[264,485,487],{"className":266,"code":486,"language":268,"meta":269,"style":269},"// [GET] /hello/Bob => \"Hello, Bob!\"\napp.get(\"/hello/:name\", (event) => {\n  return `Hello, ${event.context.params.name}!`;\n});\n",[206,488,489,495,517,548],{"__ignoreMap":269},[273,490,491],{"class":275,"line":276},[273,492,494],{"class":493},"sCsY4","// [GET] /hello/Bob => \"Hello, Bob!\"\n",[273,496,497,499,501,503,506,508,510,512,514],{"class":275,"line":355},[273,498,280],{"class":279},[273,500,284],{"class":283},[273,502,287],{"class":279},[273,504,505],{"class":290},"\"/hello/:name\"",[273,507,443],{"class":279},[273,509,447],{"class":446},[273,511,450],{"class":279},[273,513,298],{"class":297},[273,515,516],{"class":279}," {\n",[273,518,519,522,525,527,529,532,534,537,539,542,545],{"class":275,"line":377},[273,520,521],{"class":297},"  return",[273,523,524],{"class":290}," `Hello, ${",[273,526,447],{"class":279},[273,528,223],{"class":290},[273,530,531],{"class":279},"context",[273,533,223],{"class":290},[273,535,536],{"class":279},"params",[273,538,223],{"class":290},[273,540,541],{"class":279},"name",[273,543,544],{"class":290},"}!`",[273,546,547],{"class":279},";\n",[273,549,550],{"class":275,"line":398},[273,551,552],{"class":279},"});\n",[190,554,555,556,559,560,563],{},"Instead of named parameters, you can use ",[206,557,558],{},"*"," for unnamed ",[240,561,562],{},"optional"," parameters:",[264,565,567],{"className":266,"code":566,"language":268,"meta":269,"style":269},"app.get(\"/hello/*\", (event) => `Hello!`);\n",[206,568,569],{"__ignoreMap":269},[273,570,571,573,575,577,580,582,584,586,588,591],{"class":275,"line":276},[273,572,280],{"class":279},[273,574,284],{"class":283},[273,576,287],{"class":279},[273,578,579],{"class":290},"\"/hello/*\"",[273,581,443],{"class":279},[273,583,447],{"class":446},[273,585,450],{"class":279},[273,587,298],{"class":297},[273,589,590],{"class":290}," `Hello!`",[273,592,304],{"class":279},[185,594,596],{"id":595},"wildcard-routes","Wildcard Routes",[190,598,599,600,603,604,607,608,611,612,615,616,483],{},"Adding ",[206,601,602],{},"/hello/:name"," route will match ",[206,605,606],{},"/hello/world"," or ",[206,609,610],{},"/hello/123",". But it will not match ",[206,613,614],{},"/hello/foo/bar",".\nWhen you need to match multiple levels of sub routes, you can use ",[206,617,618],{},"**",[264,620,622],{"className":266,"code":621,"language":268,"meta":269,"style":269},"app.get(\"/hello/**\", (event) => `Hello ${event.context.params._}!`);\n",[206,623,624],{"__ignoreMap":269},[273,625,626,628,630,632,635,637,639,641,643,646,648,650,652,654,656,658,661,663],{"class":275,"line":276},[273,627,280],{"class":279},[273,629,284],{"class":283},[273,631,287],{"class":279},[273,633,634],{"class":290},"\"/hello/**\"",[273,636,443],{"class":279},[273,638,447],{"class":446},[273,640,450],{"class":279},[273,642,298],{"class":297},[273,644,645],{"class":290}," `Hello ${",[273,647,447],{"class":279},[273,649,223],{"class":290},[273,651,531],{"class":279},[273,653,223],{"class":290},[273,655,536],{"class":279},[273,657,223],{"class":290},[273,659,660],{"class":279},"_",[273,662,544],{"class":290},[273,664,304],{"class":279},[190,666,667,668,209,670,209,672,209,674,677],{},"This will match ",[206,669,246],{},[206,671,606],{},[206,673,610],{},[206,675,676],{},"/hello/world/123",", etc.",[679,680,681],"note",{},[190,682,683,684,686],{},"\nParam ",[206,685,660],{}," will store the full wildcard content as a single string.",[185,688,690],{"id":689},"route-meta","Route Meta",[190,692,693],{},"You can define optional route meta when registering them, accessible from any middleware.",[264,695,697],{"className":266,"code":696,"language":268,"meta":269,"style":269},"import { H3 } from \"h3\";\n\nconst app = new H3();\n\napp.use((event) => {\n  console.log(event.context.matchedRoute?.meta); // { auth: true }\n});\n\napp.get(\"/\", (event) => \"Hi!\", { meta: { auth: true } });\n",[206,698,699,715,721,742,746,765,780,785,790],{"__ignoreMap":269},[273,700,701,704,707,710,713],{"class":275,"line":276},[273,702,703],{"class":297},"import",[273,705,706],{"class":279}," { H3 } ",[273,708,709],{"class":297},"from",[273,711,712],{"class":290}," \"h3\"",[273,714,547],{"class":279},[273,716,717],{"class":275,"line":355},[273,718,720],{"emptyLinePlaceholder":719},true,"\n",[273,722,723,726,730,733,736,739],{"class":275,"line":377},[273,724,725],{"class":297},"const",[273,727,729],{"class":728},"suiK_"," app",[273,731,732],{"class":297}," =",[273,734,735],{"class":297}," new",[273,737,738],{"class":283}," H3",[273,740,741],{"class":279},"();\n",[273,743,744],{"class":275,"line":398},[273,745,720],{"emptyLinePlaceholder":719},[273,747,749,751,754,757,759,761,763],{"class":275,"line":748},5,[273,750,280],{"class":279},[273,752,753],{"class":283},"use",[273,755,756],{"class":279},"((",[273,758,447],{"class":446},[273,760,450],{"class":279},[273,762,298],{"class":297},[273,764,516],{"class":279},[273,766,768,771,774,777],{"class":275,"line":767},6,[273,769,770],{"class":279},"  console.",[273,772,773],{"class":283},"log",[273,775,776],{"class":279},"(event.context.matchedRoute?.meta); ",[273,778,779],{"class":493},"// { auth: true }\n",[273,781,783],{"class":275,"line":782},7,[273,784,552],{"class":279},[273,786,788],{"class":275,"line":787},8,[273,789,720],{"emptyLinePlaceholder":719},[273,791,793,795,797,799,802,804,806,808,810,813,816,819],{"class":275,"line":792},9,[273,794,280],{"class":279},[273,796,284],{"class":283},[273,798,287],{"class":279},[273,800,801],{"class":290},"\"/\"",[273,803,443],{"class":279},[273,805,447],{"class":446},[273,807,450],{"class":279},[273,809,298],{"class":297},[273,811,812],{"class":290}," \"Hi!\"",[273,814,815],{"class":279},", { meta: { auth: ",[273,817,818],{"class":728},"true",[273,820,821],{"class":279}," } });\n",[823,824,826],"read-more",{"to":825},"/guide/basics/handler#meta",[190,827,828,829,832],{},"It is also possible to add route meta when defining them using ",[206,830,831],{},"defineHandler"," object syntax.",[834,835,836],"style",{},"html pre.shiki code .slsVL, html code.shiki .slsVL{--shiki-light:#24292E;--shiki-default:#E1E4E8;--shiki-dark:#E1E4E8}html pre.shiki code .shcOC, html code.shiki .shcOC{--shiki-light:#6F42C1;--shiki-default:#B392F0;--shiki-dark:#B392F0}html pre.shiki code .sfrk1, html code.shiki .sfrk1{--shiki-light:#032F62;--shiki-default:#9ECBFF;--shiki-dark:#9ECBFF}html pre.shiki code .so5gQ, html code.shiki .so5gQ{--shiki-light:#D73A49;--shiki-default:#F97583;--shiki-dark:#F97583}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 .sQHwn, html code.shiki .sQHwn{--shiki-light:#E36209;--shiki-default:#FFAB70;--shiki-dark:#FFAB70}html pre.shiki code .sCsY4, html code.shiki .sCsY4{--shiki-light:#6A737D;--shiki-default:#6A737D;--shiki-dark:#6A737D}html pre.shiki code .suiK_, html code.shiki .suiK_{--shiki-light:#005CC5;--shiki-default:#79B8FF;--shiki-dark:#79B8FF}",{"title":269,"searchDepth":355,"depth":355,"links":838},[839,840,841,842],{"id":187,"depth":355,"text":188},{"id":475,"depth":355,"text":476},{"id":595,"depth":355,"text":596},{"id":689,"depth":355,"text":690},"Each request is matched to one (most specific) route handler.","md",{"icon":26},{"icon":26},{"title":23,"description":843},"vKQhsoc0xJLli2SwQWEQtFgzx47NWsAYFcxGGcOqdqw",[850,852],{"title":18,"path":19,"stem":20,"description":851,"icon":21,"children":-1},"H3 dispatches incoming web requests to final web responses.",{"title":28,"path":29,"stem":30,"description":853,"icon":31,"children":-1},"Intercept request, response and errors using H3 middleware.",1750976022159]