Comment utiliser l'API de téléchargement d'images gratuites - imgur.com

En utilisant l'API fournie par imgur.com, vous pouvez créer une fonction qui vous permet de joindre gratuitement des images à votre blog ou site Web.

S'inscrire

Si vous n'êtes pas inscrit en tant que membre, veuillez d'abord procéder à l'inscription en tant que membre sur le site suivant.

Imgur : La magie d'Internet

Sélectionnez le bouton S'inscrire dans le coin supérieur droit.

Vous pouvez également vous inscrire facilement avec d'autres comptes sociaux. Je vais m'inscrire avec mon compte Google.

Entrez votre nom d'utilisateur et votre numéro de téléphone portable et appuyez sur le bouton Continuer.

Entrez le numéro à 7 chiffres envoyé à votre téléphone portable et appuyez sur le bouton Enregistrer.

L'enregistrement est terminé immédiatement et vous serez déplacé vers l'écran suivant.

Enregistrement de la candidature

Une fois l'enregistrement de l'adhésion terminé, l'étape suivante consiste à suivre le processus d'enregistrement de la demande pour télécharger des images sur le service de votre choix.

Sélectionnez l'API affichée en bas du site principal imgur.com.

Vous verrez alors la documentation de l'API Imgur comme ceci :

Si vous faites défiler un peu, vous verrez un lien pour enregistrer votre application, sélectionnons-le.

Si vous souhaitez y accéder directement, il vous suffit de cliquer sur le lien suivant.

Imgur - Enregistrer une application

Sur l'écran suivant, nous remplirons les champs obligatoires. Entrez le nom d'application approprié et l'URL du site que vous exploitez dans l'URL de rappel d'autorisation. Il semble que vous puissiez entrer une adresse différente, mais je ne sais pas pourquoi. Vous saisirez également votre adresse e-mail. Et cliquez sur le bouton Soumettre.

Si vous avez entré normalement, vous pouvez obtenir les valeurs d'ID client et de secret client comme suit. La valeur dont nous avons besoin est l'ID client. Assurez-vous de noter également la valeur du secret client, car vous pourriez en avoir besoin plus tard. Même si vous oubliez, vous pouvez en créer un nouveau et l'utiliser plus tard si nécessaire.

Comment télécharger des fichiers

Ceci peut être facilement vérifié avec l'exemple suivant. Entrez la valeur de l'ID client obtenue lors de l'enregistrement de l'application dans la partie xxxxxxxxxx.

<input type="file" id="upload_image">
<button onclick="uploadImageTest()">upload</button>
<script>
    function uploadImageTest() {
        var bodyData = new FormData();
        var imageFile = document.querySelector("#upload_image").files[0];
        bodyData.append("image", imageFile);
        fetch("https://api.imgur.com/3/image", {
            method: "POST",
            headers: {
                Authorization: "Client-ID xxxxxxxxxxxxxxx",
                Accept: "application/json",
            },
            body: bodyData,
        }).then(function(res){
            return res.json();
        }).then(function(json){
            console.log(json);
        });
    }
</script>

Si le téléchargement de l'image réussit, les informations suivantes sont renvoyées. Par conséquent, il est possible de juger du succès par la valeur de succès et d'afficher l'image réelle à travers la partie lien des données.

{
  "data": {
    "id": "orunSTu",
    "title": null,
    "description": null,
    "datetime": 1495556889,
    "type": "image/gif",
    "animated": false,
    "width": 1,
    "height": 1,
    "size": 42,
    "views": 0,
    "bandwidth": 0,
    "vote": null,
    "favorite": false,
    "nsfw": null,
    "section": null,
    "account_url": null,
    "account_id": 0,
    "is_ad": false,
    "in_most_viral": false,
    "tags": [],
    "ad_type": 0,
    "ad_url": "",
    "in_gallery": false,
    "deletehash": "x70po4w7BVvSUzZ",
    "name": "",
    "link": "http://i.imgur.com/orunSTu.gif"
  },
  "success": true,
  "status": 200
}

J'espère que vous le trouverez utile.