Trong bài viết này, chúng tôi sẽ xem xét cách bạn với tư cách là nhà phát triển có thể sử dụng nonce để bảo vệ các yêu cầu AJAX trên trang web WordPress
qua
Jean-Baptiste Jung
·Tháng 4. 10, 18 · Hướng dẫnGiống
Nhận xét
Tiết kiệm
tiếng riu ríu
Chia sẻ
7. 25K Lượt xem
Tham gia cộng đồng DZone và có được trải nghiệm thành viên đầy đủ
Tham gia miễn phíKhi tạo một chủ đề hoặc plugin WordPress, AJAX thường được sử dụng để nâng cao trải nghiệm người dùng. Để đảm bảo an ninh và bảo vệ trang web của bạn khỏi một số loại tấn công bao gồm CSRF, WordPress cung cấp mã thông báo bảo mật được gọi là nonces. Trong bài viết này, tôi sẽ chỉ cho bạn cách sử dụng nonce để bảo vệ các yêu cầu AJAX trên trang web WordPress
WordPress Nonces là gì?
Theo codex, nonce là "số được sử dụng một lần" để giúp bảo vệ các URL và biểu mẫu khỏi một số loại lạm dụng, độc hại hoặc cách khác
WordPress có thể tạo các nonce để chúng được gửi qua biểu mẫu hoặc một hành động khác, mặt khác, nó có thể xác minh nonce được chuyển trong một biểu mẫu hoặc một hành động là hợp lệ trước khi chấp nhận dữ liệu được liên kết
Để biết thêm thông tin về nonces, hãy xem codex WordPress
Hình thức
Đối với hướng dẫn này, chúng ta cần tạo hai tệp. ajax.php
, sẽ chứa mã cần thiết để xử lý yêu cầu và page-form.php
, tệp chính, chứa một biểu mẫu đơn giản. Sử dụng một nonce sẽ thêm một lớp bảo mật bổ sung cho các chủ đề và plugin WordPress mà bạn có thể tạo
Hai tệp đó sẽ được tạo trong thư mục chủ đề WordPress của bạn. Bạn có thể sử dụng chương trình FTP hoặc cPanel do dịch vụ lưu trữ web của bạn cung cấp để thực hiện việc này
Hãy bắt đầu bằng cách tạo một biểu mẫu HTML đơn giản trong tệp page-form.php
Example label
Another label
Không có gì đặc biệt về biểu mẫu này, ngoại trừ một cuộc gọi đến wp_nonce_field[]
trên dòng 11. Hàm này tạo một nonce và thêm nó vào biểu mẫu bằng trường ẩn. Một trường ẩn khác được tạo bởi cùng chức năng để lưu trữ người giới thiệu
Nếu bạn xem nguồn của tệp page-form.php
của mình, bạn sẽ thấy rằng hàm wp_nonce_field[]
đã xuất ra nội dung tương tự như sau
Để biết thêm thông tin về chức năng, vui lòng tham khảo codex
Gửi biểu mẫu bằng jQuery
Bây giờ, chúng tôi sẽ sử dụng một số jQuery để gửi biểu mẫu của chúng tôi
jQuery[ document ].ready[function[] {
jQuery[ "#submit" ].click[function[] {
jQuery.post[ "//yoursite.com/ajax.php", jQuery['#myform'].serialize[]]
.done[function[ data ] {
alert[data];
}];
return false;
}];
}];
Mã này khá dễ hiểu. khi người dùng cố gắng gửi biểu mẫu, jQuery sẽ gửi yêu cầu AJAX tới
0, với nội dung là biểu mẫu được đánh số thứ tựXác minh Nonce bằng PHP
Khi dữ liệu đã được gửi, chúng tôi cần xác minh rằng nonce là hợp lệ. Đây là nội dung của tệp ajax.php
mà jQuery đã gửi dữ liệu tới