Générateur JSON

Recommandations connexes

À propos du Générateur JSON et des données de test Mock

Cas d'utilisation

• Développement frontend : besoin de données Mock stables et reproductibles pour rendre des composants, listes d'utilisateurs, fiches produits, détails de commande, etc.
• Intégration frontend lorsque l'API backend n'est pas encore prête, pour éviter d'attendre les retours du backend
• Rédaction de cas de test d'API automatisés par l'équipe QA, en construisant en masse des données pilotées par les champs pour des scénarios variés
• Rédaction de documentation d'API et d'exemples Swagger / OpenAPI, en produisant rapidement des exemples de requêtes/réponses conformes à la structure
• Préparation de grandes quantités de données structurées pour les tests de performance et de charge, afin de valider la stabilité du système en haute concurrence
• Scripts de migration de base de données, développement d'outils de nettoyage de données : construction de JSON d'exemple pour valider la logique métier
• Enseignement et démonstrations : blogs techniques, captures PPT, supports de formation nécessitant des exemples JSON bien structurés
• Validation de formulaires frontend et logique de cache local : construction de valeurs limites (extrêmes, vides, types anormaux) pour les tests

Comment utiliser

1. Dans le « constructeur de schéma » à gauche, consultez le schéma d'exemple par défaut (7 champs : id, name, email, age, active, createdAt, bio) ou cliquez sur « + » pour ajouter un champ personnalisé
2. Définissez pour chaque champ son nom (personnalisable) et son type (13 choix déroulants) ; pour les types numériques et paragraphe, remplissez min/max, pour le type Enum, saisissez les valeurs candidates séparées par des virgules
3. Cochez « Générer comme tableau » et définissez la quantité (1-1000), ou décochez pour générer un seul objet JSON
4. Cliquez sur le bouton « Générer » en haut à droite : l'éditeur de droite affiche instantanément le résultat JSON formaté, avec le nombre de champs et d'enregistrements
5. Cliquez sur « Copier » pour coller le résultat dans votre code ou outil d'API, ou sur « Télécharger » pour enregistrer un fichier generated.json

Fonctionnalités

• 13 types de champs intégrés : String, Integer, Number, Boolean, Email, Name, UUID, Date, URL, Phone, Paragraph, Enum et Array, prêts à l'emploi sans mémoriser la syntaxe
• Constructeur visuel de champs : ajoutez ou supprimez des champs via une interface graphique, définissez le nom du champ et son type, WYSIWYG, sans écrire de modèle JSON
• Contrôle des plages numériques et de paragraphes : les types Integer, Number et Paragraph supportent des valeurs min/max personnalisées pour des données plus réalistes
• Valeurs d'énumération personnalisées : saisissez une liste séparée par des virgules (par ex. admin,user,guest) pour générer des options discrètes contrôlées
• Basculement objet / tableau en un clic : cochez « Générer comme tableau » + quantité (1-1000) pour alterner librement entre un objet unique et un tableau
• Schéma d'exemple à chargement rapide : 7 champs intégrés (id, name, email, age, active, createdAt, bio) générant un exemple complet en un clic
• Panneau de sortie avec coloration syntaxique : éditeur CodeMirror à droite affichant le résultat en temps réel avec coloration JSON, numéros de ligne et lecture seule
• Copier et télécharger en un clic : copiez le résultat dans le presse-papiers ou téléchargez-le directement sous forme de fichier generated.json
• Exécution locale dans le navigateur : toute la construction des champs et la génération de données se fait entièrement dans votre navigateur, aucun envoi de données
• Adapté au bureau et au mobile : colonnes gauche/droite réglables sur PC, basculement automatique en onglets entrée/sortie sur mobile

Exemples de code

// Placez generated.json dans /public/mock/users.json
// puis utilisez fetch pour le récupérer comme données Mock
async function fetchMockUsers() {
  const res = await fetch('/mock/users.json');
  const users = await res.json();
  console.log(`Chargement de ${users.length} utilisateurs`);
  return users;
}

// Intégration directe dans le code (pour les cas de test)
const mockUsers = [
  { id: 1, name: 'Jennifer Martinez', email: 'jennifer.martinez382@example.com', age: 42, active: true },
  { id: 2, name: 'Robert Smith', email: 'robert.smith918@test.org', age: 67, active: false }
];

// Ou importé comme fixture dans Jest / Vitest
import users from './fixtures/users.json';
test('Rendu de la liste des utilisateurs', () => {
  render(<UserList users={users} />);
  expect(screen.getAllByRole('listitem')).toHaveLength(users.length);
});

# Installation : pip install faker
from faker import Faker
import json

fake = Faker('zh_CN')  # localisation chinois

# Générer un utilisateur
def gen_user():
    return {
        "id": fake.random_int(min=1, max=99999),
        "name": fake.name(),
        "email": fake.email(),
        "phone": fake.phone_number(),
        "address": fake.address(),
        "company": fake.company(),
        "created_at": fake.iso8601()
    }

# Générer 100 entrées en lot et écrire dans generated.json
users = [gen_user() for _ in range(100)]
with open('generated.json', 'w', encoding='utf-8') as f:
    json.dump(users, f, ensure_ascii=False, indent=2)

print(f"{len(users)} utilisateurs générés")

# On suppose que generated.json se trouve dans le répertoire courant et que l'API cible est POST /api/users
# Initialisation en masse des données
for i in $(seq 1 10); do
  curl -X POST https://api.example.com/users \
    -H "Content-Type: application/json" \
    -d @generated.json | jq '.'
done

# Ou extraire une seule entrée avec jq puis POSTer
cat generated.json | jq '.[0]' | \
  curl -X POST https://api.example.com/users \
    -H "Content-Type: application/json" \
    -d @-

FAQ

Dépannage

Glossaire

JSON

JavaScript Object Notation, format léger d'échange de données composé de paires clé-valeur et de tableaux. C'est le standard de fait pour la transmission de données entre frontend et backend et pour les API Web.

Données Mock

Données factices simulant des scénarios métier réels, utilisées en développement frontend, intégration d'API et tests automatisés, lorsque le backend réel n'est pas encore connecté. Elles doivent respecter la structure de l'API réelle.

Schéma

Définition décrivant la structure des données, par ex. « un utilisateur comporte les champs id, name, email ». Dans cet outil, le Schéma désigne l'ensemble des noms de champs et de leurs types définis dans le constructeur de gauche.

UUID (v4)

Identifiant unique universel, chaîne de 128 bits définie par la norme RFC 4122. La v4 est basée sur la génération aléatoire (avec bits de variante 13/8/9/a/b), quasi-unique, couramment utilisée comme clé primaire distribuée.

Type de champ (Field Type)

Type de données que chaque champ de cet outil doit spécifier, déterminant le format de la valeur aléatoire générée. Par exemple, le type Email génère une chaîne au format e-mail, le type Integer un entier.

Enum (énumération)

Type de champ tirant aléatoirement une valeur dans un ensemble discret prédéfini. Par exemple, choisir entre admin, user et guest ; idéal pour les champs de rôle, d'état ou de niveau.

min / max

Contraintes de plage pour la valeur d'un champ, applicables uniquement aux trois types Integer, Number et Paragraph. Une fois définies, les nombres aléatoires seront générés dans cet intervalle fermé, évitant les valeurs limites manifestement inventées.

Objet unique vs sortie tableau

Cet outil supporte deux formes de sortie : sans cocher « Générer comme tableau », il produit un objet JSON unique {} (idéal pour le débogage unitaire d'API) ; en cochant la case et en saisissant une quantité, il produit un tableau d'objets [...] (idéal pour les données en masse).

RFC 4122

Norme internationale pour les UUID, définissant leur format, leurs versions (v1 à v5) et leurs bits de variante. Les UUID générés par cet outil sont conformes à la spécification v4.

CodeMirror

Composant d'éditeur de code côté navigateur. La zone de sortie droite de cet outil utilise CodeMirror pour offrir la coloration syntaxique JSON, l'affichage des numéros de ligne et la navigation en lecture seule.

Traitement local

Toutes les opérations de construction de champs et de génération de données s'exécutent dans le navigateur de l'utilisateur via JavaScript, sans aucun envoi vers un serveur. Plus rapide et plus sûr, idéal pour les champs métier sensibles.

Fixture

Fichier de données d'exemple utilisé de manière fixe dans les tests. La sortie du générateur peut être enregistrée sous generated.json comme fixture pour les tests de régression ultérieurs, garantissant la reproductibilité des résultats.

Table de référence des types de champs et règles de génération

Plages de valeurs, usages typiques et exemples pour les 13 types de champs intégrés :

Scénarios courants de génération JSON et combinaisons de champs recommandées

Voici plusieurs scénarios fréquents de génération de données de test d'API et leurs combinaisons de champs recommandées, que vous pouvez ajouter directement :

Privacy & Security

Toutes les opérations de construction de champs, de génération aléatoire de données, de copie et de téléchargement de ce Générateur JSON s'exécutent entièrement dans votre navigateur via JavaScript. Le schéma que vous définissez, les données aléatoires générées, les noms de champs et les quantités ne sont jamais envoyés sur un serveur, ni enregistrés, mis en cache ou stockés dans le cloud. Vous pouvez utiliser sans crainte des champs d'API internes, des structures métier non publiées ou des scénarios de test sensibles : aucun risque de fuite de données.

Authoritative References

• IETFRFC 4122 - Spécification des UUID
• OfficialSite officiel JSON (avec spécification de syntaxe)
• LibraryMock.js - Bibliothèque Mock dédiée au frontend
• LibraryFaker.js / Faker Python - Bibliothèques de génération de données factices
• MDNMDN - JSON.parse / JSON.stringify