Students Save 30%! Learn & create with unlimited courses & creative assets Students Save 30%! Save Now
Advertisement
  1. Code
  2. WordPress
Code

Những cách làm tốt nhất trong phát triển WordPress

by
Length:LongLanguages:

Vietnamese (Tiếng Việt) translation by Dai Phong (you can also view the original English article)

Trong loạt bài này, chúng ta sẽ bao quát những điều quan trọng nhất mà bạn nên cân nhắc khi phát triển một plugin hoặc một theme WordPress.

Hướng dẫn này nhằm mục đích cung cấp một tập hợp các thực tiễn tốt sẽ rất hữu ích cho người mới bắt đầu và cũng như các nhà phát triển có chuyên môn đang bắt đầu làm việc với WordPress

Nhưng hãy đợi! Nếu bạn đã là phát triển các plugin cho WordPress trong một thời gian dài, hãy cân nhắc trước khi nghĩ rằng hướng dẫn này không phải là dành cho bạn. Tôi chắc rằng bạn sẽ học được một cái gì đó từ nó. Sau tất cả, mỗi người chúng ta đều có một cái gì đó độc đáo để chia sẻ.

Hầu hết các giải thích của loạt bài này đã có sẵn trong Codex, nhưng tôi biết nó có chứa rất nhiều thông tin, có thể khó khăn để biết nên bắt đầu từ đâu.

Hôm nay chúng ta bao quát các chủ đề sau:

  1. Tiêu chuẩn viết mã trong WordPress
  2. Tránh đụng độ tên hàm
  3. Trích dẫn code
  4. Hướng dẫn về bảo mật

Loạt bài này nhằm mục đích làm rõ ràng nhất có thể và sẽ bao quát các ví dụ tốt và xấu để cung cấp cho bạn một cái nhìn về những điều cụ thể nên như thế nào khi viết code dành riêng cho WordPress.

Lưu ý rằng không phải tất cả mọi thứ là bắt buộc khi viết một plugin; tuy nhiên, nếu bạn chỉ mới bắt đầu, thì tại sao không bắt đầu từ những điều đúng đắn?

Tôi sẽ cố gắng làm cho loạt bài này dễ đọc. Tôi sẽ kèm theo một số ví dụ về code tốt và xấu. Không phải tất cả mọi thứ giải thích đây là bắt buộc khi viết một Plugin, nhưng nếu bạn đang bắt đầu với phát triển Wordpress , tại sao không bắt đầu đúng cách? Một khi nó trở thành một thói quen thì sẽ khó có thể làm sai.

Tiêu chuẩn viết code trong WordPress

Đối với cá nhân tôi, đây là một lỗ hổng lớn nhất của tôi khi tôi phát triển các plugin. Nếu bạn phát triển các công cụ cho WordPress, bạn chỉ đơn giản là phải tuân theo các tiêu chuẩn viết code trong WordPress. Tiêu chuẩn viết code giúp cải thiện khả năng đọc code và giúp tránh các lỗi viết code phổ biến.

WordPress là một CMS cộng tác và một điều đơn giản là khi mọi người đều viết code giống nhau thì làm cho việc đọc, viết và duy trì các code đó dễ dàng hơn đối với tất cả mọi người. Lúc đầu, có thể khó khăn để thay đổi phong cách viết code mà bạn đã quen, nhưng cuối cùng bạn sẽ thấy nó sẽ trở nên tự nhiên và code của bạn sẽ sạch sẽ hơn, và dễ dàng hơn để đọc.

Trong cẩm nang WordPress tiêu chuẩn được chia thành bốn ngôn ngữ chính được sử dụng

  1. Tiêu chuẩn viết code CSS
  2. Tiêu chuẩn viết code HTML
  3. Tiêu chuẩn viết code JavaScript
  4. Tiêu chuẩn viết code PHP

Các ví dụ

Ở dưới tôi sẽ chỉ cho bạn một số ví dụ về cách đóng mở ngoặc đơn giản, vì vậy bạn có thể mường tượng về nó.

Các ví dụ không tốt

Các ví dụ tốt

Ví dụ thứ hai là dễ dàng hơn để đọc, không phải vậy sao? Cẩm nang tiêu chuẩn viết code có đầy đủ các ví dụ sẽ giúp bạn làm cho code của bạn sạch hơn. Dễ nhìn ra những thứ đơn giản như một vài dấu cách và tab có thể cải thiện khả năng đọc của code của bạn.

Trong khi viết bài này, tôi đã mua một theme cho một khách hàng và khi tôi vào chỉnh sửa một số code tôi đã bị sốc nó khó đọc làm sao.

Ý tôi là:

Hơi sợ, phải không? Sau một vài phút làm việc với code này, tôi đã gửi một email tới tác giả với một liên kết đến cuốn sách tiêu chuẩn viết code.

Tránh va chạm tên tên hàm

Đụng độ tên xảy ra khi một hàm có cùng tên như hàm đã được định nghĩa trước đó. Ví dụ, nếu theme của bạn có một hàm được gọi là get_the_post_terms() và bạn cài đặt một plugin có một hàm với cùng tên bạn sẽ nhận được một cái gì đó như:

Thật không may, chúng xảy ra rất thường xuyên. Có điều là, nó rất dễ tránh.

Để tránh điều này, chúng ta có các lựa chọn:

1. Thêm tiền tố cho các hàm

Ví dụ, nếu tên plugin của bạn là "WordPress Cool Plugin", bạn có thể sử dụng một tiền tố wcc_ trong tất cả các hàm của bạn.

Vì vậy trong ví dụ trên hàm của chúng ta sẽ có tên wcc_get_the_post_terms()

Tôi cũng khuyên bạn nên thêm tiền tố vào CSS của bạn, hoặc ít nhất cố gắng làm cho nó duy nhất để tránh làm thay đổi phong cách của các plugin khác.

2. Gom các hàm của bạn bên trong một lớp

Có thể plugin của bạn đơn giản, nó không cần một lớp, nhưng bạn vẫn có thể tạo một cái để giữ cho mọi thứ được tổ chức. Tôi đặc biệt thích để sử dụng các mô hình singleton, nhưng hãy xem ví dụ dưới đây cho một lớp đơn giản với một phương thức tĩnh.

Như bạn thấy trên ví dụ này tôi chỉ thêm tiền tố vào tên lớp, nhưng hàm của tôi đơn giản được gọi là "send". Tên phương thức này bây giờ được bảo vệ khỏi không gian tên toàn cục và nó không thể được gọi trực tiếp. Để gọi nó tôi sẽ cần phải làm điều này:

Trích dẫn code

Trích dẫn code là người bạn tốt nhất của nhà phát triển. Bạn có thể nghĩa không cần thiết để trích dẫn mọi hàm hoặc biến được tạo ra, nhưng tin tôi đi, khi phát triển code của bạn - đặc biệt là khi nó nhận được sự đóng góp từ những người khác - nó có thể trở nên khó khăn để biết chính xác những gì phải làm.

Cũng như tôi đã nói trước, WordPress là một CMS cộng tác. Nhiều nhà phát triển sẽ nhìn vào code của bạn và với sự giúp đỡ họ nó sẽ đi đúng đường.

Cá nhân tôi sử dụng cú pháp PHPDoc để trích dẫn các hàm của tôi với Sublime + Docblockr, thật sự dễ để cài đặt nó.

Chúng ta hãy xem những nhà phát triển Wordpress trích dẫn hàm wp_mail() nằm ở wp-includes/pluggable.php

Như bạn thấy họ mô tả những gì mà hàm thực hiện, tham số gì là cần thiết và những gì nó sẽ trả về.

Tự nó đã giải thích chính nó, phải không?

Trích dẫn không có nghĩa là chỉ được sử dụng với PHP. Ví dụ, trong HTML tôi thích sử dụng <!--#id-of-div--> ở cuối các khối code lớn vì thế tôi sẽ không mất dấu nó.

Đối với CSS, tôi sử dụng các trích diễn để phân chia code của tôi thành nhiều phần.

Ví dụ:

Hãy chia sẻ các thủ thuật trích dẫn của bạn với chúng tôi!

Chỉ dẫn về bảo mật

Bảo mật cần phải được thực hiện rất nghiêm túc! Nếu plugin hoặc theme của bạn trở nên phổ biến, tin tôi đi, bạn không muốn trở thành một trong hàng ngàn trăng web bị hack. Nếu bạn nghĩ rằng tôi phóng đại, hãy xem nghiên cứu Checkmarx được thực hiện năm 2013 về top 50 WordPress Plugins.

Bây giờ hãy xem một số mẹo bảo mật cho phát triển WordPress:

Lỗ hổng XSS

Để ngăn ngừa XSS, chúng ta phải làm hai việc. Kiểm tra dữ liệu đầu vàokiểm tra dữ liệu đầu ra. Chúng ta có một số phương thức để kiểm tra tùy thuộc vào dữ liệu và bối cảnh sử dụng. Bằng các luật thông thường bạn không cần phải phụ thuộc vào bất kỳ trường dữ liệu nào, và không tin tưởng bất kỳ dữ liệu nào sẽ được xuất ra.

Đối với các dữ liệu đầu vào bạn có thể sử dụng hàm sanitize_text_field() kiểm tra tính hợp lệ UTF-8, chuyển đổi các ký tự đơn thành thực thể, loại bỏ tất cả các thẻ, xoá xuống dòng, tab và khoảng trắng và loại bỏ các byte dữ liệu. Tuỳ thuộc vào trường hợp của bạn, có nhiều hàm khác nhau sẽ giúp bạn lọc dữ liệu của bạn.

Điều tương tự xảy ra khi bạn xuất dữ liệu của bạn. Hãy xem ví dụ dưới đây về cách xuất một liên kết:

esc_url từ chối các url không hợp lệ, loại bỏ các ký tự không phù hợp, và xoá các ký tự nguy hiểm.

esc_html mã hoá các ký tự < > & " ' khi xuất mã HTML.

Một lần nữa, tuỳ thuộc vào dữ liệu mà bạn có, có nhiều hàm khác nhau để giúp bạn. Đối với JavaScript bạn có thể sử dụng esc_js.

Ngoài lọc dữ liệu, hãy nhớ kiểm tra tính hợp lệ của ngày tháng.

Hạn chế truy xuất trực tiếp vào các tập tin của bạn

Hầu hết các máy chủ cho phép truy xuất trực tiếp các tập tin. Trong plugin của bạn, điều này có nghĩa là hầu hết các lỗi PHP sẽ xảy ra và các lỗi đó là thông tin vô giá cho những kẻ tấn công.

Một đoạn code rất cơ bản để hạn chế điều này mà bạn có thể đặt nó ở trên code của bạn là:

Đoạn code cơ bản này hạn chế việc thực thi code nếu chúng ta không truy xuất thông qua WordPress.

Loại bỏ tất cả các cảnh báo và thông báo

Không chỉ có các lỗi PHP mới giúp những kẻ tấn công - các thông báo và cảnh báo cũng bao gồm rất nhiều thông tin có giá trị. Mỗi plugin nên được code sử dụng chế độ DEBUG. Điều này cũng sẽ giúp nắm bắt các hàm bị phản đối trong plugin của bạn. Để kích hoạt chế độ DEBUG đơn giản là tìm đến dòng này trong tập tin wp-config.php và thay đổi nó thành TRUE.

Cùng với điều này thì bạn cũng nên thử plugin Debug Bar. Bằng cách thêm dòng code đơn giản này, bạn cũng sẽ có thể phân tích tất cả các truy vấn dữ liệu.

Sử dụng cá giá trị Nonce

Các giá trị nonce là các con số được sử dụng một lần và được sử dụng để bảo vệ khỏi các yêu cầu giả mạo chéo trang (cross-site), hoặc CSRF, mặt khác, các yêu cầu không mong muốn hoặc trùng lấp gây ra các thay đổi không mong muốn vĩnh viễn hoặc không thể khôi phục đối với trang web và đặc biệt cơ sở dữ liệu của nó. Tất cả những điều này có thể được thực hiện bởi những kẻ tấn công hoặc chỉ đơn giản là do sai lầm của một người dùng đã được tin cậy.

Tuỳ thuộc vào nơi nào mà bạn cần nonce bạn đều có thể tạo nó theo các cách khác nhau:

Trong một liên kết, sử dụng wp_nonce_url()

Trong một form, sử dụng wp_nonce_field()

Để sử dụng nó ở những chỗ khác, sử dụng wp_create_nonce()

Nếu bạn kiểm tra ví dụ ở trên, bạn sẽ thấy cách tôi sử dụng wp_localize_script (cái mà tôi sẽ đề cập đến trong bài tiếp theo) để thêm nonce của tôi vào một đoạn code JavaScript. Tôi làm điều này bởi vì tôi đang dự định sử dụng jQuery để thực hiện một yêu cầu AJAX sau này và bạn nên luôn luôn thêm nonce vào trong các cuộc gọi AJAX của bạn.

Sau đó, trong đoạn mã của bạn chỉ cần đơn giản là xác minh nonce, bạn nhập code sau đây

Sử dụng các hàm và thư viện WordPress

Hãy luôn luôn kiểm tra xem nếu có bất cứ điều gì bạn đang cố gắng làm mà có thể làm điều đó với các hàm và thư viện sẵn có của WordPress. Bằng cách đó, mã của bạn sẽ ít bị lỗ hổng và nếu một lỗ hổng xuất hiện, chúng sẽ được khắc phục bởi những người đóng góp cho nhân của WordPress và bạn sẽ không phải lo lắng để liên lạc với tất cả các khách hàng của bạn.

Ví dụ nổi tiếng nhất về điều này là với thư viện TimThumb mà cho đến khi một vài năm trước đây, được sử dụng bởi hàng ngàn theme và plugin. Một ngày nọ, vào năm 2011 các lỗ hổng đã được tiết lộ. Sau đó, chúng ta có thể sử dụng các hàm được tích hợp sẵn add_image_size() cho mục đích này.

Những hàm phổ biến khác được gói bên trong chức năng của WordPress như cURL có thể dễ dàng thay thế bởi wp_remote_getwp_remote_post mà sẽ không chỉ mã hóa dữ liệu, mà chúng cũng sẽ cung cấp fallbacks, nếu cURL thất bại.

Một ví dụ khác sẽ là sử dụng hàm get_template_part() thay vì phải sử dụng hàm require() hoặc include() của PHP. Mặc dù về cơ bản là giống nhau, nhưng cái đầu tiên đã biết vị trí theme của bạn và nó sẽ tìm kiếm tập tin theo yêu cầu trong thư mục theme đó, nó không đưa ra một cảnh báo hay lỗi nào nếu tập tin không tồn tại, nó có thể tìm kiếm các tập tin phù hợp khác, nếu không tìm thấy cái được yêu cầu và nó biết về các theme con và theme cha.

Nhân của WordPress có chứa rất nhiều mã mà chúng ta có thể sử dụng trong các plugin và theme của chúng ta. Vì vậy hãy luôn luôn tìm hiểu trước khi thêm các thư viện mới.

Tiếp theo là gì?

Tôi hy vọng bạn đã nhận ra rất nhiều điều từ bài viết này. Như tôi đã đề cập trong phần mở đâu, hầu hết các thông tin này đã có sẵn trên trang Codex, nó nên là điểm đến đầu tiên của bạn ngay bây giờ trong hành trình phát triển WordPress của bạn.

Khi tôi bắt đầu phát triển WordPress một vài năm trước, tôi ước tôi có một hướng dẫn như thế này với tất cả các thông tin được tổng hợp lại với nhau, vì thế đó là lý do chính mà tôi quyết định viết loạt bài này.

Trong bài viết tiếp theo tôi sẽ trình bày các chủ đề sau:

  1. Cách đúng đắn để thêm JavaScript và Stylesheet vào trong plugin của bạn.
  2. Các sử dụng Ajax trong WordPress đúng cách
  3. Hãy để người dùng của bạn làm thay đổi các hook

Đừng ngại để lại ý kiến hoặc nhận xét của bạn đối với hai bài viết còn lại của loạt bài này.

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.