Créé en 2021 et modifié le 10 Mar 2022

Créé en 2021 et modifié le 10 Mar 2022

Créé en 2021 et modifié le 10 Mar 2022

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://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></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)