Créé en 2021 et modifié le 19 May 2021

Créé en 2021 et modifié le 19 May 2021

Réaliser son API avec des paramètres HTTP

Intro

  • réaliser le diagramme de déploiement de votre application

 

Partie 1  – Hôtel Amor

 

route user – méthode GET,  URI /user

  • Ajouter un mot de passe à la table user
  • Envoyer l’email et le mot de passe de connexion.html au serveur SLIM.
  • Tester si l’email et le mot de passe existe grâce à une fonction et renvoyer le code 200 ou 401.

Exemple de code client JQ

$('#btn-valide').click(function(){ 
let id=$('#id').val();
let nom=$('#nom').val();
$.ajax({ 
      type: "GET",
      contentType: 'application/json; charset=utf-8',
      url: "http://localhost/got/serveur/user?id="+id+"&nom="+nom,
     success: function(data){
         alert(data);
      }
 });
});

Exemple de code client VueJS

<!doctype html>
<html lang="fr">
<head>
  <link   type="text/css"    rel="stylesheet"    href="https://unpkg.com/bootstrap/dist/css/bootstrap.min.css"  />
  <link   type="text/css"    rel="stylesheet"    href="https://unpkg.com/[email protected]/dist/bootstrap-vue.css"  />
  <script src="https://unpkg.com/vue"></script>
  <script src="https://unpkg.com/[email protected]/dist/bootstrap-vue.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
</head>
<div id="app">
    <b-container>
         <input v-model="idc" placeholder="numéro de chambre"/>
          <button v-on:click="ajax(idc)">valider</button>
    </b-container>
</div>
<script>
        var app =new Vue({
          el: '#app',
          data () {
            return {             
              idc: 0                
            }
          },
          methods: {
            ajax: function (idc, event) {
            axios({
              method: 'get',
              url: 'http://frebourg.es/api/index.php/chambre?idc='+idc,
              responseType: 'json',    
            })
               .then(async res => { 
                 if(res.status === 200) { 
                       alert('Ok!');
                       this.info=res.data;                     
                  } else if(res.status === 400) { 
                      let errorResponse = await res.json(); this.errors.push(errorResponse.error); }
               })  
            }
            }
        })
        </script>
</html>

 

Exemple d’ajout de code index.php

$app->post('/user', function(Request $request, Response $response){
	 $tb = $request->getQueryParams();
    $id = $tb["id"];
    $nom = $tb["nom"];
        //fonction de vérification d'utilisateur
	return checkUser($id, $nom);
});

function checkUser($id, $nom)
{
	$sql = "SELECT * FROM gateau";
	try{
		$dbh=connexion();
		$statement = $dbh->prepare($sql);
		$statement->execute();
		 $result = $statement->fetchAll(PDO::FETCH_CLASS); 
                 return json_encode($result, JSON_PRETTY_PRINT);
	} catch(PDOException $e){
		return '{"error":'.$e->getMessage().'}';
	}
}

 

route user – méthode POST,  URI /user

  • Réaliser un formulaire d’inscription d’utilisateur inscription.html.
  • Permettre l’ajout de l’utilisateur dans la base de données.

Exemple de code client

$('#btn-valide').click(function(){ 
let id=$('#id').val();
let nom=$('#nom').val();
$.ajax({ 
      type: "POST",
      contentType: 'application/json; charset=utf-8',
      url: "http://localhost/got/serveur/user?id="+id+"&nom="+nom,
     success: function(data){
         alert(data);
      }
 });
});

Exemple d’ajout de code index.php

$app->post('/user', function(Request $request, Response $response){
$tb = $request->getQueryParams(); 
$id = $tb["id"];
       	return insertUser($id, $nom);
});

function insertUser($id, $nom)
{
	$sql = "INSERT ...";
	...
}

 

Partie 2  –  Hôtel Byzance

 

route user – méthode GET,  URI /user

  • Ajouter un mot de passe à la table user
  • Envoyer l’email et le mot de passe de connexion.html au serveur.
  • Tester si l’email et le mot de passe existe grâce à une fonction et renvoyer le code 200 ou 401.

Exemple de code serveur

app.get('/gateaux', function(req,res,next){ 
 nom= req.query.nom;
console.log( nom); 
 connection.query('SELECT * from gateau', function (error, results, fields) {
 if (error) throw error;
 res.json({message : results}); 
 });  
 })

 

route user – méthode POST,  URI /user

  • Permettre l’ajout de l’utilisateur dans la base de données depuis inscription.html.

Exemple de code serveur

connection.connect();
app.use(express.json());      

app.post('/user'), function(req,res){ 
 var id= req.query.id;
 var nom= req.query.nom;


 connection.query('insert into gateau values('+id+',"'+nom+'")', function (error, results, fields) {
 if (error) throw error; 
 }); 
 
 res.json({
 message : "Gateau ajouté"}); 
})

 

Partie 3  –  Hôtel Caraïbes

route user – méthode GET,  URI /user

  • Ajouter un mot de passe à la table user
  • Envoyer l’email et le mot de passe de connexion.html au serveur.
  • Tester si l’email et le mot de passe existe grâce à une fonction et renvoyer le code 200 ou 401.

Exemple de code serveur

from flask import Flask
from flask import request
from flask import jsonify
#from flaskext.mysql import MySQL
import json
import sqlite3 as sql
app = Flask(__name__)
CORS(app)

#mysql = MySQL() #app.config['MYSQL_DATABASE_USER'] = 'root' #app.config['MYSQL_DATABASE_PASSWORD'] = '' #app.config['MYSQL_DATABASE_DB'] = 'patisserie' #app.config['MYSQL_DATABASE_HOST'] = 'localhost' #app.config['MYSQL_DATABASE_SOCKET'] = '' #mysql.init_app(app)

@app.route('/personnage', methods=['GET']) 
def ma_fonction(): 

 #conn = mysql.connect()#cursor = conn.cursor() #cursor.execute('select * from gateau')
  #id = request.values.get('id')
  #nom = request.values.get('nom')
  id=str(1)
  con = sql.connect("mabase.db")
  con.row_factory = sql.Row
  cur = con.cursor()
  cur.execute("select * from user where id="+id)
  data=[]
  rows = cur.fetchall(); 
  for row in rows:
    data.append(list(row))

  if len(data) != 0:
    return jsonify(data)
  else:
    return json.dumps({'error':str(data[0])})
  conn.close()
if __name__ == '__main__':
    app.run(debug=True)

 

route user – méthode POST,  URI /user

  • Permettre l’ajout de l’utilisateur dans la base de données depuis inscription.html.

Exemple de code serveur

from flask import Flask
from flask_cors import CORS 
from flask import request
#from flaskext.mysql import MySQL
import json
import sqlite3 as sql
app = Flask(__name__)
CORS(app) 

#mysql = MySQL() #app.config['MYSQL_DATABASE_USER'] = 'root' #app.config['MYSQL_DATABASE_PASSWORD'] = '' #app.config['MYSQL_DATABASE_DB'] = 'patisserie' #app.config['MYSQL_DATABASE_HOST'] = 'localhost' #app.config['MYSQL_DATABASE_SOCKET'] = '' #mysql.init_app(app)


@app.route('/user', methods=['POST']) 
def ma_fonction(): 
	id = request.values.get('id')
	nom = request.values.get('nom')
	#conn = mysql.connect()
	#cursor = conn.cursor()
	#cursor.execute('insert into gateau values('+id+',"'+nom+'")')
        con = sql.connect("database.db")
        con.row_factory = sql.Row
        cur = con.cursor()
        cur.execute('insert into gateau values('+id+',"'+nom+'")')
        con.commit()
        msg = "Record successfully added"
      except:
         con.rollback()
         msg = "error in insert operation"
      
      finally:         
         con.close()

if __name__ == '__main__':
    app.run(debug=True)