forked from quentin/quentin.dufour.io
Update Article “2023-04-12-un-outil-sans-daemon-pour-gérer-ses-artefacts-de-build”
This commit is contained in:
parent
da59692a6f
commit
392d4c1745
1 changed files with 38 additions and 1 deletions
|
@ -113,9 +113,46 @@ e<!doctype html>
|
|||
<body>
|
||||
<pre>list</pre>
|
||||
<script type="text/javascript">
|
||||
console.log()
|
||||
console.log("hello world")
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
On va avoir besoin d'une API du navigateur nommée `FileReader` mais cette dernière utilise la sémantique des callbacks. On va créer un wrapper avec des Promises pour simplifier son utilisation :
|
||||
|
||||
```javascript
|
||||
const reader = blob => {
|
||||
const tmp = new FileReader();
|
||||
return new Promise((resolve, reject) => {
|
||||
tmp.onerror = () => {
|
||||
tmp.abort()
|
||||
reject(new DOMException("Problem parsing blob"))
|
||||
}
|
||||
tmp.onload = () => {
|
||||
resolve(tmp.result)
|
||||
}
|
||||
tmp.readAsText(blob)
|
||||
})
|
||||
}
|
||||
```
|
||||
|
||||
Et maintenant on peut simplement écrire notre logique pour récupérer la liste des tags :
|
||||
|
||||
```javascript
|
||||
const albatros_tags = async () => {
|
||||
const res = await fetch('https://registry.deuxfleurs.org/v2/albatros/tags/list')
|
||||
const blob = await res.blob()
|
||||
const txt = await reader(blob)
|
||||
const tags = JSON.parse(txt)
|
||||
return tags
|
||||
}
|
||||
|
||||
(async () => console.log(await albatros_tags()))()
|
||||
```
|
||||
|
||||
Ensuite il ne reste plus qu'à l'insérer dans le DOM de la page :
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
Loading…
Reference in a new issue