Créé en 2020 et modifié le 18 May 2021
Créé en 2020 et modifié le 18 May 2021
Réaliser son API avec la méthode HTTP GET
Intro
- réaliser un diagramme de déploiement des parties 1, 2 et 3. On pourra utiliser https://app.diagrams.net/
Partie 1 – Hôtel Amor
Slim est un micro Framework pour PHP.
route bonjour – méthode GET, URI /bonjour
- installer composer
- créer un fichier composer.json dans finder/amor/
{ "require": { "php": "7.*", "ext-mbstring": "*", "ext-mysqli": "*", "ext-json": "*", "ext-pdo": "*", "ext-pdo_mysql": "*", "slim/slim": "3.*", "zircote/swagger-php": "^2.0", "firebase/php-jwt": "^5.0" } }
- en PHP7 ou supérieur, grâce à une invite de commande, exécuter dans le répertoire amor
composer require slim/slim "3"
- dans un fichier finder/amor/index.php, copier le code
<?php require 'vendor/autoload.php'; use \Psr\Http\Message\ServerRequestInterface as Request; use \Psr\Http\Message\ResponseInterface as Response; $app = new \Slim\App; $app->get('/zaza', function(Request $request, Response $response){ return "wazaaaaaaaa"; }); $app->run();
- tester le serveur sur localhost/finder/amor/index.php/
- tester la route zaza
- modifier la route zaza par bonjour pour obtenir le message bonjour.
Exemple de code client functionSlim.js en JQ, à adapter en VueJS
$( document ).ready(function() { $('#btn-valide').click(function(){ $.ajax({ type: "GET", contentType: 'application/json; charset=utf-8', url: "http://localhost/serveur/bonjour", success: function(data){ alert(data); } }); }); });
- démarrer le serveur (apache ou autre)
- tester la route
- dans un fichier finder/amor/index.html, la page appellera la route bonjour grâce à Ajax avec la méthode GET.
</html>
———————————————————————– ANNEXE APACHE ————————————————————————————————————-
Pour le déploiement en ligne du serveur slim et éviter index.php à chaque route
dans un fichier .htaccess. Si le htaccess fait planter le serveur, des configurations du serveur Apache sont nécessaires. Enlever le htaccess et ajouter index.php à chaque uri.
RewriteEngine On RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule ^ index.php [QSA,L] Header set Access-Control-Allow-Origin "*" Header set Access-Control-Allow-Headers "Origin, X-Requested-With, Content-Type, Accept" Header set Access-Control-Allow-Methods: "GET,POST,OPTIONS,DELETE,PUT"
Partie 2 – Hôtel Byzance
Express est un Framework pour réaliser un serveur avec Node.js.
route bonjour – méthode GET, URI /bonjour
- Installer NodeJS
- Réaliser un fichier index.js dans finder/byzance
console.log("Bonjour");
- Tester le fichier.
node "dossier"/index.js
- Réaliser un fichier package.json
{ "name": "api", "version": "0.0.1", "private": true, "scripts": { "start": "node index.js" }, "dependencies": { "express": "4", "cors" : "2" } }
- Dans le répertoire de votre projet, installer les dépendances
npm install
- implémenter la route GET /bonjour et lancer le fichier.
Exemple de code serveur index.js
var express = require('express'); var cors= require('cors'); var hostname = 'localhost'; var port = 8080; var app = express(); app.use(cors()); app.get('/bonjour', function(req, res){ res.json({message : "Youhou", methode : req.method}); }) // Démarrer le serveur app.listen(port, hostname, function(){ console.log("Mon serveur fonctionne sur http://"+ hostname +":"+port); });
- démarrer le serveur
npm start
- tester la route
- réaliser la page index.html qui appelle la route en ajax
Partie 3 – Hôtel Caraïbes
Flask est un Framework pour réaliser un serveur avec Python.
route bonjour – méthode GET, URI /bonjour
- installer Python
- installer le module flask
pip install Flask
- installer le module cors
pip install -U flask-cors
- implémenter la route GET /bonjour qui devra renvoyer le message bonjour.
Exemple de code serveur index.py
from flask import Flask from flask_cors import CORS app = Flask(__name__) CORS(app) @app.route("/") def hello(): return "Hello World!" if __name__ == '__main__': app.run(debug=True)
- démarrer le serveur
python index.py
- tester la route
- réaliser la page index.html qui appelle la route en ajax