Một thứ mà bạn luôn sử dụng, nhưng không phải lúc nào cũng nhận ra, đó là cách trình duyệt web sẽ yêu cầu tài nguyên trong tệp html với url tương đối
Ví dụ
sẽ được phục vụ từ ví dụ. com như //example.com/libs/jquery.min.js
- với điều kiện trang web đang nằm trong máy chủ web gốc e. g
0 hoặc
1Thay vào đó, nếu ứng dụng nằm trong thư mục con/thư mục ảo, đoạn mã trên sẽ vẫn hoạt động, ngay cả khi nó có thể đến từ
2. Điều này thật tuyệt, vì nó cho phép chúng tôi tách rời cấu trúc ứng dụng của mình khỏi nơi nó được triển khaiĐiều gì sẽ xảy ra nếu chúng tôi thay đổi URL một chút?
Với sự thay đổi này,
3 hàng đầu cho biết thư mục gốc của trang web. Nó vẫn là một đường dẫn tương đối, nhưng nó “tương đối” với thư mục gốc của trang web. //example.com/libs/jquery.min.js
sẽ vẫn hoạt động, nhưng
5 thì không. Đây có thể là một lỗi nhỏ, vì hầu hết các ứng dụng chạy cục bộ đều nằm ở vị trí
6 hoặc bất cứ thứ gì, nhưng nhiều ứng dụng không được triển khai tới thư mục gốc của webSử dụng dấu gạch chéo hàng đầu sẽ loại bỏ rất nhiều tính linh hoạt trong tương lai. Vậy tại sao bạn lại muốn nó? . Bạn có một tệp tập lệnh có phần phụ thuộc jquery, tồn tại tại
7. Tài liệu tham khảo này sẽ không còn hoạt động
Nó sẽ trả về dưới dạng
8 oopsLý do điều này không hoạt động là do đường dẫn tương đối được xây dựng dựa trên vị trí cửa sổ hiện tại của bạn, đường dẫn này sẽ thay đổi theo các url khác nhau
//example.com
//example.com/salesapp
//example.com/salesapp/accounts
Nó sẽ phải là một trong số này
Trong số ba, cái thứ 2 có lẽ là linh hoạt nhất, nhưng khó đọc và viết [đặc biệt nếu cây nguồn của bạn sâu]
Điều bạn thực sự muốn làm là đặt url của bạn tương ứng với đường dẫn của ứng dụng. Điều này có thể sử dụng thẻ
9. theo mdn“HTML
phần tử chỉ định URL cơ sở để sử dụng cho tất cả các URL tương đối có trong tài liệu. ”Ví dụ: nếu bạn thiết lập thẻ
9 như sau
Điều này thiết lập một cách hiệu quả tất cả các đường dẫn tương đối liên quan đến thư mục gốc của trang web
1 sẽ được đọc là
2, và do đó
3Để đặt đường dẫn cụ thể cho ứng dụng, bạn có thể sử dụng
1 sẽ được đọc là
5, và do đó là
2điều này hoạt động tốt khi triển khai đến các điểm cuối khác nhau vì chỉ cần thay đổi tham chiếu
9, có thể dễ dàng xử lý thông qua hệ thống xây dựngMặc dù vậy, hãy cẩn thận, việc chỉ định các đường dẫn tương đối bằng dấu gạch chéo ở đầu sẽ bỏ qua
9 đã chỉ địnhCuối cùng, bạn cũng có thể chỉ định đường dẫn cơ sở thư mục trống/hiện tại
hoặc là
Điều này thực sự giống như chỉ định không có
9. Bạn có thể sử dụng điều này để phát triển địa phươngNgoài ra, bạn có thể tự động viết
9 bằng một tập lệnh, nhưng có vẻ như đây không phải là cách tiếp cận được đề xuất. Có vẻ tốt hơn là để điều này tùy thuộc vào hệ thống xây dựng/triển khai của bạnTin tốt là các đường dẫn bị hỏng thường dễ phát hiện khi trình duyệt của bạn ở chế độ phát triển - chỉ cần tìm các yêu cầu màu đỏ trong tab mạng và kiểm tra đường dẫn. Bạn sẽ biết điều gì đó không ổn khi đường dẫn đúng một phần, nhưng chứa các cấp độ bổ sung hoặc cấp độ bị thiếu hoàn toàn