{"id":70740,"date":"2023-07-04T15:36:00","date_gmt":"2023-07-04T14:36:00","guid":{"rendered":"https:\/\/kinsta.com\/fr\/?p=70740&#038;preview=true&#038;preview_id=70740"},"modified":"2023-10-27T14:16:03","modified_gmt":"2023-10-27T13:16:03","slug":"cle-api-kinsta","status":"publish","type":"post","link":"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/","title":{"rendered":"Comment cr\u00e9er et utiliser la cl\u00e9 d&rsquo;acc\u00e8s \u00e0 l&rsquo;API Kinsta"},"content":{"rendered":"<p>Kinsta est une <a href=\"https:\/\/kinsta.com\/fr\/blog\/plateforme-cloud-pour-developpeurs\/\">plateforme cloud<\/a> con\u00e7ue pour aider les entreprises et les \u00e9quipes de d\u00e9veloppement \u00e0 livrer et \u00e0 g\u00e9rer leurs projets web plus rapidement et plus efficacement.<\/p>\n<p>Kinsta fournit aux <a href=\"https:\/\/kinsta.com\/fr\/blog\/types-de-developpeurs\/\">d\u00e9veloppeurs<\/a> et aux utilisateurs une <a href=\"https:\/\/kinsta.com\/fr\/blog\/rest-api-vs-web-api\/\">API<\/a> pour g\u00e9rer leurs <a href=\"https:\/\/kinsta.com\/fr\/hebergement-wordpress\/\">sites WordPress<\/a>, leurs <a href=\"https:\/\/sevalla.com\/application-hosting\/\">applications<\/a> et leurs <a href=\"https:\/\/sevalla.com\/database-hosting\/\">bases de donn\u00e9es<\/a> de mani\u00e8re programmatique.<\/p>\n<p>L&rsquo;<a href=\"https:\/\/kinsta.com\/fr\/docs\/api-kinsta\/\">API Kinsta<\/a> peut \u00eatre utilis\u00e9e pour automatiser des t\u00e2ches, r\u00e9cup\u00e9rer des donn\u00e9es et int\u00e9grer Kinsta \u00e0 d&rsquo;autres applications sans acc\u00e9der \u00e0 <a href=\"https:\/\/kinsta.com\/fr\/mykinsta\/\">MyKinsta<\/a>. Pour acc\u00e9der \u00e0 l&rsquo;API, vous avez besoin d&rsquo;une cl\u00e9 API. Cet article explique le processus de cr\u00e9ation et d&rsquo;utilisation d&rsquo;une cl\u00e9 API Kinsta.<\/p>\n<div><\/div><kinsta-auto-toc heading=\"Table of Contents\" exclude=\"last\" list-style=\"arrow\" selector=\"h2\" count-number=\"-1\"><\/kinsta-auto-toc>\n<h2>Comment cr\u00e9er une cl\u00e9 API<\/h2>\n<p>Pour utiliser l&rsquo;API de Kinsta, vous devez avoir un compte avec au moins un site, une application ou une base de donn\u00e9es WordPress dans MyKinsta. Vous devrez \u00e9galement g\u00e9n\u00e9rer une cl\u00e9 API pour vous authentifier et acc\u00e9der \u00e0 votre compte via l&rsquo;API. Pour g\u00e9n\u00e9rer une cl\u00e9 API :<\/p>\n<aside role=\"note\" class=\"wp-block-kinsta-notice is-style-info\">\n            <h3>Info<\/h3>\n        <p>Consid\u00e9rez votre cl\u00e9 API comme une information sensible et gardez-la en s\u00e9curit\u00e9. \u00c9vitez de partager la cl\u00e9 avec des personnes non autoris\u00e9es. Si vous travaillez sur un projet collaboratif, utilisez un <a href=\"https:\/\/kinsta.com\/fr\/blog\/gestionnaires-mots-passe\/\">gestionnaire de mots de passe<\/a> tel que 1Password pour la partager en toute s\u00e9curit\u00e9.<\/p>\n<\/aside>\n\n<ol start=\"1\">\n<li>Allez sur votre tableau de bord <a href=\"https:\/\/my.kinsta.com\/?lang=fr\">MyKinsta<\/a>.<\/li>\n<li>Naviguez jusqu&rsquo;\u00e0 la page des <strong>cl\u00e9s API <\/strong>(<strong>Votre nom<\/strong> &gt; R\u00e9glages<strong> de l&rsquo;entreprise<\/strong> &gt; <strong>Cl\u00e9s API<\/strong>).<\/li>\n<li>Cliquez sur <strong>Cr\u00e9er une cl\u00e9 API<\/strong>.<\/li>\n<li>Choisissez une date d&rsquo;expiration ou d\u00e9finissez une date de d\u00e9but personnalis\u00e9e et un nombre d&rsquo;heures pour l&rsquo;expiration de la cl\u00e9.<\/li>\n<li>Donnez un nom unique \u00e0 la cl\u00e9.<\/li>\n<li>Cliquez sur <strong>G\u00e9n\u00e9rer<\/strong>.<\/li>\n<\/ol>\n<figure style=\"width: 1600px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2023\/06\/create-api-keys.jpg\" alt=\"Cr\u00e9ez une cl\u00e9 API sur MyKinsta.\" width=\"1600\" height=\"225\"><figcaption class=\"wp-caption-text\">Cr\u00e9ez une cl\u00e9 API sur MyKinsta.<\/figcaption><\/figure>\n<p>Lorsque vous cr\u00e9ez une cl\u00e9 API, copiez-la et conservez-la dans un endroit s\u00fbr, car c&rsquo;est la <strong>seule fois o\u00f9 vous pourrez la voir<\/strong>. Vous pouvez g\u00e9n\u00e9rer plusieurs cl\u00e9s API &#8211; elles seront list\u00e9es sur la page <strong>Cl\u00e9s API<\/strong>. Si vous devez r\u00e9voquer une cl\u00e9 API, cliquez sur <strong>R\u00e9voquer<\/strong> \u00e0 c\u00f4t\u00e9 de celle que vous souhaitez r\u00e9voquer.<\/p>\n<h2>Comment utiliser l&rsquo;API Kinsta avec votre cl\u00e9 API<\/h2>\n<p>Une fois que vous avez la cl\u00e9 API, vous pouvez interagir avec tous les services de Kinsta (sites WordPress, applications et bases de donn\u00e9es) via l&rsquo;<a href=\"https:\/\/kinsta.com\/fr\/changelog\/api-kinsta\/\">API Kinsta<\/a>, comme obtenir une <a href=\"https:\/\/api-docs.kinsta.com\/tag\/Databases#paths\/~1databases\/get\" target=\"_blank\" rel=\"noopener noreferrer\">liste de bases de donn\u00e9es par identifiant d&rsquo;entreprise<\/a>, des <a href=\"https:\/\/api-docs.kinsta.com\/tag\/WordPress-Sites#paths\/~1sites\/get\" target=\"_blank\" rel=\"noopener noreferrer\">sites d&rsquo;entreprise<\/a>, cr\u00e9er un site WordPress, et plus encore.<\/p>\n<aside role=\"note\" class=\"wp-block-kinsta-notice is-style-info\">\n            <h3>Info<\/h3>\n        <p>Il existe \u00e9galement un point de terminaison d\u00e9di\u00e9 pour chaque appel \u00e0 l&rsquo;API ; certains param\u00e8tres sont \u00e9galement bien document\u00e9s pour vous aider \u00e0 savoir comment effectuer ces appels.<\/p>\n<\/aside>\n\n<p>Par exemple, pour obtenir une liste des sites d&rsquo;entreprise dans votre MyKinsta, le point de terminaison est <code>\/sites<\/code>. La cl\u00e9 API servira d&rsquo;en-t\u00eate d&rsquo;autorisation ; vous ajouterez \u00e9galement l&rsquo;identifiant de l&rsquo;entreprise (param\u00e8tre obligatoire). Voici comment effectuer cette requ\u00eate API \u00e0 l&rsquo;aide de cURL :<\/p>\n<pre><code class=\"language-bash\">curl -i -X GET \n  'https:\/\/api.kinsta.com\/v2\/sites?company=' \n  -H 'Authorization: Bearer &lt;YOUR_API_KEY_HERE&gt;'<\/code><\/pre>\n<p>Remplacez <code>YOUR_API_KEY_HERE<\/code> par la cl\u00e9 API que vous avez g\u00e9n\u00e9r\u00e9e et <code>COMPANY_ID_HERE<\/code> par l&rsquo;identifiant unique de votre entreprise. Vous obtiendrez une r\u00e9ponse JSON de tous les sites d&rsquo;entreprise dans votre tableau de bord DevKinsta :<\/p>\n<pre><code class=\"language-json\">{\n    \"company\": {\n        \"sites\": [\n            {\n                \"id\": \"YOUR_SITE_ID\",\n                \"name\": \"my-test-site\",\n                \"display_name\": \"Test site\",\n                \"status\": \"live\",\n                \"site_labels\": []\n            }\n        ]\n    }\n}<\/code><\/pre>\n<p>Autre exemple, supposons que vous souhaitiez r\u00e9cup\u00e9rer un site sp\u00e9cifique par ID (requ\u00eate GET). Vous pouvez utiliser le point de terminaison <code>\/sites\/{site_id}<\/code>. <code>{site_id}<\/code> sera remplac\u00e9 par l&rsquo;identifiant unique du site sp\u00e9cifique que vous souhaitez r\u00e9cup\u00e9rer. Voici comment effectuer cette requ\u00eate API \u00e0 l&rsquo;aide de NodeJS :<\/p>\n<pre><code class=\"language-js\">import fetch from 'node-fetch';\n\nasync function fetchSite() {\n  const siteId = 'YOUR_SITE_ID';\n  const response = await fetch(\n    `https:\/\/api.kinsta.com\/v2\/sites\/${siteId}`,\n    {\n      method: 'GET',\n      headers: {\n        Authorization: 'Bearer \n      }\n    }\n  );\n\n  const data = await response.json();\n  console.log(data);\n}\n\nfetchSite();<\/code><\/pre>\n<aside role=\"note\" class=\"wp-block-kinsta-notice is-style-info\">\n            <h3>Info<\/h3>\n        <p>L&rsquo;API a une <a href=\"https:\/\/kinsta.com\/fr\/docs\/api-kinsta\/#rate-limit\">limite<\/a> de 60 requ\u00eates par minute, avec une exception pour la cr\u00e9ation de site, qui est limit\u00e9e \u00e0 5 requ\u00eates par minute. Vous pouvez consulter les en-t\u00eates RateLimit dans la derni\u00e8re r\u00e9ponse de l&rsquo;API pour conna\u00eetre l&rsquo;<a href=\"https:\/\/kinsta.com\/fr\/blog\/limitation-debit-api\/\">\u00e9tat de votre limite<\/a> actuelle. Actuellement, il n&rsquo;est pas possible d&rsquo;augmenter la limite de taux.<\/p>\n<\/aside>\n\n<p>Les possibilit\u00e9s offertes par l&rsquo;API de Kinsta ne s&rsquo;arr\u00eatent pas l\u00e0. Pour plus de d\u00e9tails sur les points de terminaison de l&rsquo;API disponibles et les param\u00e8tres n\u00e9cessaires, pour t\u00e9l\u00e9charger notre sp\u00e9cification OpenAPI, et pour essayer les points de terminaison, consultez notre <a href=\"https:\/\/api-docs.kinsta.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">R\u00e9f\u00e9rence API<\/a>.<\/p>\n<h3>Autorisations<\/h3>\n<p>Les autorisations d&rsquo;acc\u00e8s \u00e0 l&rsquo;API de Kinsta d\u00e9pendent du <a href=\"https:\/\/kinsta.com\/fr\/docs\/reglages-entreprise\/gestion-utilisateur\/#user-roles\">r\u00f4le de l&rsquo;utilisateur<\/a> au sein de l&rsquo;entreprise. Les <strong>propri\u00e9taires, les administrateurs et les d\u00e9veloppeurs de l&rsquo;entreprise<\/strong> peuvent cr\u00e9er des cl\u00e9s d&rsquo;API.<\/p>\n<p>Par exemple, une cl\u00e9 API g\u00e9n\u00e9r\u00e9e par un d\u00e9veloppeur n&rsquo;aura pas le m\u00eame niveau d&rsquo;acc\u00e8s qu&rsquo;une cl\u00e9 g\u00e9n\u00e9r\u00e9e par un propri\u00e9taire ou un administrateur de l&rsquo;entreprise. Les autorisations sp\u00e9cifiques associ\u00e9es \u00e0 chaque r\u00f4le d&rsquo;utilisateur garantissent un contr\u00f4le d&rsquo;acc\u00e8s et une s\u00e9curit\u00e9 appropri\u00e9s pour l&rsquo;API de Kinsta.<\/p>\n<h2>Comment utiliser l&rsquo;API Kinsta pour cr\u00e9er un v\u00e9rificateur d&rsquo;\u00e9tat<\/h2>\n<p>Lorsque vous cr\u00e9ez une application, un site ou une base de donn\u00e9es sur MyKinsta, elle passe par diff\u00e9rentes \u00e9tapes. Ces \u00e9tapes sont identifi\u00e9es par leur \u00e9tat. Par exemple, une application d\u00e9ploy\u00e9e sur Kinsta aura un \u00e9tat de d\u00e9ploiement, de d\u00e9ploiement r\u00e9ussi ou d&rsquo;\u00e9chec.<\/p>\n<p>L&rsquo;API Kinsta fournit des <a href=\"https:\/\/kinsta.com\/fr\/blog\/api-endpoint\/\">points de terminaison<\/a> qui vous permettent de r\u00e9cup\u00e9rer des informations sur l&rsquo;\u00e9tat de vos projets sur <a href=\"https:\/\/my.kinsta.com\/?lang=fr\">MyKinsta<\/a>. Pour ce projet, vous interagirez avec trois points de terminaison, \u00e0 savoir les points de terminaison <code><a href=\"https:\/\/api-docs.kinsta.com\/tag\/Applications#paths\/~1applications\/get\">\/applications<\/a><\/code>, <code><a href=\"https:\/\/api-docs.kinsta.com\/tag\/WordPress-Sites#paths\/~1sites\/get\">\/sites<\/a><\/code>, et <code><a href=\"https:\/\/api-docs.kinsta.com\/tag\/Databases#paths\/~1databases\/get\">\/databases<\/a><\/code>pour r\u00e9cup\u00e9rer un tableau de toutes les applications, sites et bases de donn\u00e9es \u00e0 l&rsquo;aide de l&rsquo;<a href=\"https:\/\/kinsta.com\/fr\/blog\/requetes-http-javascript\/#4-how-to-make-an-http-request-in-javascript-using-the-fetch-api\">API JavaScript Fetch<\/a>.<\/p>\n<p>Une fois la liste r\u00e9cup\u00e9r\u00e9e, vous pouvez utiliser la m\u00e9thode <code>find()<\/code> en JavaScript pour rechercher un nom de projet sp\u00e9cifique saisi dans l&rsquo;interface utilisateur (UI). Cette m\u00e9thode renvoie le nom et l&rsquo;\u00e9tat du projet s&rsquo;il existe.<\/p>\n<figure style=\"width: 1600px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2023\/06\/status-checker-web-interface.jpg\" alt=\"Application web de v\u00e9rification de l'\u00e9tat du projet.\" width=\"1600\" height=\"225\"><figcaption class=\"wp-caption-text\">Application web de v\u00e9rification de l&rsquo;\u00e9tat du projet.<\/figcaption><\/figure>\n<h3>Pr\u00e9-requis<\/h3>\n<p>Pour suivre ce projet, il est conseill\u00e9 d&rsquo;avoir une compr\u00e9hension de base de <a href=\"https:\/\/kinsta.com\/fr\/blog\/qu-est-ce-que-le-html\/\">HTML<\/a>, <a href=\"https:\/\/kinsta.com\/fr\/blog\/meilleurs-pratiques-css\/\">CSS<\/a> et <a href=\"https:\/\/kinsta.com\/javascript\/\">JavaScript<\/a> et une certaine familiarit\u00e9 avec <a href=\"https:\/\/kinsta.com\/fr\/blog\/qu-est-react-js\/\">React<\/a>. L&rsquo;objectif principal de ce projet est de d\u00e9montrer l&rsquo;utilisation de l&rsquo;API Kinsta, l&rsquo;article n&rsquo;entrera donc pas dans les d\u00e9tails de la cr\u00e9ation ou du style de l&rsquo;interface utilisateur.<\/p>\n<p>Vous pouvez cr\u00e9er un d\u00e9p\u00f4t Git en utilisant ce <a href=\"https:\/\/github.com\/kinsta\/status-checker\" target=\"_blank\" rel=\"noopener noreferrer\">mod\u00e8le sur GitHub<\/a>. S\u00e9lectionnez <strong>Utiliser ce mod\u00e8le<\/strong> &gt; <strong>Cr\u00e9er un nouveau d\u00e9p\u00f4t<\/strong> pour copier le code de d\u00e9marrage dans un nouveau d\u00e9p\u00f4t au sein de votre propre compte GitHub, et assurez-vous de cocher la case pour <strong>inclure toutes les branches<\/strong>. Lorsque vous vous rendez sur votre ordinateur local, assurez-vous de basculer vers l&rsquo;option <strong><a href=\"https:\/\/github.com\/kinsta\/status-checker\/tree\/status-checker-ui\" target=\"_blank\" rel=\"noopener noreferrer\">status-checker-ui<\/a><\/strong> pour utiliser les fichiers de d\u00e9marrage en utilisant la commande ci-dessous :<\/p>\n<pre><code class=\"language-bash\">git checkout status-checker-ui<\/code><\/pre>\n<p>Installez les d\u00e9pendances n\u00e9cessaires en ex\u00e9cutant la commande <code>npm install<\/code>. Une fois l&rsquo;installation termin\u00e9e, vous pouvez lancer le projet sur votre ordinateur local \u00e0 l&rsquo;aide de la commande <code>npm run start<\/code>. Le projet s&rsquo;ouvrira alors \u00e0 l&rsquo;adresse <strong>http:\/\/localhost:3000\/<\/strong>.<\/p>\n<figure style=\"width: 1600px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2023\/06\/status-checker-ui.jpg\" alt=\"V\u00e9rifiez l'\u00e9tat des projets avec MyKinsta.\" width=\"1600\" height=\"225\"><figcaption class=\"wp-caption-text\">V\u00e9rifiez l&rsquo;\u00e9tat des projets avec MyKinsta.<\/figcaption><\/figure>\n<p>Ce projet comporte deux pages principales : la page <strong>Home<\/strong> et <strong>Services page<\/strong>. La <strong>Home<\/strong> affiche une liste des services fournis par Kinsta (h\u00e9bergement de WordPress, d&rsquo;applications et de bases de donn\u00e9es). Lorsque vous cliquez sur l&rsquo;un des services, vous acc\u00e9dez \u00e0 <strong>Services page<\/strong>, qui est con\u00e7ue pour fournir des informations sp\u00e9cifiques relatives au service s\u00e9lectionn\u00e9.<\/p>\n<p>Par exemple, en cliquant sur la section \u00ab Applications \u00bb, vous serez redirig\u00e9 vers <strong>Services page<\/strong> consacr\u00e9e aux applications. Vous pouvez rechercher n&rsquo;importe quelle application de votre compte MyKinsta sur cette page, qui r\u00e9cup\u00e8re le statut de l&rsquo;application en utilisant son nom unique ou son nom d&rsquo;affichage.<\/p>\n<h3>Interagir avec l&rsquo;API Kinsta<\/h3>\n<p>Pour mettre en \u0153uvre la fonction de recherche de ce projet, vous devez cr\u00e9er trois fonctions pour g\u00e9rer les demandes de r\u00e9cup\u00e9ration pour chaque service (applications, sites et bases de donn\u00e9es). Ensuite, vous mettrez en \u0153uvre une fonctionnalit\u00e9 de recherche qui analyse l&rsquo;ensemble du tableau de donn\u00e9es pour v\u00e9rifier si une valeur de recherche donn\u00e9e existe.<\/p>\n<p>Vous avez besoin de l&rsquo;<strong>identifiant de votre entreprise<\/strong> et de la <strong>cl\u00e9 API<\/strong> pour interagir avec l&rsquo;API Kinsta afin de pouvoir r\u00e9cup\u00e9rer une liste de bases de donn\u00e9es, d&rsquo;applications et de sites disponibles dans votre compte MyKinsta. Une fois que vous les avez, stockez-les en tant que <a href=\"https:\/\/kinsta.com\/fr\/blog\/variables-environnement\/\">variables d&rsquo;environnement<\/a> dans votre application React en cr\u00e9ant un <strong> fichier .env<\/strong> dans le dossier racine de votre projet.<\/p>\n<pre><code class=\"language-bash\">REACT_APP_KINSTA_COMPANY_ID = 'YOUR_COMPANY_ID'\nREACT_APP_KINSTA_API_KEY = 'YOUR_API_KEY'<\/code><\/pre>\n<p>Vous pouvez maintenant acc\u00e9der \u00e0 ces valeurs n&rsquo;importe o\u00f9 dans votre projet en utilisant <code>process.env.THE_VARIABLE<\/code>. Par exemple, pour acc\u00e9der \u00e0 <code>REACT_APP_KINSTA_COMPANY_ID<\/code>, vous utilisez <code>process.env.REACT_APP_KINSTA_COMPANY_ID<\/code>.<\/p>\n<aside role=\"note\" class=\"wp-block-kinsta-notice is-style-\u201dinfo\u201d\">\n        <p>Assurez-vous d&rsquo;ajouter le <strong> fichier .env<\/strong> \u00e0 votre <strong><a href=\"https:\/\/kinsta.com\/fr\/blog\/gitignore-ne-fonctionne-pas\/\">fichier .gitignore<\/a><\/strong> afin qu&rsquo;il ne soit pas pouss\u00e9 vers GitHub, car il contient des informations qui ne devraient pas \u00eatre partag\u00e9es en ligne pour que tout le monde puisse les voir.<\/p>\n<\/aside>\n\n<p>Avant d&rsquo;utiliser l&rsquo;API, cr\u00e9ez trois \u00e9tats dans la page <strong>Service.jsx<\/strong> pour stocker l&rsquo;\u00e9tat et le nom de la sortie g\u00e9n\u00e9r\u00e9e lorsque vous recherchez un site, une application ou une base de donn\u00e9es. Le troisi\u00e8me \u00e9tat sert \u00e0 stocker les informations d&rsquo;erreur.<\/p>\n<pre><code class=\"language-jsx\">let [status, setStatus] = useState('');\nlet [name, setName] = useState('');\nlet [error, setError] = useState('');<\/code><\/pre>\n<p>Cr\u00e9ez \u00e9galement une variable pour stocker l&rsquo;URL de l&rsquo;API Kinsta :<\/p>\n<pre><code class=\"\u201dlanguage-js\u201d\">const KinstaAPIUrl = 'https:\/\/api.kinsta.com\/v2';<\/code><\/pre>\n<p>Une fois cela fait, attachez un \u00e9v\u00e9nement <code>onClick<\/code> avec une fonction <code>CheckQuery()<\/code> au bouton d&rsquo;envoi du formulaire sur la page <strong>Service.jsx<\/strong>, de sorte qu&rsquo;il d\u00e9clenche une fonction bas\u00e9e sur le mot-cl\u00e9. En d&rsquo;autres termes, si l&rsquo;intitul\u00e9 indique \u00ab database \u00bb, c&rsquo;est la fonction <code>CheckDatabases()<\/code> qui sera d\u00e9clench\u00e9e :<\/p>\n<pre><code class=\"language-jsx\">const CheckQuery = async (name) =&gt; {\n  if (slug === 'wp-site') {\n      await CheckSites(name);\n  } else if (slug === 'application') {\n      await CheckApplications(name);\n  } else if (slug === 'database') {\n      await CheckDatabases(name);\n  }\n}<\/code><\/pre>\n<h4>R\u00e9cup\u00e9rer une liste de sites avec l&rsquo;API Kinsta<\/h4>\n<p>Pour r\u00e9cup\u00e9rer la liste des sites disponibles sur votre compte MyKinsta avec l&rsquo;API Kinsta, vous allez cr\u00e9er une fonction, passer une requ\u00eate avec l&rsquo;identifiant de l&rsquo;entreprise comme param\u00e8tre, puis autoriser la requ\u00eate avec votre cl\u00e9 API. Cette requ\u00eate utilisera le point de terminaison <code>\/sites<\/code> de l&rsquo;API Kinsta :<\/p>\n<pre><code class=\"language-jsx\">const CheckSites = async (name) =&gt; {\n  const query = new URLSearchParams({\n      company: `${process.env.REACT_APP_KINSTA_COMPANY_ID}`,\n  }).toString();\n  const resp = await fetch(\n      `${KinstaAPIUrl}\/sites?${query}`,\n      {\n          method: 'GET',\n          headers: {\n              Authorization: `Bearer ${process.env.REACT_APP_KINSTA_API_KEY}`\n          }\n      }\n  );\n}<\/code><\/pre>\n<p>Le code ci-dessus r\u00e9cup\u00e8re tous les sites disponibles dans votre compte MyKinsta, vous pouvez maintenant utiliser la m\u00e9thode <code>find()<\/code> pour rechercher si la requ\u00eate correspond \u00e0 un <strong>nom<\/strong> ou \u00e0 un <strong>nom d&rsquo;affichage<\/strong>:<\/p>\n<pre><code class=\"language-jsx\">const data = await resp.json();\n  let sitesData = data.company.sites;\n  let site = sitesData.find(site =&gt; site.name === name || site.display_name === name);<\/code><\/pre>\n<p>Vous pouvez ensuite cr\u00e9er des conditions pour v\u00e9rifier si la m\u00e9thode renvoie une valeur, puis d\u00e9finir les \u00e9tats, sinon mettre \u00e0 jour l&rsquo;\u00e9tat d&rsquo;erreur avec un message pour informer l&rsquo;utilisateur que ce site n&rsquo;existe pas :<\/p>\n<pre><code class=\"language-jsx\">if (site) {\n    setName(site.display_name);\n    if (site.status === 'live') {\n        setStatus('\ud83d\udfe2 Running');\n    } else if (site.status === 'staging') {\n        setStatus('\ud83d\udfe1 Staging');\n    } else {\n        setStatus('\ud83d\udfe1 Unknown');\n    }\n    setUniqueName('');\n} else {\n    setError('No such site found for your account');\n    setUniqueName('');\n}<\/code><\/pre>\n<p>Lorsque vous r\u00e9unissez tous ces \u00e9l\u00e9ments, voici \u00e0 quoi ressemblera votre code pour v\u00e9rifier l&rsquo;\u00e9tat d&rsquo;un site particulier :<\/p>\n<pre><code class=\"language-jsx\">const CheckSites = async (name) =&gt; {\n  setName('');\n  setStatus('');\n  setError('');\n  const query = new URLSearchParams({\n      company: `${process.env.REACT_APP_KINSTA_COMPANY_ID}`,\n  }).toString();\n  const resp = await fetch(\n      `${KinstaAPIUrl}\/sites?${query}`,\n      {\n          method: 'GET',\n          headers: {\n              Authorization: `Bearer ${process.env.REACT_APP_KINSTA_API_KEY}`\n          }\n      }\n  );\n  const data = await resp.json();\n  let sitesData = data.company.sites;\n  let site = sitesData.find(site =&gt; site.name === name || site.display_name === name);\n  if (site) {\n      setName(site.display_name);\n      if (site.status === 'live') {\n          setStatus('\ud83d\udfe2 Running');\n      } else if (site.status === 'staging') {\n          setStatus('\ud83d\udfe1 Staging');\n      } else {\n          setStatus('\ud83d\udfe1 Unknown');\n      }\n      setUniqueName('');\n  } else {\n      setError('No such site found for your account');\n      setUniqueName('');\n  }\n}<\/code><\/pre>\n<p><strong>Remarque :<\/strong> les trois \u00e9tats sont initialis\u00e9s en tant que cha\u00eenes vides chaque fois que la fonction <code>CheckSites()<\/code> est d\u00e9clench\u00e9e. Cela est n\u00e9cessaire pour s&rsquo;assurer que toutes les donn\u00e9es de recherche ant\u00e9rieures sont effac\u00e9es.<\/p>\n<h4>R\u00e9cup\u00e9rer la liste des applications avec l&rsquo;API Kinsta<\/h4>\n<p>Comme vous l&rsquo;avez fait pour les sites, vous utiliserez le point de terminaison <code>\/applications<\/code>, transmettrez une requ\u00eate contenant l&rsquo;identifiant de l&rsquo;entreprise et utiliserez \u00e9galement la m\u00e9thode <code>find()<\/code> pour effectuer une recherche dans le tableau retourn\u00e9 :<\/p>\n<pre><code class=\"language-jsx\">const CheckApplications = async (name) =&gt; {\n  setName('');\n  setStatus('');\n  setError('');\n  const query = new URLSearchParams({\n      company: `${process.env.REACT_APP_KINSTA_COMPANY_ID}`,\n  }).toString();\n  const resp = await fetch(\n      `${KinstaAPIUrl}\/applications?${query}`,\n      {\n          method: 'GET',\n          headers: {\n              Authorization: `Bearer ${process.env.REACT_APP_KINSTA_API_KEY}`\n          }\n      }\n  );\n  const data = await resp.json();\n  let appsData = data.company.apps.items;\n  let app = appsData.find(app =&gt; app.unique_name === name || app.name === name || app.display_name === name);\n  if (app) {\n      setName(app.display_name);\n      if (app.status === 'deploymentSuccess') {\n          setStatus('\ud83d\udfe2 Running');\n      } else if (app.status === 'deploymentFailed') {\n          setStatus('\ud83d\udd34 Failed');\n      } else if (app.status === 'deploymentPending') {\n          setStatus('\ud83d\udfe1 Pending');\n      } else if (app.status === 'deploymentInProgress') {\n          setStatus('\ud83d\udfe1 In Progress');\n      } else {\n          setStatus('\ud83d\udfe1 Unknown');\n      }\n      setUniqueName('');\n  } else {\n      setError('No such app found for your account');\n      setUniqueName('');\n  }\n}<\/code><\/pre>\n<h4>R\u00e9cup\u00e9rer une liste de bases de donn\u00e9es avec l&rsquo;API Kinsta<\/h4>\n<p>Pour obtenir une liste de bases de donn\u00e9es, vous utiliserez le point de terminaison <code>\/databases<\/code> de l&rsquo;API Kinsta :<\/p>\n<pre><code class=\"language-jsx\">const CheckDatabases = async (name) =&gt; {\n  setName('');\n  setStatus('');\n  setError('');\n  const query = new URLSearchParams({\n      company: `${process.env.REACT_APP_KINSTA_COMPANY_ID}`,\n  }).toString();\n  const resp = await fetch(\n      `${KinstaAPIUrl}\/databases?${query}`,\n      {\n          method: 'GET',\n          headers: {\n              Authorization: `Bearer ${process.env.REACT_APP_KINSTA_API_KEY}`\n          }\n      }\n  );\n  const data = await resp.json();\n  let databasesData = data.company.databases.items;\n  let database = databasesData.find(database =&gt; database.name === name || database.display_name === name);\n  if (database) {\n      setName(database.display_name);\n      if (database.status === 'ready') {\n          setStatus('\ud83d\udfe2 Running');\n      } else if (database.status === 'creating') {\n          setStatus('\ud83d\udfe1 Creating');\n      } else {\n          setStatus('\ud83d\udfe1 Unknown');\n      }\n      setUniqueName('');\n  } else {\n      setError('No such database found for your account');\n      setUniqueName('');\n  }\n}<\/code><\/pre>\n<p>Une fois que c&rsquo;est fait. Vous avez utilis\u00e9 avec succ\u00e8s l&rsquo;API Kinsta dans votre projet React. Pour vous assurer que votre application fonctionne bien, ajoutez \u00e0 votre code de balisage les donn\u00e9es renvoy\u00e9es par ces fonctions, qui ont \u00e9t\u00e9 d\u00e9finies dans les \u00e9tats que nous avons cr\u00e9\u00e9s plus t\u00f4t :<\/p>\n<pre><code class=\"language-jsx\">{status !== '' && (\n  &lt;div className=\"services\"&gt;\n      &lt;div className=\"details\"&gt;\n          &lt;div className=\"name-details\"&gt;\n              &lt;span&gt; className=\"tag\"&gt;Name: &lt;\/span&gt;\n              &lt;span&gt; className=\"value\"&gt;{name}&lt;\/span&gt;\n          &lt;\/div&gt;\n          &lt;div className=\"status-details\"&gt;\n              &lt;span&gt; className=\"tag\"&gt;Status: &lt;\/span&gt;\n              &lt;span&gt; className=\"value\"&gt; {status}&lt;\/span&gt;\n          &lt;\/div&gt;\n      &lt;\/div&gt;\n  &lt;\/div&gt;\n)}<\/code><\/pre>\n<p>Ajoutez \u00e9galement une condition qui sera d\u00e9clench\u00e9e en cas d&rsquo;erreur. Par exemple, lorsqu&rsquo;un utilisateur recherche un projet qui n&rsquo;existe pas dans MyKinsta, l&rsquo;erreur est d\u00e9clench\u00e9e.<\/p>\n<pre><code class=\"language-jsx\">{error !== '' && (\n  &lt;div className=\"services\"&gt;\n      &lt;div className=\"details\"&gt;\n          &lt;p&gt;{error}&lt;\/p&gt;\n      &lt;\/div&gt;\n  &lt;\/div&gt;\n)}<\/code><\/pre>\n<p>A ce stade, votre projet fonctionne bien, et vous pouvez v\u00e9rifier l&rsquo;\u00e9tat des applications, sites ou bases de donn\u00e9es disponibles sur votre tableau de bord MyKinsta. Vous pouvez v\u00e9rifier votre code avec ce <a href=\"https:\/\/github.com\/kinsta\/status-checker\" target=\"_blank\" rel=\"noopener noreferrer\">d\u00e9p\u00f4t GitHub<\/a>.<\/p>\n<h3>Comment d\u00e9ployer votre v\u00e9rificateur d&rsquo;\u00e9tat sur Kinsta<\/h3>\n<p>Pour d\u00e9ployer votre projet React sur Kinsta, vous devez pousser le projet sur votre <a href=\"https:\/\/docs.sevalla.com\/applications\/get-started\/add-an-application#adding-an-application\">fournisseur Git pr\u00e9f\u00e9r\u00e9<\/a>. Lorsque votre projet est h\u00e9berg\u00e9 sur <a href=\"https:\/\/kinsta.com\/fr\/blog\/base-de-connaissances-github\/\">GitHub<\/a>, <a href=\"https:\/\/kinsta.com\/fr\/blog\/gitlab-vs-github\/\">GitLab<\/a> ou <a href=\"https:\/\/kinsta.com\/fr\/blog\/bitbucket-vs-github\/\">Bitbucket<\/a>, vous pouvez proc\u00e9der au d\u00e9ploiement vers Kinsta.<\/p>\n<p>Pour d\u00e9ployer votre d\u00e9p\u00f4t sur Kinsta, suivez les \u00e9tapes suivantes :<\/p>\n<ol start=\"1\">\n<li>Connectez-vous ou cr\u00e9ez votre compte Kinsta sur le tableau de bord <a href=\"https:\/\/my.kinsta.com\/?lang=fr\">MyKinsta<\/a>.<\/li>\n<li>Dans la colonne lat\u00e9rale de gauche, cliquez sur \u00ab Applications \u00bb, puis sur \u00ab Ajouter un service \u00bb.<\/li>\n<li>S\u00e9lectionnez \u00ab Application \u00bb dans le menu d\u00e9roulant pour d\u00e9ployer une application React sur Kinsta.<\/li>\n<li>Dans la fen\u00eatre modale qui s&rsquo;affiche, choisissez le d\u00e9p\u00f4t que vous souhaitez d\u00e9ployer. Si vous avez plusieurs branches, vous pouvez s\u00e9lectionner la branche souhait\u00e9e et donner un nom \u00e0 votre application.<\/li>\n<li>S\u00e9lectionnez l&rsquo;un des emplacements de centre de donn\u00e9es disponibles dans la liste des 25 options. Kinsta d\u00e9tectera automatiquement la commande de d\u00e9marrage de votre application.<\/li>\n<\/ol>\n<p>Enfin, il n&rsquo;est pas s\u00fbr d&rsquo;envoyer les cl\u00e9s d&rsquo;API \u00e0 des h\u00f4tes publics comme votre fournisseur Git. Lors de l&rsquo;h\u00e9bergement, vous pouvez les ajouter en tant que <a href=\"https:\/\/docs.sevalla.com\/applications\/environment-variables\">variables d&rsquo;environnement<\/a> en utilisant le m\u00eame nom de variable et la m\u00eame valeur que ceux sp\u00e9cifi\u00e9s dans le <strong> fichier .env.<\/strong><\/p>\n<figure style=\"width: 1600px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2023\/06\/set-environment-variable-devkinsta.jpg\" alt=\"D\u00e9finissez les variables d'environnement sur DevKinsta lors du d\u00e9ploiement.\" width=\"1600\" height=\"225\"><figcaption class=\"wp-caption-text\">D\u00e9finissez les variables d&rsquo;environnement sur DevKinsta lors du d\u00e9ploiement.<\/figcaption><\/figure>\n<p>Une fois que vous avez lanc\u00e9 le d\u00e9ploiement de votre application, le processus commence et se termine g\u00e9n\u00e9ralement en quelques minutes. Vous recevrez un lien pour acc\u00e9der \u00e0 la version d\u00e9ploy\u00e9e de votre application lorsque le d\u00e9ploiement aura r\u00e9ussi. Par exemple, dans ce cas, le lien est <strong>https:\/\/status-checker-1t256.kinsta.app\/<\/strong>.<\/p>\n<aside role=\"note\" class=\"wp-block-kinsta-notice is-style-info\">\n            <h3>Info<\/h3>\n        <p>Vous pouvez activer le d\u00e9ploiement automatique, de sorte que Kinsta red\u00e9ploie votre application chaque fois que vous modifiez votre base de code et que vous l&rsquo;envoyez sur GitHub.<\/p>\n<\/aside>\n\n<h2>R\u00e9sum\u00e9<\/h2>\n<p>La cl\u00e9 API de Kinsta vous permet d&rsquo;automatiser facilement des t\u00e2ches, de r\u00e9cup\u00e9rer des donn\u00e9es et d&rsquo;int\u00e9grer Kinsta \u00e0 d&rsquo;autres applications. N&rsquo;oubliez pas de conserver votre cl\u00e9 d&rsquo;acc\u00e8s en toute s\u00e9curit\u00e9.<\/p>\n<p>Vous pouvez d\u00e9sormais exploiter la puissance de l&rsquo;<a href=\"https:\/\/kinsta.com\/fr\/docs\/api-kinsta\/\">API Kinsta<\/a> pour cr\u00e9er des <a href=\"https:\/\/kinsta.com\/fr\/docs\/api-kinsta\/#reporting\">rapports<\/a>, <a href=\"https:\/\/kinsta.com\/fr\/docs\/api-kinsta\/#scheduled-tasks\">planifier des t\u00e2ches<\/a>, <a href=\"https:\/\/kinsta.com\/fr\/docs\/api-kinsta\/#wordpress-site-creation\">cr\u00e9er des sites WordPress<\/a> et automatiser diverses activit\u00e9s.<\/p>\n<p><em>Quel point de terminaison aimeriez-vous voir ajout\u00e9 \u00e0 l&rsquo;API de Kinsta ? <\/em><em>Faites-le nous savoir dans les commentaires.<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Kinsta est une plateforme cloud con\u00e7ue pour aider les entreprises et les \u00e9quipes de d\u00e9veloppement \u00e0 livrer et \u00e0 g\u00e9rer leurs projets web plus rapidement et &#8230;<\/p>\n","protected":false},"author":287,"featured_media":70741,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kinsta_gated_content":false,"_kinsta_gated_content_redirect":"","footnotes":""},"tags":[],"topic":[953,1020,1004,985],"class_list":["post-70740","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","topic-api","topic-outils-developpement-web","topic-react","topic-services-kinsta"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v24.6 (Yoast SEO v24.6) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Comment cr\u00e9er et utiliser la cl\u00e9 d&#039;acc\u00e8s \u00e0 l&#039;API de Kinsta - Kinsta\u00ae<\/title>\n<meta name=\"description\" content=\"Apprenez \u00e0 cr\u00e9er et \u00e0 utiliser sans effort votre cl\u00e9 d&#039;acc\u00e8s \u00e0 l&#039;API Kinsta pour une int\u00e9gration transparente et une gestion am\u00e9lior\u00e9e de votre site web.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Comment cr\u00e9er et utiliser la cl\u00e9 d&#039;acc\u00e8s \u00e0 l&#039;API Kinsta\" \/>\n<meta property=\"og:description\" content=\"Apprenez \u00e0 cr\u00e9er et \u00e0 utiliser sans effort votre cl\u00e9 d&#039;acc\u00e8s \u00e0 l&#039;API Kinsta pour une int\u00e9gration transparente et une gestion am\u00e9lior\u00e9e de votre site web.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/\" \/>\n<meta property=\"og:site_name\" content=\"Kinsta\u00ae\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/kinstafrance\/\" \/>\n<meta property=\"article:published_time\" content=\"2023-07-04T14:36:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-10-27T13:16:03+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/07\/kinsta-api-key.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1460\" \/>\n\t<meta property=\"og:image:height\" content=\"730\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Joel Olawanle\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:description\" content=\"Apprenez \u00e0 cr\u00e9er et \u00e0 utiliser sans effort votre cl\u00e9 d&#039;acc\u00e8s \u00e0 l&#039;API Kinsta pour une int\u00e9gration transparente et une gestion am\u00e9lior\u00e9e de votre site web.\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/07\/kinsta-api-key.jpg\" \/>\n<meta name=\"twitter:creator\" content=\"@olawanle_joel\" \/>\n<meta name=\"twitter:site\" content=\"@kinsta_fr\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"Joel Olawanle\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"13 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/\"},\"author\":{\"name\":\"Joel Olawanle\",\"@id\":\"https:\/\/kinsta.com\/fr\/#\/schema\/person\/efa7de30245ca15be5ce1dcacff89c07\"},\"headline\":\"Comment cr\u00e9er et utiliser la cl\u00e9 d&rsquo;acc\u00e8s \u00e0 l&rsquo;API Kinsta\",\"datePublished\":\"2023-07-04T14:36:00+00:00\",\"dateModified\":\"2023-10-27T13:16:03+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/\"},\"wordCount\":2556,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/fr\/#organization\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/07\/kinsta-api-key.jpg\",\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/\",\"url\":\"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/\",\"name\":\"Comment cr\u00e9er et utiliser la cl\u00e9 d'acc\u00e8s \u00e0 l'API de Kinsta - Kinsta\u00ae\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/fr\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/07\/kinsta-api-key.jpg\",\"datePublished\":\"2023-07-04T14:36:00+00:00\",\"dateModified\":\"2023-10-27T13:16:03+00:00\",\"description\":\"Apprenez \u00e0 cr\u00e9er et \u00e0 utiliser sans effort votre cl\u00e9 d'acc\u00e8s \u00e0 l'API Kinsta pour une int\u00e9gration transparente et une gestion am\u00e9lior\u00e9e de votre site web.\",\"breadcrumb\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/#primaryimage\",\"url\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/07\/kinsta-api-key.jpg\",\"contentUrl\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/07\/kinsta-api-key.jpg\",\"width\":1460,\"height\":730},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/kinsta.com\/fr\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"API\",\"item\":\"https:\/\/kinsta.com\/fr\/sujets\/api\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Comment cr\u00e9er et utiliser la cl\u00e9 d&rsquo;acc\u00e8s \u00e0 l&rsquo;API Kinsta\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/kinsta.com\/fr\/#website\",\"url\":\"https:\/\/kinsta.com\/fr\/\",\"name\":\"Kinsta\u00ae\",\"description\":\"Solutions d&#039;h\u00e9bergement premium, rapides et s\u00e9curis\u00e9es\",\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/fr\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/kinsta.com\/fr\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/kinsta.com\/fr\/#organization\",\"name\":\"Kinsta\",\"url\":\"https:\/\/kinsta.com\/fr\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/kinsta.com\/fr\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/12\/kinsta-logo.jpeg\",\"contentUrl\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/12\/kinsta-logo.jpeg\",\"width\":500,\"height\":500,\"caption\":\"Kinsta\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/fr\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/kinstafrance\/\",\"https:\/\/x.com\/kinsta_fr\",\"https:\/\/www.instagram.com\/kinstahosting\/\",\"https:\/\/www.linkedin.com\/company\/kinsta\/\",\"https:\/\/www.pinterest.com\/kinstahosting\/\",\"https:\/\/www.youtube.com\/c\/Kinsta\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/kinsta.com\/fr\/#\/schema\/person\/efa7de30245ca15be5ce1dcacff89c07\",\"name\":\"Joel Olawanle\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/kinsta.com\/fr\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/051bf577ce2c837846a1db9eef184758?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/051bf577ce2c837846a1db9eef184758?s=96&d=mm&r=g\",\"caption\":\"Joel Olawanle\"},\"description\":\"Joel is a Frontend developer working at Kinsta as a Technical Editor. He is a passionate teacher with love for open source and has written over 300 technical articles majorly around JavaScript and it's frameworks.\",\"sameAs\":[\"https:\/\/joelolawanle.com\/\",\"https:\/\/www.linkedin.com\/in\/olawanlejoel\/\",\"https:\/\/x.com\/olawanle_joel\",\"https:\/\/www.youtube.com\/@joelolawanle\"],\"gender\":\"male\",\"knowsAbout\":[\"JavaScript\",\"React\",\"Next.js\"],\"knowsLanguage\":[\"English\"],\"jobTitle\":\"Technical Editor\",\"worksFor\":\"Kinsta\",\"url\":\"https:\/\/kinsta.com\/fr\/blog\/author\/joelolawanle\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Comment cr\u00e9er et utiliser la cl\u00e9 d'acc\u00e8s \u00e0 l'API de Kinsta - Kinsta\u00ae","description":"Apprenez \u00e0 cr\u00e9er et \u00e0 utiliser sans effort votre cl\u00e9 d'acc\u00e8s \u00e0 l'API Kinsta pour une int\u00e9gration transparente et une gestion am\u00e9lior\u00e9e de votre site web.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/","og_locale":"fr_FR","og_type":"article","og_title":"Comment cr\u00e9er et utiliser la cl\u00e9 d'acc\u00e8s \u00e0 l'API Kinsta","og_description":"Apprenez \u00e0 cr\u00e9er et \u00e0 utiliser sans effort votre cl\u00e9 d'acc\u00e8s \u00e0 l'API Kinsta pour une int\u00e9gration transparente et une gestion am\u00e9lior\u00e9e de votre site web.","og_url":"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/","og_site_name":"Kinsta\u00ae","article_publisher":"https:\/\/www.facebook.com\/kinstafrance\/","article_published_time":"2023-07-04T14:36:00+00:00","article_modified_time":"2023-10-27T13:16:03+00:00","og_image":[{"width":1460,"height":730,"url":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/07\/kinsta-api-key.jpg","type":"image\/jpeg"}],"author":"Joel Olawanle","twitter_card":"summary_large_image","twitter_description":"Apprenez \u00e0 cr\u00e9er et \u00e0 utiliser sans effort votre cl\u00e9 d'acc\u00e8s \u00e0 l'API Kinsta pour une int\u00e9gration transparente et une gestion am\u00e9lior\u00e9e de votre site web.","twitter_image":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/07\/kinsta-api-key.jpg","twitter_creator":"@olawanle_joel","twitter_site":"@kinsta_fr","twitter_misc":{"\u00c9crit par":"Joel Olawanle","Dur\u00e9e de lecture estim\u00e9e":"13 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/#article","isPartOf":{"@id":"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/"},"author":{"name":"Joel Olawanle","@id":"https:\/\/kinsta.com\/fr\/#\/schema\/person\/efa7de30245ca15be5ce1dcacff89c07"},"headline":"Comment cr\u00e9er et utiliser la cl\u00e9 d&rsquo;acc\u00e8s \u00e0 l&rsquo;API Kinsta","datePublished":"2023-07-04T14:36:00+00:00","dateModified":"2023-10-27T13:16:03+00:00","mainEntityOfPage":{"@id":"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/"},"wordCount":2556,"commentCount":0,"publisher":{"@id":"https:\/\/kinsta.com\/fr\/#organization"},"image":{"@id":"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/07\/kinsta-api-key.jpg","inLanguage":"fr-FR","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/","url":"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/","name":"Comment cr\u00e9er et utiliser la cl\u00e9 d'acc\u00e8s \u00e0 l'API de Kinsta - Kinsta\u00ae","isPartOf":{"@id":"https:\/\/kinsta.com\/fr\/#website"},"primaryImageOfPage":{"@id":"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/#primaryimage"},"image":{"@id":"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/07\/kinsta-api-key.jpg","datePublished":"2023-07-04T14:36:00+00:00","dateModified":"2023-10-27T13:16:03+00:00","description":"Apprenez \u00e0 cr\u00e9er et \u00e0 utiliser sans effort votre cl\u00e9 d'acc\u00e8s \u00e0 l'API Kinsta pour une int\u00e9gration transparente et une gestion am\u00e9lior\u00e9e de votre site web.","breadcrumb":{"@id":"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/#primaryimage","url":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/07\/kinsta-api-key.jpg","contentUrl":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/07\/kinsta-api-key.jpg","width":1460,"height":730},{"@type":"BreadcrumbList","@id":"https:\/\/kinsta.com\/fr\/blog\/cle-api-kinsta\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kinsta.com\/fr\/"},{"@type":"ListItem","position":2,"name":"API","item":"https:\/\/kinsta.com\/fr\/sujets\/api\/"},{"@type":"ListItem","position":3,"name":"Comment cr\u00e9er et utiliser la cl\u00e9 d&rsquo;acc\u00e8s \u00e0 l&rsquo;API Kinsta"}]},{"@type":"WebSite","@id":"https:\/\/kinsta.com\/fr\/#website","url":"https:\/\/kinsta.com\/fr\/","name":"Kinsta\u00ae","description":"Solutions d&#039;h\u00e9bergement premium, rapides et s\u00e9curis\u00e9es","publisher":{"@id":"https:\/\/kinsta.com\/fr\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kinsta.com\/fr\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Organization","@id":"https:\/\/kinsta.com\/fr\/#organization","name":"Kinsta","url":"https:\/\/kinsta.com\/fr\/","logo":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/kinsta.com\/fr\/#\/schema\/logo\/image\/","url":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/12\/kinsta-logo.jpeg","contentUrl":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/12\/kinsta-logo.jpeg","width":500,"height":500,"caption":"Kinsta"},"image":{"@id":"https:\/\/kinsta.com\/fr\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/kinstafrance\/","https:\/\/x.com\/kinsta_fr","https:\/\/www.instagram.com\/kinstahosting\/","https:\/\/www.linkedin.com\/company\/kinsta\/","https:\/\/www.pinterest.com\/kinstahosting\/","https:\/\/www.youtube.com\/c\/Kinsta"]},{"@type":"Person","@id":"https:\/\/kinsta.com\/fr\/#\/schema\/person\/efa7de30245ca15be5ce1dcacff89c07","name":"Joel Olawanle","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/kinsta.com\/fr\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/051bf577ce2c837846a1db9eef184758?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/051bf577ce2c837846a1db9eef184758?s=96&d=mm&r=g","caption":"Joel Olawanle"},"description":"Joel is a Frontend developer working at Kinsta as a Technical Editor. He is a passionate teacher with love for open source and has written over 300 technical articles majorly around JavaScript and it's frameworks.","sameAs":["https:\/\/joelolawanle.com\/","https:\/\/www.linkedin.com\/in\/olawanlejoel\/","https:\/\/x.com\/olawanle_joel","https:\/\/www.youtube.com\/@joelolawanle"],"gender":"male","knowsAbout":["JavaScript","React","Next.js"],"knowsLanguage":["English"],"jobTitle":"Technical Editor","worksFor":"Kinsta","url":"https:\/\/kinsta.com\/fr\/blog\/author\/joelolawanle\/"}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/posts\/70740","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/users\/287"}],"replies":[{"embeddable":true,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/comments?post=70740"}],"version-history":[{"count":7,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/posts\/70740\/revisions"}],"predecessor-version":[{"id":71880,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/posts\/70740\/revisions\/71880"}],"alternate":[{"embeddable":true,"hreflang":"en","title":"English","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/70740\/translations\/en"},{"embeddable":true,"hreflang":"it","title":"Italian","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/70740\/translations\/it"},{"embeddable":true,"hreflang":"pt","title":"Portuguese","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/70740\/translations\/pt"},{"embeddable":true,"hreflang":"fr","title":"French","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/70740\/translations\/fr"},{"embeddable":true,"hreflang":"de","title":"German","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/70740\/translations\/de"},{"embeddable":true,"hreflang":"ja","title":"Japanese","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/70740\/translations\/jp"},{"embeddable":true,"hreflang":"nl","title":"Dutch","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/70740\/translations\/nl"},{"embeddable":true,"hreflang":"es","title":"Spanish","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/70740\/translations\/es"},{"href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/70740\/tree"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/media\/70741"}],"wp:attachment":[{"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/media?parent=70740"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/tags?post=70740"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/topic?post=70740"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}