Utiliser le REST API depuis JavaScript et le navigateur (CORS)

Ce texte a été traduit à l’aide de l’IA. Si vous souhaitez consulter le texte original en anglais, cliquez ici.

L’API REST peut être utilisée directement depuis le navigateur en JavaScript. Si vous ajoutez à la liste blanche les domaines que vous souhaitez utiliser pour votre application, nous enverrons les en-têtes CORS appropriés. Les appels authentifiés et non authentifiés sont pris en charge. Pour effectuer des requêtes authentifiées, suivez la section implicite de la documentation OAuth pour obtenir un jeton utilisateur.

Tous les exemples utilisent du JavaScript pur avec l’API Fetch.

Requêtes non authentifiées

Vous pouvez effectuer des requêtes GET non authentifiées sans travail supplémentaire. Il suffit de faire une simple requête HTTP :

fetch("https://public-api.wordpress.com/rest/v1/sites/en.blog.wordpress.com/")
  .then(response => response.json())
  .then(data => {
    // data contains site information
  })
  .catch(error => {
    console.error('Error:', error);
  });

Requêtes authentifiées

Pour effectuer des requêtes authentifiées, vous devez fournir un jeton qui vérifie que le propriétaire de la ressource a accordé à l’application la permission d’agir en son nom.

Obtenir/Stocker le jeton utilisateur

Pour obtenir un jeton d’accès valide pour l’utilisateur actuel, votre application doit utiliser le flux OAuth, où l’utilisateur accorde explicitement la permission. Pour les applications côté client, vous pouvez utiliser le flux implicite OAuth 2.0, qui ne nécessite pas de secret client.

Effectuer la requête

Lors de la requête, il vous suffit de transmettre le jeton d’accès en tant qu’en-tête.

fetch(`https://public-api.wordpress.com/rest/v1/sites/${site_id}/posts/new`, {
  method: 'POST',
  headers: {
    'Authorization': `Bearer ${access_token}`,
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({
    content: 'testing test'
  })
})
.then(response => response.json())
.then(data => {
  // Handle the response data
})
.catch(error => {
  console.error('Error:', error);
});

Ajouter des origines à la liste blanche

Pour éviter les erreurs CORS lors d’appels API authentifiés depuis votre application basée sur un navigateur, vous devez ajouter à la liste blanche les domaines qui effectueront ces requêtes. Si vous n’ajoutez pas votre domaine à la liste blanche, vous recevrez une erreur CORS comme celle-ci :

Access to XMLHttpRequest at 'https://public-api.wordpress.com/rest/v1/me/' from origin 'https://www.my-demo-domain.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Vous pouvez ajouter vos domaines à la liste blanche lors de la création ou de la configuration de votre application avec le gestionnaire d’applications.

Pour ajouter plusieurs domaines à la liste blanche, saisissez chaque URL de domaine sur une ligne distincte dans le champ de saisie « Javascript Origins ».