Lấy tên máy chủ từ url javascript

Phân tích cú pháp URL là một nhiệm vụ phổ biến khi phát triển các ứng dụng web

May mắn thay, API URL của JavaScript giúp dễ dàng đọc và sửa đổi URL mà không cần REGEX

Trước tiên, hãy tạo một chuỗi bằng URL của chúng ta [Lưu ý. Nếu URL không được cấu trúc chính xác, bạn sẽ gặp lỗi]

const url = '//www.michaelburrows.xyz/blog?search=hello&world';

Vào chế độ toàn màn hình Thoát chế độ toàn màn hình

Tiếp theo, chúng tôi tạo một đối tượng URL bằng cách sử dụng hàm tạo

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

1

let domain = [new URL[url]];

Vào chế độ toàn màn hình Thoát chế độ toàn màn hình

Với đối tượng được tạo, có một số thuộc tính chúng ta có thể truy cập

Chúng tôi quan tâm đến thuộc tính

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

2 trả về một chuỗi chứa tên miền

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

Vào chế độ toàn màn hình Thoát chế độ toàn màn hình

Nếu bạn yêu cầu một miền trống [không có www] thì có thể xóa miền đó bằng phương pháp

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

3

domain = domain.hostname.replace['www.',''];
console.log[domain]; //michaelburrows.xyz

Vào chế độ toàn màn hình Thoát chế độ toàn màn hình

Ngoài ra mã có thể được viết như sau

const url = '//www.michaelburrows.xyz/blog?search=hello&world';
const domain = [new URL[url]].hostname.replace['www.',''];

Vào chế độ toàn màn hình Thoát chế độ toàn màn hình

Trong bài viết này, chúng tôi muốn hướng dẫn bạn cách lấy giao thức với tên miền từ URL trong JavaScript

giải pháp nhanh chóng

// ONLINE-RUNNER:browser;

const protocol = location.protocol;       // 
const host     = location.host            // dirask.com
const result   = protocol + '//' + host;  // //dirask.com

console.log[result];

hoặc

// ONLINE-RUNNER:browser;

const result = location.origin;

console.log[result];  // //dirask.com

Cảnh báo.

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

4 trả về cổng ở cuối khi trang web được chạy trên một cổng khác với cổng

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

5 đối với

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

  

6 hoặc

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

7 đối với

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

8 [e. g.

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

9 trong ví dụ bên dưới]

 

Ví dụ thực tế trên localhost

Trong phần này, chúng tôi trình bày kết quả mà chúng tôi nhận được khi sử dụng mã từ phần Giải pháp nhanh trên

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

0 với ứng dụng mẫu [trong trường hợp này là Ứng dụng React]

Bộ định vị tài nguyên thống nhất, URL viết tắt, là tham chiếu đến tài nguyên web [trang web, hình ảnh, tệp]. URL chỉ định vị trí tài nguyên và cơ chế truy xuất tài nguyên [http, ftp, mailto]

Ví dụ: đây là URL của bài đăng trên blog này

//dmitripavlutin.com/parse-url-javascript

Thường thì bạn cần truy cập các thành phần cụ thể của một URL. Đây có thể là tên máy chủ [e. g.

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

5] hoặc tên đường dẫn [e. g.

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

6]

Trình phân tích cú pháp thuận tiện để truy cập các thành phần của URL là hàm tạo ________ 87

Trong bài đăng này, tôi sẽ chỉ cho bạn cấu trúc của một URL và các thành phần chính của nó

Sau đó, tôi sẽ mô tả cách sử dụng hàm tạo

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

7 để dễ dàng chọn các thành phần của URL như tên máy chủ, tên đường dẫn, truy vấn hoặc hàm băm

Mục lục

• 1. cấu trúc URL
• 2. hàm tạo URL[]
• 3. Chuỗi truy vấn
  • 3. 1 Phân tích chuỗi truy vấn
• 4. tên máy chủ
• 5. tên đường dẫn
• 6. băm
• 7. xác thực URL
• 8. thao tác URL
• 9. Bản tóm tắt

1. cấu trúc URL

Một hình ảnh đáng giá ngàn lời nói. Không có nhiều mô tả bằng văn bản, trong hình ảnh sau đây, bạn có thể tìm thấy các thành phần chính của một URL

2. hàm tạo URL[]

________ 87 là hàm tạo cho phép phân tích cú pháp các thành phần của URL

________số 8

Đối số

let domain = [new URL[url]];

40 có thể là URL tuyệt đối hoặc tương đối. Nếu đối số đầu tiên là tương đối, thì đối số thứ hai

let domain = [new URL[url]];

41 là bắt buộc và phải là một URL tuyệt đối làm cơ sở cho đối số đầu tiên

Ví dụ: hãy khởi tạo

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

7 bằng một URL tuyệt đối

let domain = [new URL[url]];

4

hoặc kết hợp URL tương đối và tuyệt đối

let domain = [new URL[url]];

8

Thuộc tính

let domain = [new URL[url]];

43 của phiên bản

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

7 trả về toàn bộ chuỗi URL

Sau khi tạo phiên bản

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

7, bạn có thể truy cập bất kỳ thành phần URL nào được trình bày trong hình trước. Để tham khảo, đây là giao diện phiên bản

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

7

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

3

trong đó loại

let domain = [new URL[url]];

47 ánh xạ tới một chuỗi khi được trả về trong JavaScript

3. Chuỗi truy vấn

Thuộc tính

let domain = [new URL[url]];

48 truy cập chuỗi truy vấn của URL có tiền tố là

let domain = [new URL[url]];

49

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

7

Nếu chuỗi truy vấn bị thiếu,

let domain = [new URL[url]];

48 ước tính thành một chuỗi rỗng

let domain = [new URL[url]];

81

domain = domain.hostname.replace['www.',''];
console.log[domain]; //michaelburrows.xyz

0

3. 1 Phân tích chuỗi truy vấn

Tiện dụng hơn việc truy cập chuỗi truy vấn thô là truy cập các tham số truy vấn

Một cách dễ dàng để chọn tham số truy vấn cung cấp thuộc tính

let domain = [new URL[url]];

82. Thuộc tính này chứa một phiên bản của URLSearchParams

Đối tượng

let domain = [new URL[url]];

83 cung cấp nhiều phương thức [như

let domain = [new URL[url]];

84,

let domain = [new URL[url]];

85] để truy cập các tham số chuỗi truy vấn

Hãy xem một ví dụ

domain = domain.hostname.replace['www.',''];
console.log[domain]; //michaelburrows.xyz

5

let domain = [new URL[url]];

86 trả về giá trị của tham số truy vấn

let domain = [new URL[url]];

87 —

let domain = [new URL[url]];

88

Tuy nhiên, việc truy cập một tham số không tồn tại

let domain = [new URL[url]];

89 ước tính thành

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

30

4. tên máy chủ

Thuộc tính

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

31 giữ tên máy chủ của URL

const url = '//www.michaelburrows.xyz/blog?search=hello&world';
const domain = [new URL[url]].hostname.replace['www.',''];

2

5. tên đường dẫn

Thuộc tính

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

32 truy cập tên đường dẫn của URL

const url = '//www.michaelburrows.xyz/blog?search=hello&world';
const domain = [new URL[url]].hostname.replace['www.',''];

4

Nếu URL không có đường dẫn, thuộc tính

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

32 trả về ký tự gạch chéo

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

34

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

0

6. băm

Cuối cùng, hàm băm có thể được truy cập bằng thuộc tính

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

35

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

1

Khi hàm băm trong URL bị thiếu,

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

35 ước tính thành một chuỗi rỗng

let domain = [new URL[url]];

81

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

2

7. xác thực URL

Khi hàm tạo

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

38 tạo một thể hiện, như một tác dụng phụ, nó cũng xác thực tính chính xác của URL. Nếu giá trị URL không hợp lệ, một

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

39 sẽ được ném ra

Ví dụ:

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

70 là URL không hợp lệ do có ký tự khoảng trắng sau

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

71

Hãy sử dụng URL không hợp lệ này để khởi tạo trình phân tích cú pháp

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

3

Bởi vì

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

72 là một URL không hợp lệ, như mong đợi,

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

73 ném một

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

39

8. thao tác URL

Ngoài việc truy cập các thành phần URL, các thuộc tính như

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

75,

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

76,

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

77,

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

78 đều có thể ghi — do đó bạn có thể thao tác với URL

Ví dụ: hãy sửa đổi tên máy chủ của một URL hiện có từ

domain = domain.hostname;
console.log[domain]; //www.michaelburrows.xyz

79 thành

domain = domain.hostname.replace['www.',''];
console.log[domain]; //michaelburrows.xyz

00

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

4

Lưu ý rằng chỉ các thuộc tính

domain = domain.hostname.replace['www.',''];
console.log[domain]; //michaelburrows.xyz

01 và

domain = domain.hostname.replace['www.',''];
console.log[domain]; //michaelburrows.xyz

02 của phiên bản

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

7 là chỉ đọc. Tất cả những cái khác đều có thể ghi và sửa đổi URL khi bạn thay đổi chúng

9. Bản tóm tắt

Hàm tạo

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

7 thuận tiện để phân tích cú pháp [và xác thực] các URL trong JavaScript

domain = domain.hostname.replace['www.',''];
console.log[domain]; //michaelburrows.xyz

05 chấp nhận đối số đầu tiên là một URL tuyệt đối hoặc tương đối. Khi đối số đầu tiên là tương đối, bạn phải chỉ ra đối số thứ hai dưới dạng URL tuyệt đối làm cơ sở cho đối số đầu tiên

Sau khi tạo phiên bản

javascript
const url = new URL[relativeOrAbsolute [, absoluteBase]];

7, bạn có thể dễ dàng truy cập các thành phần URL phổ biến nhất như

• let domain = [new URL[url]];
  

  48 cho chuỗi truy vấn thô

• let domain = [new URL[url]];
  

  82 cho phiên bản của

  let domain = [new URL[url]];
  

  83 để chọn tham số chuỗi truy vấn

• domain = domain.hostname;
  console.log[domain]; //www.michaelburrows.xyz
  

  31 để truy cập tên máy chủ

• domain = domain.hostname;
  console.log[domain]; //www.michaelburrows.xyz
  

  32 để đọc tên đường dẫn

• domain = domain.hostname;
  console.log[domain]; //www.michaelburrows.xyz
  

  35 để xác định giá trị băm

Về hỗ trợ trình duyệt, hàm tạo

domain = domain.hostname.replace['www.',''];
console.log[domain]; //michaelburrows.xyz

53 có sẵn trong các trình duyệt hiện đại. Tuy nhiên, nó không có sẵn trong Internet Explorer

Công cụ yêu thích của bạn để phân tích cú pháp URL trong JavaScript là gì?

Thích bài viết?

đề xuất cải tiến

Bài đăng chất lượng vào hộp thư đến của bạn

Tôi thường xuyên xuất bản bài viết có chứa

• Các khái niệm JavaScript quan trọng được giải thích bằng các từ đơn giản
• Tổng quan về các tính năng JavaScript mới
• Cách sử dụng TypeScript và cách gõ
• Thiết kế phần mềm và thực hành mã hóa tốt

Đăng ký nhận bản tin của tôi để nhận chúng ngay trong hộp thư đến của bạn

Đặt mua

Tham gia cùng 6719 người đăng ký khác

Giới thiệu về Dmitri Pavlutin

Nhà văn và huấn luyện viên công nghệ. Thói quen hàng ngày của tôi bao gồm [nhưng không giới hạn] uống cà phê, viết mã, viết, huấn luyện, vượt qua sự nhàm chán 😉

Làm cách nào để lấy tên máy chủ từ URL trong JavaScript?

Tên máy chủ trong URL là gì?

Làm cách nào để phân tích cú pháp URL bằng JavaScript?