Eine Kurzanleitung zur WooCommerce REST API

Möchten Sie mit der WooCommerce REST API interagieren? WooCommerce bietet eine REST-API, die Ihnen Echtzeitdaten aus dem Backend liefert, die Sie überall in Ihrer externen Anwendung platzieren können. Über seine REST-API kann man seine WooCommerce-Daten verwalten, indem man die Endpunkte erreicht. In diesem Artikel untersuchen wir, wie Sie die WooCommerce REST API verwenden und HTTP-Anfragen an WooCommerce senden.

Wenn Sie Ihren eigenen Shop aufbauen möchten, können Sie WooCommerce als Backend verwenden, um Ihre Produkte, Produktbilder, Galerie usw. zu verwalten. Und dann mit der REST-API die Produktdaten abrufen und in Ihrer externen Anwendung anzeigen. WooCommerce bietet eine REST-API-Dokumentation für die Interaktion mit dem Backend. Hier erhalten Sie die Details zu Produkten, Kunden, Bestellungen, Steuern usw. In diesem Artikel werden wir mit den Produktendpunkten interagieren. Auf ähnliche Weise können Sie weitere Optionen wie Kunden, Bestellungen usw. integrieren.

Holen Sie sich Ihren Verbraucherschlüssel und Ihr Verbrauchergeheimnis

Um mit der WooCommerce REST API zu beginnen, müssen Sie zuerst Ihren Verbraucherschlüssel und Ihr Verbrauchergeheimnis abrufen. Diese Schlüssel sind die Identifikation für den Shop und sind notwendig, während ein API-Aufruf an WooCommerce gesendet wird.

Sie müssen WooCommerce auf Ihrem WordPress-Backend installieren. Gehen Sie dann zur WooCommerce->Settings- Seite. Klicken Sie auf die Registerkarte Erweitert und dann auf den REST-API-Link.

Klicken Sie auf dieser Seite auf die Schaltfläche ‘API-Schlüssel erstellen’.

Geben Sie die Beschreibung ein, wählen Sie die Berechtigungen "Lesen/Schreiben" und klicken Sie auf die Schaltfläche API-Schlüssel generieren. Sie können auch die Leseberechtigung auswählen. Es hängt von Ihrer Anforderung ab. Wenn Sie nur Daten aus WooCommerce lesen müssen, wählen Sie die Option "Lesen". Und wenn Sie sowohl Lese- als auch Schreiboperationen durchführen möchten, dann wäre Ihre Option ‘Lesen/Schreiben’.

Kopieren Sie Ihren Consumer-Key und das Consumer-Secret, das beim Ausführen von API-Aufrufen erforderlich ist.

Interagieren Sie mit der WooCommerce REST API

Sobald Sie mit Ihrem Verbraucherschlüssel und Verbrauchergeheimnis fertig sind, können wir mit dem Code beginnen, der mit WooCommerce interagiert. Da wir HTTP-Anfragen senden müssen, installieren Sie die Guzzle-Bibliothek mit dem folgenden Befehl.

composer require guzzlehttp/guzzle

Guzzle ist ein PHP-HTTP-Client, der das Senden von HTTP-Anforderungen und die Integration in Webdienste einfach macht.

Nehmen wir nun einige Endpunkte wie alle Produkte abrufen, ein einzelnes Produkt abrufen, ein Produkt aktualisieren und integrieren.

Produkte erhalten

Beim Aufrufen der WooCommerce-API-Endpunkte müssen Sie den Authorization-Header festlegen, der eine Base64-codierte Zeichenfolge Ihres Verbraucherschlüssels und Verbrauchergeheimnisses ist.

<?php
require_once "vendor/autoload.php";
  
use GuzzleHttpClient;
 
define('WC_CONSUMER_KEY', 'PASTE_CONSUMER_KEY');
define('WC_CONSUMER_SECRET', 'PASTE_CONSUMER_SECRET');
  
$client = new Client([
    // Base URI is used with relative requests
    'base_uri' => 'YOUR_DOMAIN_BASE_URL',
]);
 
try {
    $response = $client->request('GET', '/wp-json/wc/v3/products', [
        'headers' => [
            "Authorization" => "Basic ". base64_encode(WC_CONSUMER_KEY.':'.WC_CONSUMER_SECRET)
        ],
        'query' => [
            'per_page' => 18,
        ],
        'verify' => false, //only needed if you are facing SSL certificate issue
    ]);
     
    $body = $response->getBody();
    $arr_body = json_decode($body);
    print_r($arr_body);
} catch (Exception $e) {
    echo $e->getMessage();
}

Im obigen Code habe ich den Endpunkt aufgerufen, der eine Liste von Produkten angibt. Hier habe ich 18 als ‘per_page’-Wert übergeben, der als Antwort 18 Produktdaten liefert. Sie können diesen Wert gemäß Ihren Anforderungen übergeben. Stellen Sie sicher, dass Sie die Platzhalter durch die tatsächlichen Werte ersetzen, bevor Sie den Endpunkt erreichen.

Holen Sie sich ein einzelnes Produkt

Wenn Sie die Daten eines einzelnen Produkts abrufen möchten, sieht Ihr Endpunkt wie folgt aus.

$response = $client->request('GET', '/wp-json/wc/v3/products/PRODUCT_ID_HERE', [
    'headers' => [
        "Authorization" => "Basic ". base64_encode(WC_CONSUMER_KEY.':'.WC_CONSUMER_SECRET)
    ],
    'verify' => false,
]);

Aktualisieren eines Produkts

Sie können ein Produkt aktualisieren, indem Sie eine PUT-Anfrage an den API-Endpunkt senden. Angenommen, Sie möchten einen regulären_Preis Ihres Produkts aktualisieren.

$response = $client->request('PUT', '/wp-json/wc/v3/products/PRODUCT_ID_HERE', [
    'headers' => [
        "Authorization" => "Basic ". base64_encode(WC_CONSUMER_KEY.':'.WC_CONSUMER_SECRET)
    ],
    'json' => [
        'regular_price' => '12.20',
    ],
    'verify' => false,
]);

Dies sind einige grundlegende Anrufe. Auf die gleiche Weise kann der Benutzer HTTP-Anfragen für Kunden, Bestellungen, Coupons usw. senden. Weitere Informationen dazu finden Sie in der offiziellen Dokumentation.

Interagieren Sie mit der WooCommerce REST API mit JavaScript using

WooCommerce veröffentlicht eine eigene JavaScript-Bibliothek, die nützlich ist, um API-Aufrufe aus dem JavaScript-Framework an WooCommerce zu senden. Angenommen, Sie möchten von Ihrer React-basierten Anwendung aus mit der REST-API interagieren.

Installieren Sie in diesem Fall die Bibliothek ‘@woocommerce/woocommerce-rest-api’ mit dem Befehl:

npm install --save @woocommerce/woocommerce-rest-api

Als nächstes können Sie in Ihrer React-Komponente die Liste der Produkte mit dem folgenden Code abrufen.

import React from 'react';
import ReactDOM from 'react-dom';
import WooCommerceRestApi from "@woocommerce/woocommerce-rest-api";
 
class ProductsComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      products: []
    };
  }
 
  componentDidMount() {
    const api = new WooCommerceRestApi({
      url: "YOUR_DOMAIN_BASE_URL",
      consumerKey: "PASTE_CONSUMER_KEY",
      consumerSecret: "PASTE_CONSUMER_SECRET",
      version: "wc/v3"
    });
 
    // List products
    api.get("products", {
      per_page: 18, // 18 products per page
    })
      .then((response) => {
        // Successful request
        this.setState({
          products: response.data
        });
      })
      .catch((error) => {
        // Invalid request, for 4xx and 5xx statuses
      })
      .finally(() => {
        // Always executed.
      });
  }
 
  render() {
    return (      <div>
        <h2>Products</h2>
        <ul>
        {this.state.products.map(product => (          <li key={product.id}>{product.name} - ${product.regular_price}</li>
        ))}
        </ul>
      </div>
    );
  }
}
 
const element = <ProductsComponent></ProductsComponent>
 
ReactDOM.render(element, document.getElementById("root"));

Hier drucke ich die Liste der Produktnamen und des Produktpreises. Der Benutzer kann auch andere Daten drucken. Wenn Sie alle Daten in der Konsole sehen möchten, protokollieren Sie die response.data in der Erfolgsmethode. Genau wie im obigen Beispiel können Sie andere HTTP-Anfragen von Ihrer React-Anwendung senden.

Fazit

In diesem Tutorial lernen wir das Aufrufen der WooCommerce REST API mit PHP und JavaScript. Wir sind die wenigen API-Endpunkte von WooCommerce durchgegangen. Der Benutzer kann mit dem anderen Endpunkt spielen, indem er der Dokumentation folgt und die erforderlichen HTTP-Anforderungen sendet.