آموزش دریافت و نمایش نوشته های وردپرس با WP REST API

راه های مختلفی برای دریافت لیست نوشته های وردپرس وجود دارد که می توانید بر اساس سناریوی مدنظرتان از آنها استفاده نمائید:

  1. استفاده مستقیم از کلاس WP_Query در پلاگین یا قالب سایت
  2. پیاده سازی AJAX API از طریق فایل admin-ajax.php، برای اطلاعات بیشتر مقاله آموزش استفاده از ایجکس(jQuery Ajax) در وردپرس(مثال استان و شهر) را مطالعه فرمائید.
  3. استفاده از WordPress REST API

اما هدف و سناریوی این پست آموزشی چیست و با چه روشی آن را پیاده سازی کنیم؟

فرض کنید در حال توسعه یک اپلیکیشن موبایل برای وب سایت تان هستید که تعداد n نوشته وردپرس را به صورت رندوم از دیتابیس وردپرس دریافت می کند و به کاربران نمایش می دهد، برای پیاده سازی این سناریو می توانید از روش های ۲ و ۳ استفاده کنید، اما روش دوم سربار و پیچیدگی بیشتر و البته سرعت کمتری دارد.

به طور کلی در پروژه های اینچنینی بهتر است اطلاعات وب سایت تان را از طریق API در اختیار سایر بسترها قرار دهید، پس این سناریو را با روش سوم پیاده سازی می کنیم، اما قبل از آنکه به بحث اصلی خود بپردازیم پیشنهاد می کنیم برای آشنایی مقدماتی با REST API مقاله افزایش امنیت وردپرس با مخفی کردن WP REST API را مطالعه فرمائید.

گام اول: تعریف مسیر(Route) و نقطه پایانی(Endpoint)

در ابتدای کار باید یک روت جدید مثلا(random-posts) تعریف کنید تا اپلیکشن موبایل بتواند از طریق آن اطلاعات موردنیاز خود را از وردپرس دریافت کند، برای این منظور کدهای زیر را به فایل functions.php اضافه نمائید.

function st_register_random_posts_api()
{
    register_rest_route( 'api/v1', '/random-posts/(?P<count>\d+)',
        array(
            'methods' => 'GET',
            'callback' => 'st_get_random_posts'
        )
    );
}

add_action( "rest_api_init", "st_register_random_posts_api" );

 

چند نکته:

  1. از تابع “register_rest_route” برای ایجاد یک روت جدید استفاده می کنیم.
  2. “api/v1” نام namespace است که مانع تداخل(Conflict) روت “random-posts” با روت های تعریف شده در سایر قالب ها و افزونه می شود.
  3. “random-posts” روتی است که یک پارامتر عددی به نام Count(تعداد پست یا posts_per_page) دریافت می کند.
  4. “st_get_random_posts” تابعی است که در گام بعد ایجاد می کنیم، این تابع به درخواست های دریافتی پاسخ می دهد.

گام دوم: دریافت نوشته ها به صورت تصادفی

در این مرحله تابع st_get_random_posts را پیاده سازی می کنیم، بنابراین کدهای زیر را در فایل functions.php قرار دهید.

function st_get_random_posts( $data )
{
    $count = sanitize_text_field( $data['count'] );

    $args = array(
        'post_type' => 'post',
        'orderby' => 'rand',
        'posts_per_page' => $count
    );

    $query = new WP_Query( $args );

    $posts = array();
    
    while ( $query->have_posts() ) {
        $query->the_post();
        array_push( $posts, array(
            'title' => get_the_title(),
            'content' => wp_trim_words( get_the_content(), 18 ),
            'permalink' => get_the_permalink(),
            'author' => get_the_author()
            )
        );
    }
    wp_reset_postdata();
    return $posts;
}

 

چند نکته:

  1. توسط آرایه data$ به پارامتر تعداد نوشته ها دسترسی پیدا کردیم.
  2. عنوان، محتوا، پیوند یکتا و نویسنده نوشته را با تابع array_push به آرایه posts$ اضافه می کنیم.
  3. با تابع wp_trim_words فقط ۱۸ کاراکتر ابتدایی محتوای نوشته را استخراج می کنیم.

گام سوم: تست و بررسی Route

حالا عملکرد روت ایجاد شده را چک می کنیم، برای این منظور می توانید از نرم افزار قدرتمند Postman استفاده نمائید، همانطور که در تصویر زیر ملاحظه می کنید روت random-posts به درستی پیاده سازی شده است.

تست wp rest api با postman

 

گام چهارم: فراخوانی روت با jQuery

در نهایت لیست نوشته ها را با تابع getJSON دریافت می کنیم، پیشنهاد می کنیم برای اطلاعات بیشتر مقاله روش صحیح و اصولی استفاده از jQuery در وردپرس را مطالعه فرمائید.

( function ( $ ) {
    $.getJSON( 'https://startuptuts.com/wp-json/api/v1/random-posts?count=3', ( results ) => {
        $( ".featured-posts" ).html(`
              <ul>
              ${results.map( item =>
                    `<li>
                       <a href="${item.permalink}">${item.title}</a>
                     </li>
                     <li>${item.content}</li>
                     <li>${item.author}</li>`
                    ).join( '' )}
             </ul>
            `);
    });
})( jQuery )

جمع بندی

REST API قابلیت فوق العاده ای است که در بسیاری از محصولات و خدمات (Mailchimp، WooCommerce و …) پیاده سازی شده است. به عنوان مثال در مقاله آموزش ساخت لینک کوتاه بیتلی(Bitly) در وردپرس(بدون افزونه) از API ارائه شده توسط سرویس بیتلی(https://api-ssl.bitly.com/v4/bitlinks) استفاده کردیم.

نظرات و سوالات کاربران

پاسخی بگذارید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *