Yeni WordPress REST API'si hakkında bilmeniz gerekenler

Yayınlanan: 2018-01-25

WordPress 4.4, WordPress REST API'sini çekirdeğin bir parçası haline getirdi.

Bu makalede, bu geliştirmenin WordPress (ve genel olarak tema ve eklenti yazarları) için neden çok büyük olduğunu açıklayacağım ve WordPress ile diğer uygulamalar arasındaki iletişim sürecini basitleştirmek için onu nasıl kullanacağınızı göstereceğim.

WordPress Rest API, WordPress web sitelerinin, çeşitli bir teknoloji yığını kullanarak tamamen kişiselleştirilmiş bir yönetici veya içerik deneyimleri sunmak için varsayılan WordPress yönetici arayüzünden kurtulmasını da mümkün kılar.

Calypso – WordPress'in masaüstü uygulaması – bunun güzel bir örneğidir. Calypso, WordPress.com ile çekirdek arasında iletişim kurmak için WordPress REST API'sini kullanan tek bir Javascript uygulaması kullanılarak oluşturulmuştur.

WordPress REST API'si artık WordPress çekirdeğinin ayrılmaz bir parçası olduğundan, geliştiricilerin nasıl çalıştığını ve WordPress ile etkileşim için açtığı yeni olasılıkları iyi bir şekilde ele almaları önemlidir.

Bu nedenle, bu WordPress REST API'sine genel bakış ve eğitimde, WP REST API'nin temelleri boyunca size yol göstereceğim ve ayrıca Heroic Knowledge'den en son gönderileri görüntüleyen bir (eklenti) widget'ı oluşturmak için onu nasıl kullanabileceğinizi göstereceğim. Temel özel gönderi türleri.

WordPress REST API'sinde bir başlangıç

Bir (eklenti) widget'ı oluşturmak için WordPress REST API'sinin nasıl kullanılacağını görmeden önce, terimi biraz daha iyi anlayalım.

Peki API ne anlama geliyor?

API, Uygulama Programı Arayüzü anlamına gelir.

En basit ifadeyle, iki farklı uygulama arasında bir iletişim aracıdır.

Eylem halindeki bir API'nin yaygın bir örneği, birçok web sitesinin görüntülediği Tweet Destesidir. Bu Tweet Destesinin görüntülenmesi, web sitesinin sadece Twitter'dan veri alıp görüntülediği bir API aracılığıyla mümkün olur.

Peki ya REST?

REST, Temsili Durum Transferinin kısaltmasıdır .

REST, API'ler oluşturmaya yönelik HTML tabanlı bir mimari stildir . RESTful mimarisi, iki kaynak arasında veri göndermek, okumak, güncellemek ve silmek için HTTP isteklerini kullanır.

Dolayısıyla, bir REST API'sinden bahsettiğimizde, esasen iletişim kurmak için HTML yöntemlerini kullanan bir API'yi kastediyoruz.

Peki ya JSON?

WordPress REST API, WordPress JSON REST API ile aynı formattadır.

JSON (veya Javascript Object Notation ), farklı platformlar arasında (platformlar farklı diller kullansa bile) sorunsuz bir şekilde veri alışverişi yapmak için kullanılan minimal, metin tabanlı bir veri değiş tokuş biçimidir.

JSON, XML tabanlı çözümlere hafif bir alternatiftir ve bant genişliği sınırlamaları olan mobil uygulamalar için mükemmeldir.

WordPress REST API'sini neden kullanmalısınız?

WordPress REST API'sinde neyin bu kadar istisnai olduğunu ve bunu neden önemsemeniz gerektiğini merak ediyor olabilirsiniz.

Pekala… WordPress REST API, WordPress ile daha fazlasını yapmanızı sağlar.

Örneğin:

  1. Bildiğiniz herhangi bir dilde uygulamalar yazın ve bir WordPress sitesiyle etkileşime girmesini sağlayın (uygulamanızın dilinin HTML yöntemlerini kullanması ve JSON'u yorumlayabilmesi gereken tek 2 gereksinim)
  2. Tamamen kişiselleştirilmiş yönetici ve içerik deneyimleri tasarlayın
  3. WordPress'in Üstünde Tek Sayfa Uygulamaları Geliştirin

Ve daha fazlası.

REST API ile oluşturulabilecek tüm potansiyel uygulamaları/arayüzleri/deneyimleri listelemek neredeyse imkansızdır. WordPress' REST API el kitabı haklı olarak şunları söylüyor:

WordPress REST API ile yapılabileceklerin tek sınırı hayal gücümüzdür. Sonuç olarak, HTTP üzerinden WordPress'e veri almak için yapılandırılmış, genişletilebilir ve basit bir yol istiyorsanız, muhtemelen REST API'sini kullanmak istersiniz.

Ancak uygulamanın her zaman teoriyi anlamaktan çok daha zor olduğunu biliyorum.

Şimdi özel (eklenti) bir widget oluşturmak için WordPress REST API'sini nasıl kullanabileceğinize dair hızlı bir eğitim görelim.

WordPress REST API'sinin nasıl kullanılacağına dair hızlı bir eğitim

KnowAll yardım merkezi temamız veya Heroic Knowledge Base eklentisiyle kendi temanız gibi bilgi tabanı ürünlerimizden birine sahipseniz, destek makalelerinden oluşan bir bilgi tabanına sahip bir siteniz olur. Bu eğitimin ilkelerini takip etmek için bu ürünleri kullanmak gerekli değildir, ancak herhangi bir kodu kendi kurulumunuza göre uyarlamanız gerekeceğini unutmayın.

Peki, yerel kurulumunuz hazır mı?

Harika!

Şimdi yapacağımız şey, farklı bir sunucuda başka bir web sitesi oluşturmak.

Peki neden bu ikinci web sitesini oluşturuyoruz?

Bunu yapıyoruz çünkü bu ikinci web sitesiyle iletişim kurmak için WordPress REST API'sini uygulamak istiyoruz ve şimdi bildiğiniz gibi, WordPress REST API tamamen konuşmaları gerçekleştirmekle ilgili.

Bu nedenle, iki web sitesinin birbiriyle konuşmasını ve veri alışverişinde bulunmasını sağlamak için WordPress REST API'sini kullanacağız.

Ve öğreticinin nihai hedefi şudur:

Yardım merkezi web sitesinden en son yayınlanan bilgi bankası makalelerini seçin ve bunları yeni web sitesinin kenar çubuğunda bir pencere öğesinde görüntüleyin.

Bu makalenin hatırına, tüm bilgi bankası makalelerine sahip yardım merkezi web sitesi ' yerel ' web sitesi olarak anılacaktır ve widget'ı görüntüleyeceğiniz yeni web sitesi ' harici ' web sitesi olacaktır.

Bu noktada, 1) 'yerel' yardım merkezi web siteniz ve 2) farklı bir sunucuda kurulmuş yeni bir 'harici' web siteniz olduğunu varsayıyorum.

Ve eğitimin sonunda, özel bir (eklenti) widget'ı kullanarak yeni "harici" web sitesinde (WordPress REST API aracılığıyla) "yerel" web sitesindeki bilgi tabanı makalelerinin bir listesini başarıyla görüntüleyebilirdik.

Bununla, başlamaya hazırız:

Adım #1: Aşağıdaki ortak kodu yeni bir .php dosyasına kopyalayarak başlayın ve 'harici' web sitenizin eklentiler klasörüne kaydedin.

Bu WordPress REST API öğreticisinin tam kodunu buradan görün. 

/**
* HeroThemes Example Widget
*/
class My_Widget extends WP_Widget { 

    //set up widget
    public function __construct() { 

        $widget_ops = array( 
                        'classname' => 'rest-api-test-widget',
                        'description' => 'This example provides a framework for how we will build our widget'
        );

        parent::__construct( 'my_widget', 'My Widget', $widget_ops );
    }


    /**
     * Outputs the content of the widget
     * @param array $args
     * @param array $instance
     */

    public function widget( $args, $instance ) {
        //outputs the content of the widget
        echo $args['before_widget'];

        if( !empty( $instance['title'] ) ) {
          echo $args['before_title'] . apply_filters( 'widget_title', $instance['title'], $instance, $this->id_base ) . $args['after_title'];

        }

        // Main Widget Content Goes Here

        echo $args['after_widget'];
    }


    /**
     * Outputs the options form on admin
     * @param array $instance The widget options
     */

    public function form( $instance ) {
        //outputs the options form on admin
        $title = ( !empty( $instance['title'] ) ) ? $instance['title'] : ''; ?>

        <label for="<?php echo $this->get_field_name( 'title' ); ?>">Title: </label>

        <input class="widefat" id="<?php echo $this->get_field_id( 'title' ); ?>" 
        name="<?php echo $this->get_field_name( 'title' ); ?>" 
        type="text" value="<?php echo esc_attr( $title ); ?>" />
    
        <?php 
    } 

} 

 add_action( 'widgets_init', function(){ register_widget( 'My_Widget' ); } );

Bu kod, seçtiğiniz bir başlığı görüntüleyecek çok basit bir pencere öğesi oluşturur.

Kodu şablonun en üstüne ekleyerek ve eklentiler dizinine kaydederek (kodu temanın işlevler dosyasına eklemek yerine) bir eklenti olarak oluşturduk.

Bu küçük bir şey ama bu tarzda bir eklenti olarak bir widget oluşturmak, onu açıp kapatabilmenize ve daha sonra dilerseniz kopyalayıp yapıştırmaya gerek kalmadan başka temalarda yeniden kullanabilmenize olanak tanır.

Kurulduktan ve etkinleştirildikten sonra, kontrol panelinin Widget'lar alanında yeni bir widget'ınız olacak:

widget-admin

Adım #2: En son bilgi bankası makalelerini getirmek için WordPress REST API'sini kullanın

Bu geliştirmede hiçbir şeyi düzenlemek veya silmek istemediğiniz için, yalnızca widget() işlevine odaklanacağız. Widget'tan gelen içeriğin 'harici' web sitesine çıktığı yer burasıdır.

'Yerel' web sitesinden en son bilgi bankası makalelerinin listesini 'almak' için bilmemiz gereken birkaç şey var:

  • API'nin temel yolu (sitenizde hangi API'yi kullanacaksınız, bizim durumumuzda en son WP API'si)
  • Kullanılan rota (WP API, farklı veri kümeleri ve mevcut işlemler için birden çok rotaya sahiptir)
  • Kullanılan uç nokta (Hangi eylem gerçekleştirilecek)
  • Parametreler (Talep ile ilişkili veriler)

API'nin temel yolu her zaman şudur:

 json/wp/v2/

Ve böylece mutlak API yolu şu hale gelir:

 http://example.com/json/wp/v2/

(http://example.com 'yerel' web sitenizdir)

Kullanılan rota:

 json/wp/v2/posts/

Uç noktalar hakkında: Bu rotanın aslında HTTP yöntemleriyle farklılaştırılmış üç uç noktası vardır. Bu uç noktalar şunlardır:

  • ALMAK
  • KOYMAK
  • SİLMEK

Bu örnekte, 'yerel' web sitesinden en son gönderilerin bir listesini alabilmeniz (veya 'alabilmeniz') için GET uç noktasını seçeceksiniz.

Bu nedenle, REST API ile etkileşime giren ilk kod satırınız şöyle olacaktır:

$response = wp_remote_get( 'http://products-website.com/wp-json/wp/v2/posts/' );

Ardından, herhangi bir hatanın döndürülüp döndürülmediğini kontrol etmeniz gerekir:

if( is_wp_error( $response ) ) {
    return;
}

Bu kodun tek yaptığı, hangi yanıtın döndürüldüğünü kontrol etmektir. Yanıt bazı gönderileri döndürürse, hata yoktur.

Bu bölümün son kısmı:


$posts = json_decode( wp_remote_retrieve_body( $response ) );

if( empty( $posts ) ) {
   return;
}

$response, Gönderi verileriyle JSON kodlu bir dizedir. Yani burada yaptığınız tek şey, çıktı alınabilmesi için kodunu çözmek.

Yine, $posts'un boş olmadığından emin olmak için ek bir kontrol ekleyin. Eğer öyleyse, hiçbir şey iade edilmez.

Bu noktada, API kullanarak 'yerel' web sitenizle başarılı bir şekilde iletişim kurdunuz. Bu uygulama, size görüntülenecek bir gönderi listesi bırakır.

Bir sonraki aşama, bunları gerçekten 'harici' web sitesindeki widget'ınızda görüntülemektir.

Adım #3: Aşağıdaki kodu ekleyerek 'harici' web sitesindeki en son gönderileri görüntüleyin:

		if( !empty( $posts ) ) {
		
			echo '<ul>';
			foreach( $posts as $post ) {
				echo '<li><a href="' . $post->link. '">' . $post->title->rendered . '</a></li>';
			}
			echo '</ul>';
			
		}

Tamamladığınız widget'ınızın kodu şöyle görünmelidir: 

/**
* HeroThemes REST API Widget
*/
class REST_API_Widget extends WP_Widget { 

	//set up widget 
	public function __construct() { 
		$widget_ops = array( 	'classname' => 'rest-api-widget',
 								'description' => 'A REST API widget that pulls posts from a different website'
 		);
 		parent::__construct( 'rest_api_widget', 'REST API Widget', $widget_ops );
 	}

	/**
	* Outputs the content of the widget
	*
	* @param array $args
	* @param array $instance
	*/
	public function widget( $args, $instance ) {
		//change this url to the WP-API endpoint for your site!
		$response = wp_remote_get( 'https://example.com/wp-json/wp/v2/ht-kb/' );

		if( is_wp_error( $response ) ) {
			return;
		}

		$posts = json_decode( wp_remote_retrieve_body( $response ) );

		if( empty( $posts ) ) {
			return;
		}

		echo $args['before_widget'];
		if( !empty( $instance['title'] ) ) {
			echo $args['before_title'] . apply_filters( 'widget_title', $instance['title'], $instance, $this->id_base ) . $args['after_title'];
		}
		
		//main widget content
		if( !empty( $posts ) ) {
		
			echo '<ul>';
			foreach( $posts as $post ) {
				echo '<li><a href="' . $post->link. '">' . $post->title->rendered . '</a></li>';
			}
			echo '</ul>';
			
		}

		echo $args['after_widget'];
	}

	/**
	* Outputs the options form on admin
	*
	* @param array $instance The widget options
	*/
	public function form( $instance ) {
		// outputs the options form on admin
		$title = ( !empty( $instance['title'] ) ) ? $instance['title'] : '';
		?>

		<label for="<?php echo $this->get_field_name( 'title' ); ?>">Title: </label>
		<input class="widefat" id="<?php echo $this->get_field_id( 'title' ); ?>" 
		  name="<?php echo $this->get_field_name( 'title' ); ?>" 
		  type="text" value="<?php echo esc_attr( $title ); ?>" />
		
		<?php 
	} 

 } 

 add_action( 'widgets_init', function(){ register_widget( 'REST_API_Widget' ); } );

Yukarıdaki adım tamamlandığında, şimdi 'harici' web sitenizi görüntülemeyi denediğinizde, kenar çubuğunuzda 'yerel' web sitesindeki gönderilerinizin bir listesini göreceksiniz.

Araç

Bu harika.

Ancak, hatırlarsanız, bunlar doğru gönderiler değil çünkü biz sadece Bilgi Bankasındaki en son makaleleri göstermek istiyoruz.

Mevcut uygulamamız bunu yapmaz çünkü Bilgi Bankası eklentisi kendi özel gönderi türünü kullanır. Ve özel gönderi türleri varsayılan olarak API'lerde herkese açık olmadığından bu bir soruna neden olur. (Not: Bilgi tabanının en son sürümü REST API'de herkese açıktır ve sonraki bölüm atlanabilir)

REST API'yi özel gönderi türleriyle kullanma

Özel gönderi türlerini REST API'de kullanılabilir hale getirmek için küçük bir geçici çözüme ihtiyacınız var.

Bu nedenle, özel bir gönderi türü oluştururken, onu herkese açık hale getirmek için gönderi türü args kaydına yeni bir parametre eklemeniz gerekir:


'show_in_rest' = true,
'rest_base' = 'ht_kb',
'rest_controller_class' = 'WP_REST_Posts_Controller',

Ancak bizim durumumuzda, bilgi bankası makale gönderi türünü güçlendirmek için bir eklenti kullandığımızdan, özel gönderi türlerini REST API için kullanılabilir hale getirmek için eklenti dosyasını doğrudan düzenlemeyeceğiz. (Bir eklenti dosyasını doğrudan düzenlemek asla iyi bir fikir değildir!)

Bunun yerine yapacağımız şey, 'yerel' web sitesi için alt temadaki function.php dosyasına aşağıdaki kodu eklemek:

KnowAll ve Heroic Knowledge Base'in en son sürümünde REST desteği zaten etkindir, bu ht_kb_show_in_rest filtresiyle devre dışı bırakılabilir, ancak aşağıdaki kodu kendi özel gönderi türünüz için değiştirebilirsiniz. 
/**
* Add rest support to an existing post type
*/
add_action( 'init', 'my_custom_post_type_rest_support', 25 );

function my_custom_post_type_rest_support() {
    global $wp_post_types;

    //set this to the name of your post type!
    $post_type_name = 'ht_kb';
    if( isset( $wp_post_types[ $post_type_name ] ) ) {
        $wp_post_types[$post_type_name]->show_in_rest = true;
        $wp_post_types[$post_type_name]->rest_base = $post_type_name;
        $wp_post_types[$post_type_name]->rest_controller_class = 'WP_REST_Posts_Controller';
    }
}

Artık, özel gönderi türü 'ht_kb', WP REST API'sinde herkese açıktır.

Özel gönderi türünü WordPress REST API için kullanılabilir hale getirdikten sonra, şimdi bu gönderi türüne sahip gönderileri göstermek için widget'ımızı düzeltmemiz gerekiyor. Bunun için 2. Adımdaki $response koduna geri döneceğiz ve kodu şu şekilde güncelleyeceğiz:

$response = wp_remote_get( 'http://example.com/wp-json/wp/v2/ht_kb/' );

API yolundaki /posts/'u /ht_kb/ olarak değiştiriyoruz çünkü 'ht_kb' eklentinin özel gönderi türünün adıdır.

Widget'ınızı güncelledikten ve 'harici' web sitesini önizledikten sonra, şimdi Bilgi Bankasındaki en son makaleleri görmelisiniz.

widget-kb-içeriği

Son düşünceler

Gördüğümüz gibi, PHP ve HTML'nin birkaç basit parçacığını kullanarak yeni işlevler, widget'lar ve eklentiler oluşturabilirsiniz.

Bilgi Bankası makalelerinde arama yapmak ve sonuçları pencere aracında döndürmek için WP REST API'sini kullanan bir arama kutusu oluşturmak için az önce yaptığımız eklentiyi değiştirebilirsiniz.

Veya sonuçları kimin göreceğini kontrol etmek için kimlik doğrulamayı kullanabilirsiniz (kısıtlanmış içerik oluşturduysanız kullanışlıdır).

Deneyebileceğiniz çok şey var! Sadece temel bilgileri doğru bir şekilde alın ve her şey hazır olacak.

daha fazla okuma

WordPress REST API'sinin etrafında çok fazla eskimiş içerik var, bu yüzden güncellenmiş şeyleri okuduğunuzdan emin olun. Tüm gönderi boyunca bazı yararlı kaynaklara bağlantı verdim, ancak bazılarını burada da listeliyorum.

Bu yüzden bunları okuyun ve REST API'yi kullanmanın farklı yaratıcı yollarını öğrenin.

  • REST API El Kitabı
  • REST API SSS'leri
  • WP REST API: Gittiğimiz yer burası mı?

WordPress REST API'sinin uygulanmasıyla ilgili herhangi bir sorunuz varsa, bunları aşağıdaki yorumlara bırakın!