Documentation

Migration Giphy → Heypster

API Migration Giphy

Drop-in migration

Réduisez la migration à un changement d’hôte et de clé

Si votre produit utilise déjà GIPHY via REST, Heypster a été pensé pour conserver la même mécanique de requêtes: mêmes chemins `/v1`, mêmes paramètres principaux et même forme de réponse. Sur `heypster-gif.com`, la couche compatible est préfixée par `/giphy`.

La bonne stratégie consiste à migrer en deux temps: d’abord substituer l’hôte et la clé, ensuite vérifier les champs annexes et les renditions réellement consommées par votre interface.

1

Host à remplacer

1

Clé API à remplacer

0

modification lourde

Avant / après

// before
const API_HOST = 'https://api.giphy.com';
const API_KEY = 'YOUR_GIPHY_API_KEY';

// after
const API_HOST = 'https://heypster-gif.com/giphy';
const API_KEY = 'YOUR_HEYPSTER_API_KEY';

1. Hôte API et authentification

Premier changement à opérer: remplacez l’hôte GIPHY par `https://heypster-gif.com/giphy`. Les routes sont protégées par le middleware `giphy.apikey`; si votre couche de compatibilité reproduit GIPHY, gardez le paramètre `api_key`. 

// GIPHY
fetch('https://api.giphy.com/v1/gifs/search?api_key=YOUR_GIPHY_API_KEY&q=clap');

// Heypster
fetch('https://heypster-gif.com/giphy/v1/gifs/search?api_key=YOUR_HEYPSTER_API_KEY&q=clap');

2. Mapping des endpoints

GIPHY Heypster
https://api.giphy.com/v1/gifs/search https://heypster-gif.com/giphy/v1/gifs/search
https://api.giphy.com/v1/gifs/trending https://heypster-gif.com/giphy/v1/gifs/trending
https://api.giphy.com/v1/gifs/translate https://heypster-gif.com/giphy/v1/gifs/translate
https://api.giphy.com/v1/gifs/random https://heypster-gif.com/giphy/v1/gifs/random
https://api.giphy.com/v1/gifs/search/tags https://heypster-gif.com/giphy/v1/gifs/search/tags
https://api.giphy.com/v1/gifs/categories https://heypster-gif.com/giphy/v1/gifs/categories
https://api.giphy.com/v1/tags/related/{term} https://heypster-gif.com/giphy/v1/tags/related/{term}
https://api.giphy.com/v1/trending/searches https://heypster-gif.com/giphy/v1/trending/searches
https://api.giphy.com/v1/randomid https://heypster-gif.com/giphy/v1/randomid
https://api.giphy.com/v1/emoji https://heypster-gif.com/giphy/v1/emoji
https://api.giphy.com/v2/emoji/{emoji_id}/variations https://heypster-gif.com/giphy/v2/emoji/{emoji_id}/variations
https://api.giphy.com/v1/gifs/{id} https://heypster-gif.com/giphy/v1/gifs/{id}
https://api.giphy.com/v1/gifs?ids=... https://heypster-gif.com/giphy/v1/gifs?ids=...

3. Paramètres à vérifier

api_key

Conservez le même nom de paramètre. Seule la valeur change.

q, limit, offset, rating, lang

Dans une migration simple, ces paramètres restent inchangés.

ids

La résolution multi-ID peut rester identique si votre code utilise déjà une liste séparée par des virgules.

term

Le endpoint `/giphy/v1/tags/related/{term}` ajoute un paramètre de chemin explicite pour les tags liés.

emoji_id

Les variations emoji sont servies via `/giphy/v2/emoji/{emoji_id}/variations`.

random_id

Si vous utilisez l’analytics ou la personnalisation GIPHY, vérifiez sur votre environnement Heypster si ce champ est exposé et attendu.

bundle / fields

Si votre code dépend d’optimisations avancées, validez leur disponibilité avant le déploiement final.

4. Parsing des réponses

  • Ne réécrivez pas vos parseurs sans nécessité: commencez par valider `data`, `pagination`, `meta` et `images` sur un environnement de staging.
  • Si votre application lit des champs annexes comme `analytics`, `user`, `source_tld` ou `alt_text`, faites une revue explicite avant mise en production.
  • Vérifiez vos renditions critiques une par une: `original`, `fixed_width`, `fixed_height`, `downsized`, `preview_gif`.
const payload = await response.json();

const gifs = payload.data;
const nextOffset = payload.pagination?.offset ?? 0;
const requestStatus = payload.meta?.status;

5. Exemple complet en JavaScript

const API_HOST = 'https://heypster-gif.com/giphy';
const API_KEY = 'YOUR_HEYPSTER_API_KEY';

export async function searchReactionGifs(query, offset = 0) {
    const url = new URL(`${API_HOST}/v1/gifs/search`);
    url.searchParams.set('api_key', API_KEY);
    url.searchParams.set('q', query);
    url.searchParams.set('limit', '24');
    url.searchParams.set('offset', String(offset));
    url.searchParams.set('lang', 'fr');

    const response = await fetch(url.toString());
    const payload = await response.json();

    return {
        items: payload.data,
        pagination: payload.pagination,
        meta: payload.meta,
    };
}
// Examples for other mapped endpoints
fetch(`${API_HOST}/v1/gifs/categories?api_key=${API_KEY}`);
fetch(`${API_HOST}/v1/tags/related/party?api_key=${API_KEY}`);
fetch(`${API_HOST}/v1/randomid?api_key=${API_KEY}`);
fetch(`${API_HOST}/v2/emoji/1/variations?api_key=${API_KEY}`);

6. Checklist de migration

  • Remplacer `https://api.giphy.com` par `https://heypster-gif.com/giphy`.
  • Remplacer la clé GIPHY par la clé Heypster.
  • Tester au minimum `search`, `trending`, `random` et `get by id`.
  • Vérifier les endpoints additionnels réellement utilisés: `categories`, `related tags`, `randomid`, `emoji`.
  • Comparer la pagination `offset` entre Giphy et Heypster sur vos cas réels.
  • Vérifier les renditions réellement utilisées dans votre application.
  • Confirmer le comportement des champs optionnels avant la mise en production.

Support migration

Nous pouvons vous aider à auditer une intégration GIPHY existante, valider le diff avant mise en production et identifier les champs à surveiller selon votre produit.

contact@heypster.com