Скачать или смотреть How to Isolate a URL's Domain Name Without "https" or "www"

Learn how to extract a URL's `domain name` effectively, even when "https" or "www" are missing, using JavaScript.
---
This video is based on the question https://stackoverflow.com/q/68407299/ asked by the user 'drake035' ( https://stackoverflow.com/u/871404/ ) and on the answer https://stackoverflow.com/a/68408590/ provided by the user 'Rahul Kumar' ( https://stackoverflow.com/u/5251507/ ) at 'Stack Overflow' website. Thanks to these great users and Stackexchange community for their contributions.

Visit these links for original content and any more details, such as alternate solutions, latest updates/developments on topic, comments, revision history etc. For example, the original title of the Question was: How to isolate a URL' domain name in the absence of "https" or "www"?

Also, Content (except music) licensed under CC BY-SA https://meta.stackexchange.com/help/l...
The original Question post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license, and the original Answer post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license.

If anything seems off to you, please feel free to write me at vlogize [AT] gmail [DOT] com.
---
Introduction

Isolating the domain name from a URL is a common task in web development. However, the challenge arises when URLs do not include the "https" or "www" prefixes. In these cases, attempting to construct a new URL object can lead to errors, specifically the dreaded "Failed to construct 'URL'".

In this guide, we will dive into a practical solution that allows you to extract the domain name from various URL formats, even when certain components are missing.

Understanding the Problem

When working with URLs in JavaScript, the URL constructor is an invaluable tool. It allows developers to parse and handle URLs easily. However, when trying to create a URL object from a string that lacks "https" or "www", it results in an error.

For example:

[[See Video to Reveal this Text or Code Snippet]]

This would trigger the following error:

[[See Video to Reveal this Text or Code Snippet]]

To address this issue, we need a method to prepend the missing protocol when necessary and then isolate the domain name.

Solution Overview

To effectively isolate the domain name from URLs that may lack the "https" or "www" components, we will:

Check if the URL contains "https" or "http".

If it doesn't, prefix it with "https://".

Use the URL constructor to obtain the hostname from the modified URL.

Remove unnecessary parts like "www".

Step-by-Step Breakdown

1. Define the Function

We will create a function getFormattedHost that takes a URL string as an argument.

2. Check the Protocol

Using a regular expression, we will check if the URL string starts with "https://" or "http://". If it does not, we will add "https://" to the beginning of the string.

3. Use the URL Constructor

After ensuring that the URL contains a valid scheme, we can safely create a new URL object and extract the hostname.

4. Clean Up the Hostname

Finally, we will use a regular expression to strip the hostname of any unwanted prefixes like "www.".

Sample Implementation

Here's the complete JavaScript code that accomplishes the above steps:

[[See Video to Reveal this Text or Code Snippet]]

Explanation of the Code

validUrl and invalidUrl are examples you can test.

The getFormattedHost function begins with checking if the URL string is valid by testing it against the regex.

If the URL doesn't contain a protocol, it adds "https://" to it.

Finally, it creates a new URL object and extracts just the domain name, removing any prefixes with regex replace.

Conclusion

Isolating the domain name from various URL formats does not have to be a daunting task. By checking for the existence of "https" or "http", prefixing the URL when necessary, and using JavaScript's capabilities, you can effortlessly retrieve the essential information you need.

Whether you're a seasoned developer or just starting out, this technique will enhance your ability to handle URLs effectively. Happy coding!