Mixed content checker: tìm và sửa tài nguyên http:// làm hỏng trang https
Mixed content xảy ra khi một trang tải qua https nhưng lại gọi script, CSS, ảnh, iframe hay font qua http:// không mã hóa. Hậu quả có thể là ổ khóa trên thanh địa chỉ biến mất, script và CSS bị trình duyệt chặn làm vỡ giao diện, form hiện cảnh báo khi gửi. Mixed content checker này tải HTML của trang bạn nhập, liệt kê từng URL http:// kèm số dòng, phân loại theo đặc tả Mixed Content của W3C thành nhóm bị chặn và nhóm được tự nâng cấp, rồi gợi ý cách sửa cụ thể.
Tính năng nổi bật
- Quét HTML ban đầu của trang: script, stylesheet, ảnh, srcset, picture, video, audio, source, track, iframe, object, embed, ảnh SVG
- Quét thẻ link theo rel và as: preload, prefetch, modulepreload, manifest, favicon
- Tìm url() và @import trong thuộc tính style, thẻ style và tối đa 5 tệp CSS cùng tên miền, nhận diện font trong @font-face
- Phân loại bị chặn (chủ động) và tự nâng cấp (thụ động) theo Mixed Content Level 2, kể cả trường hợp đặc biệt như srcset và máy chủ là địa chỉ IP
- Phát hiện form gửi dữ liệu qua http, meta refresh chuyển sang trang http và thẻ base trỏ về http
- Kiểm tra chỉ thị upgrade-insecure-requests trong header CSP hoặc thẻ meta, và header HSTS
- Hiện số dòng trong mã nguồn, số lần xuất hiện, lọc theo nhóm và tải danh sách ra CSV
- Gợi ý cách sửa theo kết quả: URL cùng tên miền, URL bên thứ ba, mẫu cấu hình Nginx và Apache
Vì sao cần tìm mixed content sau khi chuyển sang https
Cài SSL xong không có nghĩa là website đã sạch http. Các đường dẫn tuyệt đối http:// nằm rải rác trong nội dung bài viết cũ, trong theme, trong mã nhúng của bên thứ ba, trong CSS viết tay từ nhiều năm trước. Trình duyệt xử lý chúng khác nhau: ảnh thường được tự đổi sang https một cách lặng lẽ, còn script và CSS bị chặn hẳn, khiến menu không bấm được, slider đứng yên hay trang mất định dạng mà chủ website không hiểu vì sao. Tìm bằng tay qua DevTools thì phải mở từng trang và đọc Console. Công cụ này gom tất cả URL http:// của một trang vào một bảng có số dòng, cho biết URL nào nguy hiểm hơn, để bạn sửa đúng chỗ, đúng thứ tự ưu tiên.
Lợi ích khi sử dụng
- Tìm nguyên nhân mất ổ khóa bảo mật hoặc cảnh báo không an toàn trên trang https
- Biết URL nào đang làm vỡ giao diện (bị chặn) và URL nào chỉ cần dọn dẹp (tự nâng cấp)
- Có số dòng cụ thể trong mã nguồn, tiết kiệm thời gian dò tìm
- Kiểm tra được cả CSS cùng tên miền, nơi hay sót ảnh nền và font http
- Có danh sách CSV để giao cho lập trình viên hoặc đơn vị quản trị website
Cách kiểm tra mixed content của một trang
- 1Nhập URL trang cần kiểm tra. Có thể nhập tên miền không kèm https://, công cụ tự thêm và đi theo chuyển hướng tối đa 5 lần.
- 2Bấm Kiểm tra và chờ vài giây để máy chủ tải HTML và các tệp CSS cùng tên miền.
- 3Xem bốn ô tổng hợp: bị chặn, tự nâng cấp, form và chuyển trang. Bấm vào một ô để lọc bảng theo nhóm đó.
- 4Đọc bảng chi tiết: loại tài nguyên, URL, thẻ HTML chứa nó và số dòng trong mã nguồn để tìm đúng vị trí cần sửa.
- 5Làm theo phần Cách sửa, ưu tiên nhóm bị chặn trước, rồi tải CSV nếu cần giao việc cho lập trình viên.
- 6Sửa xong, kiểm tra lại trang và mở DevTools để rà thêm tài nguyên do JavaScript tải về.
Mixed content là gì
Khi trang được tải qua https, mọi dữ liệu giữa trình duyệt và máy chủ được mã hóa. Nếu trang đó lại nhúng một tài nguyên qua http, phần tài nguyên này đi trên đường truyền không mã hóa, kẻ đứng giữa (ví dụ Wi-Fi công cộng bị giả mạo) có thể đọc hoặc tráo nội dung. Với ảnh, hậu quả là ảnh bị thay; với script, kẻ tấn công có thể chèn mã chạy với toàn quyền trên trang của bạn, đọc được mật khẩu người dùng nhập. Vì vậy trình duyệt coi mixed content là lỗi bảo mật. Liên kết thẻ a trỏ tới trang http không phải mixed content, vì người dùng rời khỏi trang chứ không tải tài nguyên về trang đang xem, nên công cụ không liệt kê chúng.
Nhóm bị chặn và nhóm tự nâng cấp khác nhau thế nào
Đặc tả Mixed Content Level 2 của W3C chia tài nguyên thành hai nhóm. Nhóm tự nâng cấp (upgradeable) gồm ảnh, âm thanh và video tải bằng thẻ img, audio, video: trình duyệt tự đổi http thành https trước khi tải; nếu máy chủ đích có https thì ảnh vẫn hiện bình thường, nếu không thì ảnh lỗi. Nhóm còn lại (blockable) gồm script, CSS, iframe, font, object, embed, phụ đề track, yêu cầu fetch và mọi loại khác: trình duyệt chặn hẳn. Có hai ngoại lệ đáng chú ý trong nhóm ảnh: ảnh tải qua srcset hoặc thẻ picture không được tự nâng cấp theo đặc tả, và ảnh trên máy chủ là địa chỉ IP cũng không được nâng cấp, nên công cụ xếp chúng vào nhóm bị chặn. Mức độ tuân theo đặc tả có thể khác nhau giữa các trình duyệt và phiên bản, vì thế cách an toàn nhất vẫn là sửa toàn bộ về https.
upgrade-insecure-requests: giải pháp tạm hay giải pháp lâu dài
Chỉ thị upgrade-insecure-requests trong Content-Security-Policy yêu cầu trình duyệt tự đổi mọi yêu cầu http trên trang sang https, kể cả script và CSS. Có thể khai báo bằng header trên máy chủ web hoặc bằng thẻ meta trong phần head. Đây là cách nhanh khi website có hàng nghìn bài viết cũ chứa ảnh http. Nhưng nó có hai giới hạn: tài nguyên nào không có bản https sẽ lỗi tải thay vì chỉ bị cảnh báo, và nó chỉ che triệu chứng trên trình duyệt, còn mã nguồn vẫn chứa URL http. Công cụ cho biết trang có đang dùng chỉ thị này hay không; nếu có, các URL http trong bảng vẫn nên được sửa dần. Chỉ thị block-all-mixed-content cũ nay đã lỗi thời, không còn tác dụng thực tế vì trình duyệt hiện đại mặc định chặn hoặc nâng cấp mixed content.
Cách sửa mixed content phổ biến
Với URL trỏ về chính tên miền của bạn, chỉ cần đổi http:// thành https:// hoặc dùng đường dẫn tương đối bắt đầu bằng dấu gạch chéo. Trên WordPress, URL cũ thường nằm trong nội dung bài viết lưu ở cơ sở dữ liệu, trong tùy chỉnh theme và widget, nên cần dùng công cụ tìm và thay thế trên toàn cơ sở dữ liệu (ví dụ lệnh wp search-replace của WP-CLI, nhớ sao lưu trước) và đổi hai địa chỉ website trong Cài đặt chung sang https. Với URL của bên thứ ba như CDN, thư viện JavaScript, video nhúng hay mã quảng cáo, hãy mở thử bản https; hầu hết nhà cung cấp lớn đều có. Nếu nhà cung cấp không hỗ trợ https, cần tự lưu tệp lên máy chủ của bạn hoặc thay nhà cung cấp. Cuối cùng, cấu hình máy chủ chuyển hướng mọi yêu cầu http sang https và bật HSTS khi đã chắc chắn toàn bộ website chạy ổn trên https.
Công cụ kiểm tra những gì và bỏ sót những gì
Máy chủ của chúng tôi tải HTML ban đầu của trang giống như khi xem mã nguồn, không chạy JavaScript và không gửi cookie, sau đó đọc thêm tối đa 5 tệp CSS cùng tên miền, mỗi tệp tối đa 1 MB. Vì vậy công cụ không thấy: tài nguyên do JavaScript chèn vào sau khi tải trang (nhiều mã quảng cáo, widget chat, tag manager hoạt động theo cách này), yêu cầu fetch và XHR, CSS từ tên miền khác và các tệp @import lồng sâu, tài nguyên https bị máy chủ chuyển hướng sang http, nội dung chỉ hiện sau khi đăng nhập, và trang có HTML lớn hơn 5 MB. Hãy dùng công cụ để dọn phần lớn lỗi nằm sẵn trong mã nguồn, rồi mở tab Console trong DevTools của trình duyệt để bắt nốt phần còn lại.
An toàn khi máy chủ tải trang giúp bạn
Để tránh bị lợi dụng tấn công vào mạng nội bộ, máy chủ kiểm tra tên miền trước mỗi lần tải: phân giải DNS và từ chối nếu bất kỳ địa chỉ nào thuộc dải nội bộ hoặc dành riêng, kiểm tra lại ở mỗi bước chuyển hướng, chỉ chấp nhận các cổng web tiêu chuẩn, không nhận URL chứa tên đăng nhập, giới hạn thời gian 15 giây, dung lượng HTML 5 MB và 25 lượt kiểm tra mỗi giờ cho mỗi địa chỉ IP. Công cụ không lưu URL hay kết quả kiểm tra.
Mixed content ảnh hưởng tới SEO như thế nào
Google dùng https như một tín hiệu xếp hạng nhỏ và Chrome hiển thị trạng thái bảo mật trên thanh địa chỉ. Mixed content không làm trang bị gỡ khỏi kết quả tìm kiếm, nhưng tài nguyên bị chặn có thể khiến Googlebot, vốn dựng trang bằng Chrome, thấy trang thiếu CSS hoặc thiếu nội dung do JavaScript tạo ra, ảnh hưởng tới đánh giá khả năng sử dụng. Ảnh bị lỗi tải cũng mất cơ hội xuất hiện trong tìm kiếm hình ảnh. Tác động lớn nhất vẫn là trải nghiệm và lòng tin của người dùng khi thấy trang lỗi hoặc cảnh báo.
Câu hỏi thường gặp (FAQ)
Tại sao trang đã cài SSL mà vẫn không hiện ổ khóa?
Nguyên nhân phổ biến nhất là mixed content: trang https nhưng còn tải tài nguyên qua http. Nguyên nhân khác có thể là chứng chỉ lỗi hoặc hết hạn. Hãy chạy công cụ này để tìm URL http và dùng SSL Checker để kiểm tra chứng chỉ.
Ảnh http có bị chặn không?
Với thẻ img thông thường, trình duyệt hiện đại tự nâng cấp lên https. Ảnh chỉ hiện nếu máy chủ đích có https. Ảnh trong srcset, thẻ picture hoặc trên máy chủ là địa chỉ IP thì không được tự nâng cấp theo đặc tả.
Vì sao script và CSS http bị chặn hẳn?
Vì script và CSS có thể thay đổi toàn bộ trang. Nếu bị tráo trên đường truyền, kẻ tấn công có thể chèn mã độc đọc dữ liệu người dùng. Trình duyệt chặn chúng để bảo vệ tính toàn vẹn của trang https.
Công cụ có chạy JavaScript của trang không?
Không. Công cụ chỉ đọc HTML ban đầu và tối đa 5 tệp CSS cùng tên miền. Tài nguyên do JavaScript chèn vào sau không được phát hiện, hãy kiểm tra thêm bằng tab Console trong DevTools.
Nhập URL http thì công cụ xử lý thế nào?
Công cụ đi theo chuyển hướng. Nếu trang cuối cùng là https thì kiểm tra bình thường. Nếu trang cuối cùng vẫn là http, công cụ báo trang chưa chạy https, vì mixed content chỉ có nghĩa trên trang https.
Liên kết thẻ a trỏ tới trang http có phải mixed content không?
Không. Liên kết chỉ đưa người dùng sang trang khác khi họ bấm, không tải tài nguyên vào trang hiện tại, nên công cụ không liệt kê. Form gửi tới http và meta refresh sang http thì được liệt kê riêng vì ảnh hưởng tới bảo mật.
Dùng upgrade-insecure-requests có đủ không?
Đó là cách xử lý nhanh, nhưng tài nguyên không có bản https sẽ bị lỗi tải và mã nguồn vẫn còn URL http. Nên dùng như biện pháp tạm thời trong lúc sửa dần các URL.
Số dòng trong bảng lấy từ đâu?
Đó là số dòng trong HTML mà máy chủ trả về, giống khi xem mã nguồn trang (Ctrl + U). Với tệp CSS, số dòng tính trong tệp CSS đó. Nếu HTML được nén thành một dòng, nhiều mục sẽ cùng số dòng.
Vì sao công cụ không tìm thấy lỗi mà trình duyệt vẫn cảnh báo?
Tài nguyên có thể được JavaScript chèn vào, nằm trong CSS của tên miền khác, trong tệp @import lồng sâu, hoặc là tài nguyên https bị chuyển hướng sang http. Mở Console trong DevTools để xem thông báo Mixed Content cụ thể.
Website WordPress nên sửa mixed content thế nào?
Đổi địa chỉ WordPress và địa chỉ trang web trong Cài đặt chung sang https, sau đó thay hàng loạt http://tenmien thành https://tenmien trong cơ sở dữ liệu bằng công cụ search-replace (sao lưu trước). Kiểm tra thêm theme, widget và plugin có URL http viết cứng.
Công cụ có lưu URL tôi kiểm tra không?
Không. Máy chủ chỉ tải trang để phân tích và trả kết quả về trình duyệt của bạn, không lưu URL hay kết quả. Bộ đếm giới hạn lượt kiểm tra chỉ giữ địa chỉ IP trong bộ nhớ tạm tối đa một giờ.
Tại sao có giới hạn 25 lượt mỗi giờ?
Mỗi lượt kiểm tra khiến máy chủ tải trang và nhiều tệp CSS từ website khác. Giới hạn giúp ngăn công cụ bị lợi dụng để gửi yêu cầu hàng loạt tới website của người khác.
Có kiểm tra được trang nội bộ hoặc localhost không?
Không. Vì lý do bảo mật, máy chủ từ chối tên miền phân giải ra địa chỉ nội bộ, localhost và cổng không tiêu chuẩn. Với trang nội bộ, hãy dùng DevTools trên máy của bạn.
Từ khóa liên quan
- mixed content checker
- kiểm tra mixed content
- lỗi mixed content
- sửa lỗi mixed content
- mixed content là gì
- trang https không hiện ổ khóa
- tìm tài nguyên http trên trang https
- mixed content wordpress
- upgrade-insecure-requests
- blocked mixed content
- mixed content image
- why no padlock https
- insecure content checker
- http resources on https page
- content security policy upgrade insecure requests
- website không an toàn dù có ssl
- kiểm tra https website
- mixed content scanner online
