Exit lesson

Pag de-debug sa WordPress

Kapag gumagawa ng mga plugin o theme sa WordPress, mainam na gumamit ng mga kasangkapang makatutulong sa pagpapabuti ng kalidad ng iyong code at pag-aayos ng mga error kapag may problema. Ang pag-enable ng error logs, pagsusuri sa mga halaga ng mga variable habang tumatakbo ang code, at pagtingin sa mga database queries na pinapatakbo ay ilan lamang sa mga paraang maaaring gamitin ng mga developer upang matukoy at ayusin ang mga problema. Sa workshop na ito, tatalakayin natin ang ilang mga opsyon na nakapaloob mismo sa WordPress na maaari mong gamitin, pati na rin ang ilang debugging plugin at kung paano ito gamitin. Titingin din tayo ng isa o dalawang third-party tool na maaaring isaalang-alang.

Mga Layunin sa Pagkatuto

  • Ilarawan kung paano ine-enable ng 3 debug constants ang PHP upang i-configure ang error reporting, ipakita ang mga error, at tukuyin ang log file.
  • Gamitin ang error_log function upang magdagdag ng impormasyon sa log file.
  • I-set ang SAVEQUERIES constant at i-print ang $wpdb->queries array sa error log.
  • Pangalanan at ilarawan ang dalawang sikat na plugin na tumutulong sa pag-debug ng WordPress.

Mga Tanong sa Pag-unawa

  1. Ano ang tatlong debug constants na maaari mong i-set sa iyong wp-config.php file, at ano ang tungkulin ng bawat isa?
  2. Anong uri ng mga parameter ang maaaring ipasa sa PHP error_log function?
  3. Ano ang kakayahang naibibigay ng pag-enable ng SAVEQUERIES constant?
  4. Alin ang dalawang plugin na maaari mong gamitin upang i-debug ang iyong mga WordPress request?
Tignan ang script ng Video

Kamusta, at welcome sa Learn WordPress.

Sa tutorial na ito, matututuhan mo ang tungkol sa mga opsyon sa pag-debug sa WordPress. Malalaman mo kung paano paganahin ang built-in na mga debugging option ng WordPress at kung paano ito gamitin, pati na rin ang ilang plugin na makakatulong sa iyong mag-debug ng page requests.

Ang debugging ay ang proseso ng paghahanap at pagsasaayos ng mga error sa iyong code. Dahil ang pangunahing mga programming language ng WordPress ay PHP at JavaScript, kailangan mong matutong mag-debug sa pareho. Sa JavaScript na tumatakbo sa browser, madali lang gamitin ang console.log para magsulat ng mga mensahe sa browser console bilang bahagi ng testing at debugging. Ang PHP naman ay tumatakbo sa server, kaya kailangan mong malaman kung paano tukuyin ang mga nangyayari kapag may problema. May ilang third-party tools na puwedeng gamitin para sa mas advanced na debugging gaya ng XDebug o Ray, pero para sa tutorial na ito, pag-uusapan natin ang mga opsyong partikular sa WordPress na hindi nangangailangan ng karagdagang software.

Sa WordPress, tuwing may request na nangyayari, tumatakbo ang wp_debug_mode function para i-setup ang debugging environment. Makikita ang function na ito sa wp-includes/load.php na file. Kapag tiningnan mo ang code, makikita mo na kung ang WP_DEBUG constant ay naka-set sa true, iseset nito ang PHP error reporting level sa E_ALL, ibig sabihin ay bubuksan ang lahat ng error reporting. Bukod pa rito, kung naka-set ang WP_DEBUG_DISPLAY sa true, ise-set nito ang display_errors sa 1, na ibig sabihin ay ipapakita ang mga error sa screen. Panghuli, kung naka-set ang WP_DEBUG_LOG sa true, ise-set nito ang error log sa wp-content/debug.log na file. Maaari ring mag-set ng custom location ng debug log file bukod sa default. Kapag naka-enable ang log file na ito, ise-set nito ang PHP log_errors setting sa 1 at ang error_log setting sa path ng log file, na ibig sabihin ay lahat ng error ay malalagay sa file na iyon.

Sa pamamagitan ng kaalamang ito, maaari mong i-configure ang wp-config file mo para paganahin ang debugging sa WordPress.

Para paganahin ang debugging, buksan ang wp-config file at hanapin ang bahagi kung saan naka-set ang WP_DEBUG constant. Maari mo itong i-update para maging ganito ang hitsura.

Ang configuration na ito ay magpapagana ng debugging, hindi ipapakita ang mga error sa screen, pero ise-save ang mga error sa wp-content/debug.log na file.

Depende sa iyong kagustuhan, maaari mong paganahin ang pagpapakita ng error sa screen. Pero maaari itong magdulot ng problema gaya ng hindi mapansin ang error o matabunan ang ibang importanteng impormasyon sa screen. Lalo na kung ang dine-debug mo ay isang production site, hindi mo gustong makita ng mga user ang mga error dahil maaaring may sensitibong impormasyon ito.

Para makita ito sa aktwal, tingnan natin ang isang halimbawa. Halimbawa gumawa ka ng plugin gamit ang sumusunod na code. Gumagawa ang plugin ng form submissions table sa database kapag na-activate. Pagkatapos, nagrerehistro ito ng REST API GET route para kunin ang form submissions mula sa database. Para sa testing, mano-mano kang naglagay ng ilang records sa table. Pero kapag binisita mo ang REST API GET route, wala kang nakikitang submissions, kaya kailangan mong hanapin ang bug sa code mo. Sa simpleng pag-enable ng debugging, lahat ng error ay malalagay agad sa wp-content/debug.log file. Kapag tiningnan mo ito, makikita mo ang mga error. Sa kasong ito, may dalawang error. Una ay isang PHP notice mula sa WordPress na dulot ng maling pag-hook ng wp_learn_register_routes function. Pangalawa ay error sa database query para kunin ang submissions. Mukhang tine-test niya ang table na form_submission imbes na form_submissions.

Maaari natin itong ayusin sa pamamagitan ng pagwasto ng action hook na ginagamit at pag-ayos ng pangalan ng table sa callback function. Kapag naayos na ang mga error at binalikan ang REST API GET route, makikita mo na ang mga form submissions.

Bukod sa pag-log ng error sa debug.log file, maaari ka ring mag-log ng mensahe o variable gamit ang PHP error_log function. Tumatanggap ito ng isang string na parameter. Halimbawa, kung gusto mong i-log ang SQL query sa wp_learn_get_form_submissions callback, puwede mong gamitin ang code na:

error_log at pagkatapos ay $wpdb->last_query.

Kapag ni-refresh mo ang request at tiningnan ang debug.log file, makikita mo na ang query ay naka-log na. Bukod sa huling query, maaari mo ring i-log lahat ng query na tumatakbo sa WordPress request lifecycle. Para gawin ito, i-enable ang SAVEQUERIES constant sa wp-config file. Kapag naka-enable na ito, maaari mong i-log ang lahat ng query gamit ang ganitong code:

print_r ng $wpdb->queries at iset ang second parameter sa true. Gamit ito, maaaring i-log ang array ng lahat ng query na tumakbo sa debug.log file gamit ang error_log at print_r.

Kapag tinesting natin ito sa form submissions endpoint at tiningnan ang debug.log file, makikita mo ang lahat ng ibang queries na tumakbo bago ang query ng form submissions.

Bukod sa mga built-in na opsyon, may ilang plugin din na makakatulong sa debugging. Una ay ang Query Monitor — isang debugging plugin na nagdadagdag ng debug menu sa admin bar at nagpapakita ng impormasyon tungkol sa current page request. Kasama rito ang database queries, HTTP request, hooks at actions, loaded scripts at styles, at marami pa. Pangalawa ay ang Debug Bar — nagdadagdag din ito ng debug menu sa admin bar at nagpapakita ng debugging information. Tumutok ito sa database queries, WP query object, HTTP request, at object cache. Kapag kinlik mo ang mga item, lalabas ang specific toolbar ng bawat plugin at makikita mo ang mga impormasyon na naka-log.

At diyan nagtatapos ang tutorial tungkol sa debugging sa WordPress. Para sa karagdagang impormasyon, bisitahin ang debugging at WordPress page sa WordPress developer documentation.

Maligayang pag-debug

Panimula

Kamusta! Welcome sa Learn WordPress.

Sa tutorial na ito, matututuhan mo kung paano mag-debug sa WordPress.

Matututuhan mong i-enable ang mga built-in na debugging options ng WordPress at kung paano ito gumagana, pati na rin ang ilang plugin na makakatulong sa pag-debug ng mga page request mo.

Ano ang Debugging?

Ang debugging ay ang proseso ng paghahanap at pag-aayos ng mga error sa iyong code.

Dahil ang pangunahing mga programming language ng WordPress ay PHP at JavaScript, mahalagang matutunan mong i-debug ang pareho.

Para sa JavaScript, na tumatakbo sa browser, madali lang gamitin ang console.log() upang magsulat ng mga mensahe sa browser console para sa testing at debugging.

Para naman sa PHP, na tumatakbo sa server, kailangan mo ng ibang paraan upang malaman kung ano ang nangyayari kapag may problema.

May ilang third-party tools na pwede mong gamitin para sa advanced debugging tulad ng Xdebug o Ray, pero sa tutorial na ito, pag-uusapan natin ang mga WordPress-specific options na hindi kailangan ng karagdagang software.

Pag-debug ng PHP

Sa WordPress, sa bawat request lifecycle, tumatakbo ang wp_debug_mode() function upang i-set up ang debugging environment. Makikita ito sa wp-includes/load.php.

Kung titingnan mo ang code na ito, makikita mong kapag naka-true ang WP_DEBUG, iseset nito ang PHP error reporting level sa E_ALL, ibig sabihin nito: i-on lahat ng error reporting.

Kapag naka-true rin ang WP_DEBUG_DISPLAY, iseset nito ang display_errors sa PHP ini setting na 1 — ibig sabihin: ipapakita ang mga error sa screen.

Kapag naka-true naman ang WP_DEBUG_LOG, iseset nito ang error_log location sa wp-content/debug.log. Pwede mo ring i-configure ang ibang path para sa log file kung gusto mo.

Paano I-enable ang Debugging

Buksan ang wp-config.php at hanapin ang bahagi kung saan naka-define ang WP_DEBUG.

Palitan ito ng:

define( 'WP_DEBUG', true );
define( 'WP_DEBUG_DISPLAY', false );
define( 'WP_DEBUG_LOG', true );

Ang configuration na ito ay:

  • I-eenable ang debugging
  • Idi-disable ang pagdisplay ng error sa screen
  • Ilo-log ang errors sa wp-content/debug.log

Tip: Huwag i-enable ang error display sa production site, dahil baka magpakita ito ng sensitibong impormasyon sa users.

Halimbawa

Isipin mong gumawa ka ng plugin na ito:

<?php
/**
 * Plugin Name: WP Learn Debugging
 * Plugin Description: A plugin to learn about debugging in WordPress.
 * Plugin URI: https://learn.wordpress.org
 * Version: 1.0.0
 */

register_activation_hook( __FILE__, 'wp_learn_setup_table' );

function wp_learn_setup_table() {
    global $wpdb;
    $table_name = $wpdb->prefix . 'form_submissions';

    $sql = "CREATE TABLE $table_name (
      id mediumint(9) NOT NULL AUTO_INCREMENT,
      name varchar(100) NOT NULL,
      email varchar(100) NOT NULL,
      PRIMARY KEY (id)
    )";

    require_once( ABSPATH . 'wp-admin/includes/upgrade.php' );
    dbDelta( $sql );
}

add_action( 'init', 'wp_learn_register_routes' );

function wp_learn_register_routes() {
    register_rest_route(
        'wp-learn-form-submissions-api/v1',
        '/form-submissions/',
        array(
            'methods'             => 'GET',
            'callback'            => 'wp_learn_get_form_submissions',
            'permission_callback' => '__return_true'
        )
    );
}

function wp_learn_get_form_submissions() {
    global $wpdb;
    $table_name = $wpdb->prefix . 'form_submissions';

    $results = $wpdb->get_results( "SELECT * FROM $table_name" );

    return $results;
}

Ang plugin na ito ay:

  • Gumagawa ng form_submissions table kapag na-activate
  • Nagre-register ng REST API route para kunin ang mga submissions

Kung manu-mano kang nag-insert ng data sa table, pero walang lumalabas sa REST API route, baka may bug.

Kapag naka-enable ang debugging, awtomatikong malalagay ang errors sa wp-content/debug.log.

Halimbawa ng log:

[02-Jun-2023 13:51:41 UTC] PHP Notice: Function register_rest_route was called incorrectly...

Dalawang problema:

  1. Mali ang pagkakahook ng register_rest_route — dapat sa rest_api_init.
  2. Mali ang pangalan ng table sa query — form_submission imbes na form_submissions.

Paggamit ng error_log()

Pwede ka ring gumamit ng error_log() para mag-log ng mensahe:

error_log( $wpdb->last_query );

Log output:

[02-Jun-2023 13:55:35 UTC] SELECT * FROM wp_form_submissions

Gamit ang SAVEQUERIES Constant

Kung gusto mong i-log lahat ng queries, idagdag ito sa wp-config.php:

define( 'SAVEQUERIES', true );

At sa code:

error_log( print_r( $wpdb->queries, true ) );

Makikita mo ang lahat ng query na tumakbo during the request lifecycle.

Debugging Plugins

Query Monitor

Nagdadagdag ng debug menu sa admin bar. Ipinapakita ang info tungkol sa:

  • Database queries
  • HTTP request
  • Hooks, scripts, styles, at iba pa

Debug Bar

Isa ring plugin na may debug menu sa admin bar. Ipinapakita ang:

  • WP Query object
  • HTTP request data
  • Object cache info

Pangwakas

At ‘yan ang kabuuan ng tutorial tungkol sa debugging sa WordPress. Para sa mas marami pang impormasyon, bisitahin ang Debugging in WordPress.

Happy debugging!

Suggestions

Found a typo, grammar error or outdated screenshot? Contact us.