Node.js
URL properties
Learn URL.pathname, hostname and port properties.
pathname, hostname, port
You access a URL object's address components through properties. pathname gives the path, hostname the server name, port the port.
Example: for new URL("https://example.com:8080/path/to/page"), pathname is "/path/to/page", hostname is "example.com", port is "8080". If port is empty the default is used (443 for https, 80 for http); then url.port gives an empty string. hostname gives only the name; host gives name+port ("example.com:8080"). In routing, pathname is the most used property; frameworks like Express parse it automatically.
protocol, hash, origin
Other properties: protocol gives the protocol ("https:"), hash the anchor ("#section"), origin the protocol+host+port combination.
Example: for new URL("https://example.com:8080/path?q=1#section"), protocol is "https:", hash is "#section", origin is "https://example.com:8080". protocol ends with a colon; be careful when comparing. hash is only for in-page position in the browser; the server does not see it. origin is critical in CORS (cross-origin) checks; it compares whether two URLs come from the same origin. In this lesson's exercise we print pathname, hostname and port separately.
Exercise Print URL components separately
Create a URL with const url = new URL("https://example.com:8080/path/to/page?q=1");. Print three components on separate lines with console.log(url.pathname), console.log(url.hostname) and console.log(url.port).
Show example solution
const url = new URL("https://example.com:8080/path/to/page?q=1");
console.log(url.pathname);
console.log(url.hostname);
console.log(url.port);
Test yourself
-
Match each property to its value
- pathname
- /path/to/page
- hostname
- example.com
- port
- 8080
- host
- example.com:8080
-
What does new URL("https://example.com:8080/x").port give?
new URL("https://example.com:8080/x").port
Show answer
"8080" — 8080 is explicit; the port property gives it.
-
Complete the pathname access
const yol = url.____;
Show answer
const yol = url.pathname;
Next lesson: URL.resolve
