Chèn thẻ thời tiết trực tiếp vào bất kỳ trang web nào chỉ với một dòng mã — không cần xây dựng backend thời tiết, không lo lộ khóa API trên trình duyệt. Lựa chọn hoàn hảo cho các trang bất động sản, du lịch, sự kiện, địa điểm và dashboard.
Vấn đề
Nếu bạn quản lý một trang web, việc hiển thị thời tiết địa phương trực tiếp thường đồng nghĩa với việc phải đăng ký API thời tiết, viết mã máy chủ để làm proxy, lưu bộ nhớ đệm (cache) các phản hồi để không vượt quá hạn mức và bảo mật khóa API khỏi mã phía máy khách. Đó là cả một dự án phức tạp. Trong khi thứ bạn cần chỉ là một thẻ thời tiết.
Cách hoạt động
Chỉ cần nhúng một phần tử tùy chỉnh (custom element) là xong:
<script
src="https://app.weatherintouch.com/embed.js"
data-api-base="https://api.weatherintouch.com"
></script>
<wx-weather-card
lat="50.08"
lon="14.44"
lang="en"
theme="auto"
></wx-weather-card>
Thẻ này được hiển thị bên trong Shadow DOM, do đó giao diện của nó sẽ không bao giờ xung đột với CSS trên trang web của bạn. Thẻ hiển thị tình hình thời tiết hiện tại và có thể kèm theo một dự báo ngắn. Bạn thích dùng iframe hơn? Chúng tôi có một phiên bản tự động điều chỉnh chiều cao thông qua postMessage. Mọi cấu hình đều nằm ở các thuộc tính — tọa độ, ngôn ngữ, giao diện (theme) và khóa API của bạn.
Điểm khác biệt
- Dùng chung bộ nhớ đệm. Widget của bạn đọc dữ liệu từ cùng một bộ nhớ đệm dự báo như ứng dụng chính. Một thẻ trên trang web của bạn và tab ứng dụng chính của khách truy cập ở cùng một tọa độ sẽ chỉ tính là một lượt gọi dữ liệu nguồn — không phải hai.
- Không rò rỉ khóa API. Endpoint xử lý hàng loạt ở backend sẽ cung cấp dữ liệu; khóa API của bạn được giới hạn phạm vi và hạn chế theo nguồn gốc, tuyệt đối không để lộ khóa gốc của nhà cung cấp trên trang.
- Không xung đột giao diện. Sự cô lập của Shadow DOM giúp thẻ hiển thị đồng nhất trên mọi trang web.
- Danh sách tên miền cho phép theo từng tài khoản. Bạn có toàn quyền kiểm soát chính xác những tên miền nào được phép hiển thị thẻ của mình.
Bảng giá
Widget nhúng là một tính năng của gói Pro — bao gồm một khóa API riêng cho từng tài khoản và danh sách tên miền cho phép để bạn có thể triển khai trên toàn bộ các trang web của mình.
Câu hỏi thường gặp
Làm cách nào để nhúng widget? Chỉ cần thêm thẻ script và phần tử <wx-weather-card> cùng với tọa độ của bạn — hoặc sử dụng phiên bản iframe.
Nên dùng phần tử tùy chỉnh hay iframe? Phần tử tùy chỉnh tích hợp chặt chẽ hơn (về giao diện, bố cục); trong khi iframe có tính cô lập cao nhất và dễ chèn nhất.
Tôi có thể tùy chỉnh giao diện không? Có — sử dụng theme="auto|light|dark", ngoài ra thẻ cũng sẽ đồng bộ với màu chủ đạo trên trang của bạn nếu có thể.
Giới hạn tỷ lệ (rate limit) là bao nhiêu? Endpoint xử lý hàng loạt được điều tiết và ưu tiên dùng bộ nhớ đệm (cache-first); việc nhúng thông thường sẽ luôn nằm trong mức giới hạn vì các tọa độ trùng lặp đều được loại bỏ.
Tôi có cần ghi nguồn Weather InTouch không? Có — thẻ sẽ đi kèm một liên kết ghi nguồn nhỏ, tuân thủ theo điều khoản của các nhà cung cấp dữ liệu của chúng tôi.