Node.js & MySQL

Pendant longtemps pour interroger dans le cadre d'une page web, une base de données il fallait produire un script PHP.
Le développeur web devait donc apprendre le HTML, le CSS, Le JavaScript mais aussi le PHP ...
Désormais grâce à Node.js on peut manipuler une base de données via JS et en dehors du navigateur.

Le SGBD MySQL

MySQL est un SGBD parmi d'autres.

Les différents SGBD

Il existe des SGBD (Système de Gestion de Bases de Données) de type SQL (Structured Query Langage) et d'autres NoSQL.
Le SGBD de type SQL le plus connu est MySQL. Il est de type SQL car les requêtes doivent être écrites avec ce langage de requête.

Dans un autre tuto de mon site vous trouverez quelques chapitres sur MySQL. J'y explique qu'une base de données MYSQL comprend 1 ou plusieurs tables ; que chaque table est structurée ; je précise les différents types de champs ; j'indique les différentes types de requêtes pour consulter et modifier les données de la base.
Didacticiel sur MYSQL

Dans la suite de ce chapitre je vais vous montrer comment manipuler une base de données MYSQL avec Node.js. Même si il est vrai que l'on associe souvent Node.js avec le SGBD orienté document : mongoDB.

Installations prélables

Il faut éventuellement installer le SGBD MySQL.
Si sur votre PC vous avez déjà installé WAMP (logiciel de serveur web sous Windows), le SGBD MySQL est déjà installé puisqu'il fait partie du pack. Sinon télécharger SGBD mysql.

Il faut ensuite installer le pilote ("driver") "mysql". Donc il suffit de taper à partir de la console Windows : npm install mysql

Créer et manipuler une base MySQL

Pour le SGBD MySQL installé sur mon PC, le nom utilisateur est "root" et il n'y a pas de mot de passe.
Il existe déjà une base appelée "mabase".

Créer une base

Le programme

var mysql = require('mysql');

var con = mysql.createConnection({
  host: "localhost",
  user: "root",
  password: ""
});
con.connect(function(err) {
  if (err) throw err;
  con.query("CREATE DATABASE mabase2", function (err, result) {
    if (err) throw err;
    console.log("base de données 'mabase2' créée");
  });
});
con.end();

Ce script se connecte à MySQL de mon PC et y crée une nouvelle base nommée "mabase2".

Le rendu

Si cet outil est installé, démarrez WAMP, lancez l'utilitaire phpMyAdmin et vérifiez si la nouvelle base a bien été créée.

Création d'une table dans la base

La nouvelle base doit comporter au moins une table.

Le programme

var mysql = require('mysql');
var con = mysql.createConnection({
  host: "localhost",
  user: "root",
  password: "",
  database: "mabase2"
});
con.connect(function(err) {
  if (err) throw err;
  console.log("Connecté à 'mabase2' !");
  var sql = "CREATE TABLE adherents2 (nom VARCHAR(50), prenom VARCHAR(50), adresse VARCHAR(150), email VARCHAR(100))";
  con.query(sql, function (err, result) {
    if (err) throw err;
    console.log("Table 'adherents2' créée");
  });
});
con.end();

Ce script se connecte à la nouvelle base et y crée un table nommée "adherents2".
La structure de cette table n'est pas un modèle à suivre. Il n'y a pas de clé primaire ... donc une recherche indexée est impossible.

Le rendu

Basculez sur l'utilaire phpMyAdmin et vérifiez si la table a bien été créée.

Remplir la table

La nouvelle table est pour le moment vide de tout enregistrement.
Dans le cadre d'un script il faut une requête SQL de type INSERT pour la remplir.

Le script

var mysql = require('mysql');
var con = mysql.createConnection({
  host: "localhost",
  user: "root",
  password: "",
  database: "mabase2"
});
con.connect(function(err) {
  if (err) throw err;
  console.log("Connecté à base 'mabase2' !");
  var sql = "INSERT INTO adherents2 (nom, prenom, adresse) VALUES ?";
  var values = [
    ['Lenon','john', 'Highway 71'],
    ['Donald','Peter', 'Lowstreet 4'],
    ['Carter','Amy', 'Apple st 652'],
    ['Smith','Hannah', 'Mountain 21'],
   ['Reagan','Ronald', 'mainstreet 56']
  ];
  con.query(sql, [values], function (err, result) {
    if (err) throw err;
    console.log("Nombre de lignes insérées : " + result.affectedRows);
	con.end(); 
  });
});

Ce programma ajoute 5 lignes (enregistrements) à la table "adherents2".
Les champs "email" ne sont pas renseignés mais il n'y aura pas d'erreur d'exécution puisque NULL est autorisé pour toutes les colonnes de cette table.

Le rendu

Encore une fois utilisez l'utilitaire phpMyAdmin pour vérifier de la bonne exécution du script.

Remplir la table - version améliorée

Dans la pratique c'est l'utlisateur qui précise via des saisies le contenu des différents champs pour l'enregistrement ajouté.
Le code : var mysql = require('mysql'); const prompt = require('prompt-sync')(); var con = mysql.createConnection({ host: "localhost", user: "root", password: "", database: "mabase2" }); var vnom = prompt("saisir nom !"); var vprenom = prompt("saisir prenom !"); var vadresse = prompt("saisir adresse !"); var requete ="INSERT INTO adherents2(nom,prenom,adresse) VALUES (?,?,?)"; con.connect(function(err) { if (err) throw err; console.log("Connecté à base 'mabase2' !"); con.query(requete, [vnom,vprenom,vadresse], function (err, result) { if (err) throw err; con.end(); }); });

Il faut importer le module "prompt-sync" pour effectuer des saisies au clavier.
Notez la syntaxe particulière de la requête SQL INSERT et de l'instruction d'exécution de cette requête.

Remplir la table via un formulaire de saisie

L'idéal pour un utilisateur est de renseigner un formulaire donc avec des contrôles de saisie.
Si vous avez lu mon tutoriel sur PHP vous savez qu'il est relativement simple de créer une page d'extension .php qui ajoute une ligne après saisies des données via un formulaire HTML.
Code HTML & PHP pour ajouter une ligne à une table MySQL
Malheureusement c'est beaucoup moins simple en Node.js qu'en PHP.
La solution dans l'environnement Node.js fait appel à des notions qui n'ont pas été encore évoquées ...

Afficher le résultat d'une requête sélection

Afficher le résultat dans la console Node

Le code est relativement simple.

Le script

var mysql = require('mysql');
var connexion = mysql.createConnection({
  host: "localhost",
  user: "root",
  password: "",
  database: "mabase2"
});
connexion.connect(function(err) {
  if (err) throw err;
  connexion.query("SELECT * FROM adherents2", function (error, retour_sql, fields) 
  {
    if (error) {console.log(error); connexion.end(); }
    for (var ligne of retour_sql)
		{
		console.log(ligne.nom + " " + ligne.prenom + "  " +ligne.adresse);
		}
	connexion.end();
  });
});

Il faut se connecter à la base "mabase2" puis exécuter une requête de type SELECT.
le résultat de cette requête est dans "retour_sql" : un tableau d'objets.
Il suffit ensuite de parcourir ce tableau avec une boucle de type FOR ... OF ...

Le rendu

L'affichage dans la console Node du contenu de cette table est tristounet.
Rassurez-vous, il s'agit d'un affichage provisoire.

A propos des requêtes SELECT ...

Une requête SQL de type SELECT peut être très puissante mais alors complexe : tri / filtrage / étendue / extraction de données appartenant à plusieurs tables reliées entre elles par un champ de jointure.
Si vous voulez réviser le langage SQL et plus précisèment les requêtes de sélection : les requêtes SELECT du langage SQL.

Afficher le résultat d'une requête SELECT sous forme d'une page web

Il est souhaitable que le résultat d'une requête sélection s'affiche dans le navigateur.

créer un serveur web
générer du code HTML
envoyer ce code généré via le serveur dans le navigateur

Le script

var http =require("http"); 
var mysql =require("mysql"); 

// connexion à la bd
var connexion = mysql.createConnection({
  host: "localhost",
  user: "root",
  password: "",
  database: "mabase2"
});
var sql ="select * from adherents2";
// préparation HTML 
var HTML ="<!DOCTYPE html><html><meta charset = 'utf-8'><body>"; 
connexion.query(sql,function select(error,retour_sql)
{	
	if (error) {console.log(error); connexion.end(); }
	HTML+= "<p>Nom .... prénom ....  adresse</br>" ;
	for (var ligne of retour_sql)
		{
		HTML+= ligne.nom + " -  " + ligne.prenom + " - " +  ligne.adresse +  "<br>" ;
		console.log(ligne.nom + " " + ligne.prenom + "  " +ligne.adresse);
		}
		HTML+= "</body></html>"; 
		console.log("tapez 'localhost:8080' dans navigateur");
} )
var pour_navigateur = function(req,result)
{ result.writeHead(200, {'Content-Type': 'text/html'}); result.end(HTML); }

// instanciation du serveur 
var serveur = http.createServer(pour_navigateur);
serveur.listen(8080);

Le code HTML est généré dans la variable nommée HTML.
Le contenu de cette variable est adressé au navigateur via le serveur web : result.writeHead(200, {'Content-Type': 'text/html'}); result.end(HTML);

Le rendu dans le navigateur

Le contenu de la table s'affiche désormais non seulement dans la console mais aussi sous forme d'une jolie page web dans le navigateur.
Reconnnaissez que l'affichage de la requête SELECT dans le navigateur est fort satisfaisant.

Traduction

Tutoriel sur JS natif, Vue.js, jQuery.js & Node.js

JavaScript natif

Framework Vue.js

Framework jQuery.js

Node.js

Tutoriel JavaScript - recherche

L'auteur : Patrick Darcheville

Node.js & MySQL

Le SGBD MySQL

Les différents SGBD

Installations prélables

Créer et manipuler une base MySQL

Créer une base

Le programme

Le rendu

Création d'une table dans la base

Le programme

Le rendu

Remplir la table

Le script

Le rendu

Remplir la table - version améliorée

Remplir la table via un formulaire de saisie

Afficher le résultat d'une requête sélection

Afficher le résultat dans la console Node

Le script

Le rendu

A propos des requêtes SELECT ...

Afficher le résultat d'une requête SELECT sous forme d'une page web

Le script

Le rendu dans le navigateur