[{"data":1,"prerenderedAt":745},["ShallowReactive",2],{"guide-url-structure-explained":3},{"id":4,"title":5,"body":6,"date":735,"description":736,"extension":737,"meta":738,"navigation":739,"path":740,"readingTime":741,"seo":742,"stem":743,"__hash__":744},"guides\u002Fguides\u002Furl-structure-explained.md","URL Structure Explained: Every Part of a Web Address",{"type":7,"value":8,"toc":708},"minimark",[9,14,18,21,32,35,39,42,48,197,201,227,233,242,246,254,258,261,267,270,273,310,313,319,322,325,331,334,337,340,346,356,360,363,421,428,432,443,449,458,461,464,470,473,489,493,496,541,544,550,554,564,570,573,577,581,584,590,597,603,609,613,623,629,632,636,644,647,651,674,678,696,700],[10,11,13],"h2",{"id":12},"what-is-a-url","What Is a URL?",[15,16,17],"p",{},"A URL (Uniform Resource Locator) is the address you type into a browser to reach a specific resource on the internet. Every web page, image, and API endpoint has one. Understanding URL structure helps you debug routing issues, build correct links, and communicate with APIs confidently.",[15,19,20],{},"RFC 3986 defines the general syntax:",[22,23,28],"pre",{"className":24,"code":26,"language":27},[25],"language-text","scheme:\u002F\u002Fauthority\u002Fpath?query#fragment\n","text",[29,30,26],"code",{"__ignoreMap":31},"",[15,33,34],{},"Each part serves a distinct purpose. Let's break them down.",[10,36,38],{"id":37},"the-components-of-a-url","The Components of a URL",[15,40,41],{},"Here is a complete URL with every possible component:",[22,43,46],{"className":44,"code":45,"language":27},[25],"https:\u002F\u002Fuser:pass@example.com:8080\u002Fdocs\u002Fapi?q=hello&lang=en#results\n",[29,47,45],{"__ignoreMap":31},[49,50,51,70],"table",{},[52,53,54],"thead",{},[55,56,57,61,64,67],"tr",{},[58,59,60],"th",{},"Component",[58,62,63],{},"Format",[58,65,66],{},"Example",[58,68,69],{},"Required?",[71,72,73,92,109,124,141,163,180],"tbody",{},[55,74,75,79,84,89],{},[76,77,78],"td",{},"Scheme",[76,80,81],{},[29,82,83],{},"protocol:",[76,85,86],{},[29,87,88],{},"https:",[76,90,91],{},"Yes",[55,93,94,97,102,106],{},[76,95,96],{},"User Info",[76,98,99],{},[29,100,101],{},"user:pass@",[76,103,104],{},[29,105,101],{},[76,107,108],{},"No",[55,110,111,114,117,122],{},[76,112,113],{},"Hostname",[76,115,116],{},"domain or IP",[76,118,119],{},[29,120,121],{},"example.com",[76,123,91],{},[55,125,126,129,134,139],{},[76,127,128],{},"Port",[76,130,131],{},[29,132,133],{},":number",[76,135,136],{},[29,137,138],{},":8080",[76,140,108],{},[55,142,143,146,151,156],{},[76,144,145],{},"Path",[76,147,148],{},[29,149,150],{},"\u002Fsegment\u002F...",[76,152,153],{},[29,154,155],{},"\u002Fdocs\u002Fapi",[76,157,158,159,162],{},"No (defaults to ",[29,160,161],{},"\u002F",")",[55,164,165,168,173,178],{},[76,166,167],{},"Query",[76,169,170],{},[29,171,172],{},"?key=value&...",[76,174,175],{},[29,176,177],{},"?q=hello&lang=en",[76,179,108],{},[55,181,182,185,190,195],{},[76,183,184],{},"Fragment",[76,186,187],{},[29,188,189],{},"#identifier",[76,191,192],{},[29,193,194],{},"#results",[76,196,108],{},[10,198,200],{"id":199},"scheme-protocol","Scheme (Protocol)",[15,202,203,204,207,208,211,212,215,216,215,219,222,223,226],{},"The scheme tells the browser which protocol to use. The two most common schemes on the web are ",[29,205,206],{},"http"," and ",[29,209,210],{},"https",". Other examples include ",[29,213,214],{},"ftp",", ",[29,217,218],{},"mailto",[29,220,221],{},"file",", and ",[29,224,225],{},"ws"," (WebSocket).",[22,228,231],{"className":229,"code":230,"language":27},[25],"https:\u002F\u002Fexample.com\n^^^^^^\nscheme\n",[29,232,230],{"__ignoreMap":31},[15,234,235,236,238,239,241],{},"Always use ",[29,237,210],{}," in production. Modern browsers flag ",[29,240,206],{}," sites as insecure, and search engines rank HTTPS pages higher.",[10,243,245],{"id":244},"authority-host-and-port","Authority (Host and Port)",[15,247,248,249,253],{},"The authority section contains the hostname, optional port, and optional user info. It tells the browser ",[250,251,252],"strong",{},"where"," to connect.",[255,256,113],"h3",{"id":257},"hostname",[15,259,260],{},"The hostname identifies the server. It can be a domain name or an IP address.",[22,262,265],{"className":263,"code":264,"language":27},[25],"https:\u002F\u002Fexample.com       → domain name\nhttps:\u002F\u002F192.168.1.1       → IPv4 address\nhttps:\u002F\u002F[::1]             → IPv6 address (brackets required)\n",[29,266,264],{"__ignoreMap":31},[255,268,128],{"id":269},"port",[15,271,272],{},"Ports differentiate services running on the same machine. Most of the time you omit them because browsers use default ports:",[49,274,275,284],{},[52,276,277],{},[55,278,279,281],{},[58,280,78],{},[58,282,283],{},"Default Port",[71,285,286,294,302],{},[55,287,288,291],{},[76,289,290],{},"HTTP",[76,292,293],{},"80",[55,295,296,299],{},[76,297,298],{},"HTTPS",[76,300,301],{},"443",[55,303,304,307],{},[76,305,306],{},"FTP",[76,308,309],{},"21",[15,311,312],{},"You only specify a port when it differs from the default:",[22,314,317],{"className":315,"code":316,"language":27},[25],"https:\u002F\u002Fexample.com:8080   → custom port\nhttps:\u002F\u002Fexample.com        → defaults to 443\n",[29,318,316],{"__ignoreMap":31},[255,320,96],{"id":321},"user-info",[15,323,324],{},"Rarely seen in browsers, user info appears in database URLs and internal service addresses:",[22,326,329],{"className":327,"code":328,"language":27},[25],"postgresql:\u002F\u002Fadmin:secret@db.internal:5432\u002Fmydb\n",[29,330,328],{"__ignoreMap":31},[15,332,333],{},"Avoid putting credentials in URLs for public-facing applications. They appear in server logs, browser history, and referrer headers.",[10,335,145],{"id":336},"path",[15,338,339],{},"The path identifies a specific resource on the server. It resembles a filesystem path but is defined by the server's routing logic — not an actual file on disk.",[22,341,344],{"className":342,"code":343,"language":27},[25],"https:\u002F\u002Fexample.com\u002Fdocs\u002Fapi\u002Fusers\n                     ^^^^^^^^^^^^^^\n                     path\n",[29,345,343],{"__ignoreMap":31},[15,347,348,349,207,352,355],{},"Paths are case-sensitive on most servers. ",[29,350,351],{},"\u002FDocs",[29,353,354],{},"\u002Fdocs"," may point to different resources.",[255,357,359],{"id":358},"path-encoding","Path Encoding",[15,361,362],{},"Certain characters in paths require percent-encoding:",[49,364,365,378],{},[52,366,367],{},[55,368,369,372,375],{},[58,370,371],{},"Character",[58,373,374],{},"Encoded",[58,376,377],{},"Reason",[71,379,380,393,408],{},[55,381,382,385,390],{},[76,383,384],{},"Space",[76,386,387],{},[29,388,389],{},"%20",[76,391,392],{},"Spaces are illegal in URLs",[55,394,395,400,405],{},[76,396,397],{},[29,398,399],{},"%",[76,401,402],{},[29,403,404],{},"%25",[76,406,407],{},"The percent sign starts an encoding",[55,409,410,413,418],{},[76,411,412],{},"Non-ASCII",[76,414,415],{},[29,416,417],{},"%XX%XX",[76,419,420],{},"Unicode uses UTF-8 byte encoding",[15,422,423,424,427],{},"Use hyphens ",[29,425,426],{},"-"," instead of spaces or underscores in URL paths for better readability and SEO.",[10,429,431],{"id":430},"query-string","Query String",[15,433,434,435,438,439,442],{},"The query string passes data to the server. It starts with ",[29,436,437],{},"?"," and contains key-value pairs separated by ",[29,440,441],{},"&",":",[22,444,447],{"className":445,"code":446,"language":27},[25],"?q=hello&lang=en&page=2\n^                     ^\nstart                end\n",[29,448,446],{"__ignoreMap":31},[15,450,451,452,457],{},"Query parameters handle search terms, filters, pagination, and tracking codes. For a deep dive into encoding and best practices, see our ",[453,454,456],"a",{"href":455},"\u002Fguides\u002Fquery-parameters-guide","Query Parameters Guide",".",[10,459,184],{"id":460},"fragment",[15,462,463],{},"The fragment (or anchor) points to a specific section within a page:",[22,465,468],{"className":466,"code":467,"language":27},[25],"https:\u002F\u002Fexample.com\u002Fdocs#installation\n                     ^^^^^^^^^^^^^^^^\n                     fragment\n",[29,469,467],{"__ignoreMap":31},[15,471,472],{},"Key facts about fragments:",[474,475,476,480,486],"ul",{},[477,478,479],"li",{},"The browser never sends the fragment to the server",[477,481,482,483],{},"JavaScript reads it via ",[29,484,485],{},"window.location.hash",[477,487,488],{},"Clicking a fragment link scrolls the page without a full reload",[10,490,492],{"id":491},"relative-vs-absolute-urls","Relative vs Absolute URLs",[15,494,495],{},"URLs come in two forms:",[49,497,498,510],{},[52,499,500],{},[55,501,502,505,507],{},[58,503,504],{},"Type",[58,506,66],{},[58,508,509],{},"When to Use",[71,511,512,525],{},[55,513,514,517,522],{},[76,515,516],{},"Absolute",[76,518,519],{},[29,520,521],{},"https:\u002F\u002Fexample.com\u002Fdocs\u002Fapi",[76,523,524],{},"External links, cross-origin references",[55,526,527,530,538],{},[76,528,529],{},"Relative",[76,531,532,534,535],{},[29,533,155],{}," or ",[29,536,537],{},"..\u002Fapi",[76,539,540],{},"Internal links within the same site",[15,542,543],{},"Relative URLs resolve against the current page's base URL. Use relative paths for internal navigation — they survive domain changes and work across environments.",[22,545,548],{"className":546,"code":547,"language":27},[25],"\u003C!-- Absolute — breaks if domain changes -->\n\u003Ca href=\"https:\u002F\u002Fexample.com\u002Fabout\">About\u003C\u002Fa>\n\n\u003C!-- Relative — works on any domain -->\n\u003Ca href=\"\u002Fabout\">About\u003C\u002Fa>\n",[29,549,547],{"__ignoreMap":31},[10,551,553],{"id":552},"internationalized-domain-names-idn","Internationalized Domain Names (IDN)",[15,555,556,557,534,560,563],{},"Domain names can contain non-ASCII characters like ",[29,558,559],{},"münchen.de",[29,561,562],{},"中国.cn",". Browsers display the Unicode form but send the ASCII-compatible encoding (Punycode) to DNS:",[22,565,568],{"className":566,"code":567,"language":27},[25],"Display: münchen.de\nActual:  xn--mnchen-3ya.de\n",[29,569,567],{"__ignoreMap":31},[15,571,572],{},"You must register the Punycode version with your DNS provider. Most registrars handle this conversion automatically.",[10,574,576],{"id":575},"common-url-pitfalls","Common URL Pitfalls",[255,578,580],{"id":579},"default-port-confusion","Default Port Confusion",[15,582,583],{},"Omitting a default port and specifying it produce the same origin:",[22,585,588],{"className":586,"code":587,"language":27},[25],"https:\u002F\u002Fexample.com       ← same origin →\nhttps:\u002F\u002Fexample.com:443\n",[29,589,587],{"__ignoreMap":31},[15,591,592,593,596],{},"But non-default ports create ",[250,594,595],{},"different"," origins:",[22,598,601],{"className":599,"code":600,"language":27},[25],"https:\u002F\u002Fexample.com       ← different origin →\nhttps:\u002F\u002Fexample.com:8443\n",[29,602,600],{"__ignoreMap":31},[15,604,605,606,457],{},"This matters for CORS, cookies, and ",[29,607,608],{},"localStorage",[255,610,612],{"id":611},"path-encoding-differences","Path Encoding Differences",[15,614,615,616,619,620,622],{},"Not all encoded paths are equivalent. Some servers decode ",[29,617,618],{},"%2F"," (",[29,621,161],{},") in paths, while others treat it as a literal character:",[22,624,627],{"className":625,"code":626,"language":27},[25],"\u002Fapi\u002Fusers%2Fadmin   → might route to \u002Fapi\u002Fusers\u002Fadmin or to \u002Fapi\u002Fusers%2Fadmin\n",[29,628,626],{"__ignoreMap":31},[15,630,631],{},"Avoid encoding slashes in path segments. If you need slashes as data, use query parameters instead.",[255,633,635],{"id":634},"trailing-slashes","Trailing Slashes",[15,637,638,207,641,643],{},[29,639,640],{},"\u002Fdocs\u002F",[29,642,354],{}," may resolve to different resources depending on the server. Most frameworks redirect one to the other, but inconsistent handling causes duplicate content issues in search engines.",[15,645,646],{},"Pick one convention and enforce it across your application.",[10,648,650],{"id":649},"key-takeaways","Key Takeaways",[474,652,653,656,659,662,665,668,671],{},[477,654,655],{},"URLs consist of scheme, authority, path, query, and fragment",[477,657,658],{},"Default ports (80 for HTTP, 443 for HTTPS) can be omitted",[477,660,661],{},"Paths are case-sensitive and require percent-encoding for special characters",[477,663,664],{},"Fragments never reach the server — they are client-side only",[477,666,667],{},"Use relative URLs for internal links to survive domain changes",[477,669,670],{},"IDN domains use Punycode under the hood — register the ASCII form with DNS",[477,672,673],{},"Trailing slashes and encoded slashes can cause subtle routing bugs",[10,675,677],{"id":676},"related-guides","Related Guides",[474,679,680,684,690],{},[477,681,682],{},[453,683,456],{"href":455},[477,685,686],{},[453,687,689],{"href":688},"\u002Fguides\u002Furl-security-best-practices","URL Security Best Practices",[477,691,692],{},[453,693,695],{"href":694},"\u002Fguides\u002Furl-encoding-guide","URL Encoding Guide",[10,697,699],{"id":698},"try-it-yourself","Try It Yourself",[15,701,702,703,707],{},"Parse any URL into its components with our free ",[453,704,706],{"href":705},"\u002Ftools\u002Furl-parser","URL Parser"," tool. Paste a full URL and instantly see the scheme, host, port, path, query parameters, and fragment broken down for you.",{"title":31,"searchDepth":709,"depth":709,"links":710},2,[711,712,713,714,720,723,724,725,726,727,732,733,734],{"id":12,"depth":709,"text":13},{"id":37,"depth":709,"text":38},{"id":199,"depth":709,"text":200},{"id":244,"depth":709,"text":245,"children":715},[716,718,719],{"id":257,"depth":717,"text":113},3,{"id":269,"depth":717,"text":128},{"id":321,"depth":717,"text":96},{"id":336,"depth":709,"text":145,"children":721},[722],{"id":358,"depth":717,"text":359},{"id":430,"depth":709,"text":431},{"id":460,"depth":709,"text":184},{"id":491,"depth":709,"text":492},{"id":552,"depth":709,"text":553},{"id":575,"depth":709,"text":576,"children":728},[729,730,731],{"id":579,"depth":717,"text":580},{"id":611,"depth":717,"text":612},{"id":634,"depth":717,"text":635},{"id":649,"depth":709,"text":650},{"id":676,"depth":709,"text":677},{"id":698,"depth":709,"text":699},"2026-05-28","Break down the anatomy of a URL — protocol, hostname, port, path, query string, and fragment — with clear examples.","md",{"immutable":739},true,"\u002Fguides\u002Furl-structure-explained",6,{"title":5,"description":736},"guides\u002Furl-structure-explained","FunGz3zV3zeHJZqRcDANV-1STo0CwLCrIYvebmHvxy4",1780401326746]