{"id":28207,"date":"2021-05-19T12:20:00","date_gmt":"2021-05-19T09:20:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=28207"},"modified":"2021-10-17T04:48:57","modified_gmt":"2021-10-17T01:48:57","slug":"en-snabbguide-om-rest-api-for-woocommerce","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/sv\/en-snabbguide-om-rest-api-for-woocommerce\/","title":{"rendered":"En snabbguide om REST API f\u00f6r WooCommerce"},"content":{"rendered":"<p>Vill du interagera med WooCommerce REST API? WooCommerce tillhandah\u00e5ller ett REST API som ger dig realtidsdata fr\u00e5n backend som kan placeras var som helst i din externa applikation. Genom sitt REST API kan man hantera deras WooCommerce-data genom att tr\u00e4ffa slutpunkterna. I den h\u00e4r artikeln studerar vi hur man anv\u00e4nder WooCommerce REST API och skickar HTTP-f\u00f6rfr\u00e5gningar till WooCommerce.<\/p>\n<p>Om du vill bygga din egen butik kan du anv\u00e4nda WooCommerce som backend f\u00f6r att hantera dina produkter, produktbilder, galleri etc. Och sedan anv\u00e4nda REST API, h\u00e4mta produktdata och visa den i din externa applikation. WooCommerce tillhandah\u00e5ller en <a href=\"https:\/\/woocommerce.github.io\/woocommerce-rest-api-docs\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">REST API-dokumentation<\/a> f\u00f6r interaktion med backend. H\u00e4r f\u00e5r du information om allt som produkter, kunder, best\u00e4llningar, skatter etc. I den h\u00e4r artikeln kommer vi att interagera med produktens slutpunkter. P\u00e5 liknande s\u00e4tt kan du integrera andra alternativ som kunder, best\u00e4llningar etc.<\/p>\n<h3>F\u00e5 din konsumentnyckel och konsumenthemlighet<\/h3>\n<p>F\u00f6r att komma ig\u00e5ng med WooCommerce REST API m\u00e5ste du f\u00f6rst h\u00e4mta din konsumentnyckel och konsumenthemlighet. Dessa nycklar \u00e4r identifikationen f\u00f6r butiken och n\u00f6dv\u00e4ndiga samtidigt som du ger ett API-samtal till WooCommerce.<\/p>\n<p>Du m\u00e5ste installera WooCommerce p\u00e5 din WordPress-backend. <strong>G\u00e5<\/strong> sedan \u00f6ver till sidan <strong>WooCommerce-&gt; Inst\u00e4llningar<\/strong>. Klicka p\u00e5 fliken Avancerat och sedan p\u00e5 REST API-l\u00e4nken.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20552-6082042fde2a8.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20552-6082042fde2a8.png\" alt=\"En snabbguide om REST API f\u00f6r WooCommerce\" ><\/a><\/p>\n<p>Klicka p\u00e5 knappen &quot;Skapa en API-nyckel&quot; p\u00e5 den h\u00e4r sidan.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20552-60820430658a2.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20552-60820430658a2.png\" alt=\"En snabbguide om REST API f\u00f6r WooCommerce\" ><\/a><\/p>\n<p>Ange beskrivningen, v\u00e4lj &quot;L\u00e4s \/ skriv&quot; -beh\u00f6righeter och tryck p\u00e5 knappen Skapa API-nyckel. Du kan ocks\u00e5 v\u00e4lja L\u00e4sbeh\u00f6righet. Det beror p\u00e5 ditt krav. Om du bara beh\u00f6ver l\u00e4sa data fr\u00e5n WooCommerce v\u00e4ljer du alternativet &quot;L\u00e4s&quot;. Och om du vill g\u00f6ra b\u00e5de l\u00e4s- och skrivoperationer skulle ditt alternativ vara &quot;L\u00e4s \/ skriv&quot;.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20552-60820430e1fa8.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20552-60820430e1fa8.png\" alt=\"En snabbguide om REST API f\u00f6r WooCommerce\" ><\/a><\/p>\n<p>Kopiera din konsumentnyckel och konsumenthemlighet som kr\u00e4vs n\u00e4r du ger API-samtal.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20552-60820430e1fa8.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20552-60820430e1fa8.png\" alt=\"En snabbguide om REST API f\u00f6r WooCommerce\" ><\/a><\/p>\n<h3>Interagera med WOOCommerce REST API<\/h3>\n<p>N\u00e4r du \u00e4r redo med din konsumentnyckel och konsumenthemlighet kan vi b\u00f6rja med koden som interagerar med WooCommerce. Eftersom vi beh\u00f6ver skicka HTTP-f\u00f6rfr\u00e5gningar, installera Guzzle-biblioteket med kommandot nedan.<\/p>\n<pre><code>composer require guzzlehttp\/guzzle<\/code><\/pre>\n<p><a href=\"https:\/\/artisansweb.net\/use-guzzle-php-http-client-sending-http-requests\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external\"><\/a>Guzzle \u00e4r en PHP HTTP-klient som g\u00f6r det enkelt att skicka HTTP-f\u00f6rfr\u00e5gningar och trivialt att integrera med webbtj\u00e4nster.<\/p>\n<p>L\u00e5t oss nu ta n\u00e5gra slutpunkter som att h\u00e4mta alla produkter, skaffa en enda produkt, uppdatera en produkt och integrera den.<\/p>\n<h4>Skaffa produkter<\/h4>\n<p>N\u00e4r du ringer till WooCommerce API-slutpunkter m\u00e5ste du st\u00e4lla in auktoriseringshuvud som \u00e4r en bas64-kodad str\u00e4ng av din konsumentnyckel och konsumenthemlighet.<\/p>\n<pre><code>&lt;?php\nrequire_once \"vendor\/autoload.php\";\n\u00a0\u00a0\nuse GuzzleHttpClient;\n\u00a0\ndefine('WC_CONSUMER_KEY', 'PASTE_CONSUMER_KEY');\ndefine('WC_CONSUMER_SECRET', 'PASTE_CONSUMER_SECRET');\n\u00a0\u00a0\n$client = new Client([\n\u00a0\u00a0\u00a0\u00a0\/\/ Base URI is used with relative requests\n\u00a0\u00a0\u00a0\u00a0'base_uri' =&gt; 'YOUR_DOMAIN_BASE_URL',\n]);\n\u00a0\ntry {\n\u00a0\u00a0\u00a0\u00a0$response = $client-&gt;request('GET', '\/wp-json\/wc\/v3\/products', [\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'headers' =&gt; [\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\"Authorization\" =&gt; \"Basic \". base64_encode(WC_CONSUMER_KEY.':'.WC_CONSUMER_SECRET)\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0],\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'query' =&gt; [\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'per_page' =&gt; 18,\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0],\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'verify' =&gt; false, \/\/only needed if you are facing SSL certificate issue\n\u00a0\u00a0\u00a0\u00a0]);\n\u00a0\u00a0\u00a0\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0$body = $response-&gt;getBody();\n\u00a0\u00a0\u00a0\u00a0$arr_body = json_decode($body);\n\u00a0\u00a0\u00a0\u00a0print_r($arr_body);\n} catch (Exception $e) {\n\u00a0\u00a0\u00a0\u00a0echo $e-&gt;getMessage();\n}<\/code><\/pre>\n<p>I ovanst\u00e5ende kod har jag ringt slutpunkten som ger en produktlista. H\u00e4r har jag klarat 18 som ett &quot;per_page&quot; -v\u00e4rde som ger 18 produktdata som svar. Du kan skicka detta v\u00e4rde enligt dina krav. Se till att ers\u00e4tta platsh\u00e5llarna med de faktiska v\u00e4rdena innan du n\u00e5r slutpunkten.<\/p>\n<h4>Skaffa en enda produkt<\/h4>\n<p>Om du vill h\u00e4mta en enskild produkts data blir din slutpunkt f\u00f6ljande.<\/p>\n<pre><code>$response = $client-&gt;request('GET', '\/wp-json\/wc\/v3\/products\/PRODUCT_ID_HERE', [\n\u00a0\u00a0\u00a0\u00a0'headers' =&gt; [\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\"Authorization\" =&gt; \"Basic \". base64_encode(WC_CONSUMER_KEY.':'.WC_CONSUMER_SECRET)\n\u00a0\u00a0\u00a0\u00a0],\n\u00a0\u00a0\u00a0\u00a0'verify' =&gt; false,\n]);<\/code><\/pre>\n<h4>Uppdatera en produkt<\/h4>\n<p>Du kan uppdatera en produkt genom att skicka en PUT-beg\u00e4ran till API-slutpunkten. L\u00e5t oss s\u00e4ga att du vill uppdatera en vanlig pris p\u00e5 din produkt.<\/p>\n<pre><code>$response = $client-&gt;request('PUT', '\/wp-json\/wc\/v3\/products\/PRODUCT_ID_HERE', [\n\u00a0\u00a0\u00a0\u00a0'headers' =&gt; [\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\"Authorization\" =&gt; \"Basic \". base64_encode(WC_CONSUMER_KEY.':'.WC_CONSUMER_SECRET)\n\u00a0\u00a0\u00a0\u00a0],\n\u00a0\u00a0\u00a0\u00a0'json' =&gt; [\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'regular_price' =&gt; '12.20',\n\u00a0\u00a0\u00a0\u00a0],\n\u00a0\u00a0\u00a0\u00a0'verify' =&gt; false,\n]);<\/code><\/pre>\n<p>Det h\u00e4r \u00e4r n\u00e5gra grundl\u00e4ggande samtal. P\u00e5 samma s\u00e4tt kan anv\u00e4ndaren skicka HTTP-beg\u00e4ran f\u00f6r kunder, best\u00e4llningar, kuponger etc. Du kan l\u00e4sa mer om det i deras <a href=\"https:\/\/woocommerce.github.io\/woocommerce-rest-api-docs\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">officiella dokumentation<\/a>.<\/p>\n<h3>Interagera med WooCommerce REST API med JavaScript<\/h3>\n<p>WooCommerce sl\u00e4pper sitt eget <a href=\"https:\/\/www.npmjs.com\/package\/@woocommerce\/woocommerce-rest-api\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">JavaScript-bibliotek,<\/a> vilket \u00e4r anv\u00e4ndbart f\u00f6r att skicka API-samtal till WooCommerce fr\u00e5n JavaScript-ramverk. L\u00e5t oss s\u00e4ga att du vill interagera med REST API fr\u00e5n din React-baserade applikation.<\/p>\n<p>Installera i s\u00e5 fall biblioteket &#8217;@ woocommerce \/ woocommerce-rest-api&#8217; med kommandot:<\/p>\n<pre><code>npm install --save @woocommerce\/woocommerce-rest-api<\/code><\/pre>\n<p>N\u00e4sta i din React-komponent kan du f\u00e5 en lista \u00f6ver produkter med hj\u00e4lp av nedanst\u00e5ende kod.<\/p>\n<pre><code>import React from 'react';\nimport ReactDOM from 'react-dom';\nimport WooCommerceRestApi from \"@woocommerce\/woocommerce-rest-api\";\n\u00a0\nclass ProductsComponent extends React.Component {\n\u00a0\u00a0constructor(props) {\n\u00a0\u00a0\u00a0\u00a0super(props);\n\u00a0\u00a0\u00a0\u00a0this.state = {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0products: []\n\u00a0\u00a0\u00a0\u00a0};\n\u00a0\u00a0}\n\u00a0\n\u00a0\u00a0componentDidMount() {\n\u00a0\u00a0\u00a0\u00a0const api = new WooCommerceRestApi({\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0url: \"YOUR_DOMAIN_BASE_URL\",\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0consumerKey: \"PASTE_CONSUMER_KEY\",\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0consumerSecret: \"PASTE_CONSUMER_SECRET\",\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0version: \"wc\/v3\"\n\u00a0\u00a0\u00a0\u00a0});\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\/\/ List products\n\u00a0\u00a0\u00a0\u00a0api.get(\"products\", {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0per_page: 18, \/\/ 18 products per page\n\u00a0\u00a0\u00a0\u00a0})\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0.then((response) =&gt; {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ Successful request\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0this.setState({\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0products: response.data\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0});\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0})\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0.catch((error) =&gt; {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ Invalid request, for 4xx and 5xx statuses\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0})\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0.finally(() =&gt; {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ Always executed.\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0});\n\u00a0\u00a0}\n\u00a0\n\u00a0\u00a0render() {\n\u00a0\u00a0\u00a0\u00a0return (\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;div&gt;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;h2&gt;Products&lt;\/h2&gt;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;ul&gt;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0{this.state.products.map(product =&gt; (\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;li key={product.id}&gt;{product.name} - ${product.regular_price}&lt;\/li&gt;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0))}\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;\/ul&gt;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;\/div&gt;\n\u00a0\u00a0\u00a0\u00a0);\n\u00a0\u00a0}\n}\n\u00a0\nconst element = &lt;ProductsComponent&gt;&lt;\/ProductsComponent&gt;\n\u00a0\nReactDOM.render(element, document.getElementById(\"root\"));<\/code><\/pre>\n<p>H\u00e4r skriver jag ut listan \u00f6ver produktnamn och produktpris. Anv\u00e4ndaren kan ocks\u00e5 skriva ut andra data. Om du vill se all data i konsolen loggar du respons.data i framg\u00e5ngsmetoden. Precis som ovanst\u00e5ende exempel kan du skicka andra HTTP-f\u00f6rfr\u00e5gningar fr\u00e5n din React-applikation.<\/p>\n<h3>Slutsats<\/h3>\n<p>I den h\u00e4r handledningen studerar vi hur man anropar WooCommerce REST API med PHP och JavaScript. Vi gick igenom n\u00e5gra f\u00e5 API-slutpunkter f\u00f6r WooCommerce. Anv\u00e4ndaren kan spela med den andra slutpunkten efter dokumentationen och skicka n\u00f6dv\u00e4ndiga HTTP-f\u00f6rfr\u00e5gningar.<\/p>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">Inspelningsk\u00e4lla:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/artisansweb.net\" class=\"external external_icon\">artisansweb.net<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Om du vill bygga en onlinebutik \u00e4r WooCommerce ett av de b\u00e4sta valen. Vi kan anv\u00e4nda WooCommerce REST API och bygga butik p\u00e5 vilket spr\u00e5k som helst.<\/p>\n","protected":false},"author":1,"featured_media":22224,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[318,503,279,614],"tags":[850],"class_list":["post-28207","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-databas","category-laravel2-10","category-php-10","category-uncategorized-10","tag-affiai-sv"],"_links":{"self":[{"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/posts\/28207","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/comments?post=28207"}],"version-history":[{"count":0,"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/posts\/28207\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/media\/22224"}],"wp:attachment":[{"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/media?parent=28207"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/categories?post=28207"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/tags?post=28207"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}