ezy:mhrefezy:msrc là hai attribute mở rộng của EzyArticle dùng trong template Thymeleaf để tự động gắn version cho file media, giúp trình duyệt tải lại CSS hoặc JavaScript mới sau khi file được cập nhật.

Khi nào nên dùng

Dùng ezy:mhref cho thẻ <link> trỏ tới file CSS trong thư mục media:
<link rel="stylesheet" ezy:mhref="/api/v1/media/style.css" />
Dùng ezy:msrc cho thẻ <script> trỏ tới file JavaScript trong thư mục media:
<script ezy:msrc="/api/v1/media/app.js"></script>
Khi template được render, EzyArticle sẽ chuyển các attribute này thành href hoặc src thật, đồng thời tự động thêm tham số version:
<link rel="stylesheet" href="/api/v1/media/style.css?v=1736483930" />
<script src="/api/v1/media/app.js?v=1736483930"></script>

Vì sao cần version cho media

Trình duyệt thường cache CSS và JavaScript để tăng tốc độ tải trang. Điều này tốt cho hiệu năng, nhưng có thể gây ra vấn đề sau khi bạn cập nhật file.
Ví dụ, bạn đã sửa /api/v1/media/style.css, nhưng người dùng vẫn đang dùng bản cũ trong cache. Khi URL được thêm ?v=<latest_update_time>, trình duyệt sẽ xem đây là một URL mới và tải lại file mới nhất.

Cách hoạt động

Khi gặp ezy:mhref hoặc ezy:msrc, EzyArticle sẽ:
  1. Lấy giá trị URL từ attribute.
  2. Xác định tên media từ phần cuối URL.
  3. Tìm thời gian cập nhật mới nhất của media đó.
  4. Gắn thêm ?v=<version> vào URL.
  5. Xuất ra attribute HTML chuẩn là href hoặc src.
Ví dụ:
<link rel="stylesheet" ezy:mhref="/api/v1/media/theme.css" />
Sau khi render:
<link rel="stylesheet" href="/api/v1/media/theme.css?v=1736483930" />

Sử dụng với Thymeleaf expression

Bạn có thể truyền giá trị động bằng Thymeleaf expression:
<link rel="stylesheet" ezy:mhref="" />
<script ezy:msrc=""></script>
Expression cần trả về một chuỗi URL hợp lệ.

Fallback version

Nếu EzyArticle không tìm thấy thời gian cập nhật của media, hệ thống vẫn sẽ tự gắn version dự phòng. Version này có thể lấy từ biến version của view hoặc từ thời điểm server khởi động.
Điều này đảm bảo URL luôn có dạng versioned, ngay cả khi media chưa có metadata cập nhật.

Lưu ý

Không nên tự thêm query string vào URL khi dùng ezy:mhref hoặc ezy:msrc.
Nên dùng:
<link rel="stylesheet" ezy:mhref="/api/v1/media/style.css" />
Không nên dùng:
<link rel="stylesheet" ezy:mhref="/api/v1/media/style.css?theme=dark" />
Vì hệ thống sẽ tự gắn thêm ?v=... vào cuối URL.
Tên media nên dùng chữ cái tiếng Anh, số, dấu chấm, gạch ngang hoặc gạch dưới, ví dụ:
style.css
app.min.js
home-page.css

Tóm tắt

Dùng ezy:mhref thay cho href khi link tới CSS trong media:
<link rel="stylesheet" ezy:mhref="/api/v1/media/style.css" />
Dùng ezy:msrc thay cho src khi link tới JavaScript trong media:
<script ezy:msrc="/api/v1/media/app.js"></script>
Hai attribute này giúp EzyArticle tự động thêm version theo thời gian cập nhật media, hạn chế lỗi người dùng vẫn tải CSS hoặc JavaScript cũ từ cache.