Gestire richieste ajax in Laravel

Oggi vediamo come fare ad inviare delle richieste ajax nel framework Laravel. Essendo un argomento molto specifico darò per scontato alcune cose che già sai, come ad esempio il funzionamento di Laravel stesso ed, in generale del pattern MVC, oltre alla struttura di una generica richiesta Ajax.

Prerequisiti

  • Conoscenze del Framework Laravel e del pattern MVC
  • Sintassi JQuery
  • Richieste Ajax

La creazione delle Routes

Iniziamo dal definire le routes che ci serviranno per modellare la richiesta. Fondamentalmente abbiamo bisogno di 2 routes, una in GET mostrerà la view da cui effettuare la richiesta (e su cui stampare i risultati) ed una POST che invierà la richiesta. Le Routes sono le seguenti:

1
2
Route::get('ajax', 'HomeController@ajaxRequest');
Route::post('ajax', 'HomeController@ajaxResponse');

Il controller

A questo punto il nostro HomeController sarà costuito, tra le altre, da una funzione ajaxRequest() che mostra la view da cui effettuare la richiesta Ajax (come ad esempio una form di registrazione), e da una funzione ajaxResponse() che processa la richiesta e ritorna il risultato della stessa. Il nostro Homecontroller.php sarà così definito:

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
namespace App\Http\Controllers;

use Illuminate\Http\Request;

class HomeController extends Controller

{

// ....

public function ajaxRequest()

{

return view('ajaxRequest');

}

public function ajaxRequestPost(Request $request)

{

$response = array(
'status' => 'success',
'msg' => $request->message,
);
return response()->json($response);

}

}

 

La view

Ultimo step, andiamo a creare la view che si interfaccia con l’utente, ajaxRequest.blade.php

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
<!DOCTYPE html>

<html>

<head>

<title>Laravel Ajax Request</title>

<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">


<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

<meta name="csrf-token" content="{{ csrf_token() }}" />

</head>

<body>

<div class="container">

<p> Bla Bla Bla.... </p>

<form action="" method="post">

<div class="form-group">

<label for="name">Name:</label>

<input type="text" name="name" id="name" class="form-control" placeholder="Nome" required="">

</div>

<div class="form-group">

<label for="password">Password:</label>

<input type="password" name="password" id="password" class="form-control" placeholder="Password" required="">

</div>

<div class="form-group">

<label for="email" >Email:</label>

<input type="email" name="email" id="email" class="form-control" placeholder="Email" required="">

</div>

<div class="form-group">

<button class="btn btn-success btn-submit">Invia</button>

</div>

</form>

</div>

</body>

<script type="text/javascript">

$.ajaxSetup({

headers: {

'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')

}

});

$(".btn-submit").click(function(e){

e.preventDefault();

var name = $("input[name=name]").val();

var password = $("input[name=password]").val();

var email = $("input[name=email]").val();

var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');

$.ajax({

type:'POST',

url:'/ajaxRequest',

data:{ _token: CSRF_TOKEN, , name:name, password:password, email:email},

success:function(data){

console.log(data.success);

}

});

});

</script>

</html>

Ricordiamoci di caricare la libreria JQuery necessaria ad effettuare la richiesta ed il token di controllo CSRF_TOKENper l’invio dei dati tramite la form, in caso di successo la console.log() ci avvertirà con il messaggio definito all’interno del controller.

 

Lo hai trovato utile? Codividilo con i tuoi follower :)


Creare un Utente da functions.php

In questo articolo vi mostro uno snippet che mi ha salvato la vita diverse volte, ovvero come creare un utente direttamente dal file functions.php del tema.

Soprattutto nell’ambito del restyle di vecchi siti web capita che i nostri clienti non si ricordino i dati di accesso e che l’unico in loro possesso siano le credenziali dell’hosting, oppure non riusciamo più ad accedere al DB. Lo snippet è molto semplice e fa quello che promette: basta includerlo all’interno del file functions.php del tema attivo per creare un nuovo utente attivo all’interno del sito web. Vediamo come funziona:

Creazione dell’utente

Innanzi tutto impostiamo i 3 parametri fondamentali per definire un nuovo utente: username, password ed e-mail, mentre il ruolo può essere assegnato in un secondo momento. Assegnati questi 3 valori la funzione esegue un controllo affinchè non esista già un utente con quello stesso username e con la stessa mail, per evitare sovrapposizioni.

Infatti se è già presente  lo stesso nome o la stessa mail all’interno dell’anagrafica del sito web, la funzione  wp_create_user()  invece di crearne uno nuovo,restituirà l’oggetto WP_ERROR contenente l’errore  “Sorry, that username already exists!“, optiamo quindi per un nome utente ed una mail non utilizzati.

Assegnazione del ruolo all’utente

Fatto questo resta da stabilire quale ruolo utente vogliamo assegnare, se abbiamo bisogno di recuperare (o meglio resettare) alcuni dati di accesso, ovviamente il tipo di utente che ci serve è un amministratore, impostiamo tramite la funzione  set_role() il ruolo ‘administrator’ .

Action Hook

Infine triggeriamo la funzione tramite add_action(‘init’,’dc_createAccount’) in questo modo WordPress eseguirà la funzione prima di disegnare la pagina del sito web.

Di seguito riportiamo lo snippet, pronto per il copia-incolla 🙂

 

LO SNIPPET

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
/**
* Developer Corsaro.it - Create User from functions.php
* Website: https://developercorsaro.it
* cesare@developercorsaro.it
*/


function dc_createAccount(){
$user_name = 'admin';
$password= 'admin';
$email = 'admin@website.it';

// verifico che l'utente non sia già esistente
if ( !username_exists( $user_name ) &amp;&amp; !email_exists( $email ) ) {
$user_id = wp_create_user( $user_name, $password, $email );
$user = new WP_User( $user_id );

// dopo aver creato l'utente assegno il ruolo che voglio,
//in questo caso Administrator
$user-&gt;set_role( 'administrator' );
}

}
add_action('init','dc_createAccount');

Ok abbiamo fatto!

Se tutto è andato bene andando nella pagina di login ed inserendo le credenziali, dovremmo poter accedere di nuovo all’amministrazione del sito.

Non dimentichiamoci di togliere il codice da functions.php e di cambiare le credenziali una volta effettuato l’accesso  🙂

Lo hai trovato utile? Codividilo con i tuoi follower :)