- Lucru cu csrf_token care expira

Ajax (Asynchronous JavaScript and XML) permite aplicatiei web din browser sa trimita si sa primeasca date de la server in mod asincron, fara sa reincarce pagina.
Ajax foloseste JavaScript pe partea de client (in browser) si un script pe partea de server (in acest caz PHP) care primeste cererea Ajax si trimite un raspuns inapoi la JavaScript.

Cand se trimit cereri POST /PUT /DELETE la framework-ul Laravel, acesta verifica un "csrf_token" care este un sir generat automat de Laravel.
Astfel, cand construiti aplicatii Ajax cu Laravel, trebuie sa atasati sirul CSRF la fiecare apel POST, ca o valoare in datele transmise cu POST, sau intr-un header trimis serverului.
Functia csrf_token() returneaza sirul CSRF. Pentru a-l folosi in scriptul Ajax, adaugati, spre exemplu, "csrf_token" intr-o variabila JavaScript, in sectiunea HEAD a fisierului template:
<head>
<title>Page Title</title>
<script>
var csrf_token ='{{csrf_token()}}';
</script>
</head>
Apoi, puteti adauga valoarea variabilei csrf_token in apelul Ajax.

- Pentru a adauga "csrf_token" in datele POST, atasati-l la numele "_token" in datele trimis catre server:
function ajax(){
  var req = (window.XMLHttpRequest) ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');  // XMLHttpRequest object
  var data ='_token='+ csrf_token;
  //...
}
- Sau trimiteti 'csrf_token' intr-un header cu "X-CSRF-TOKEN":
function ajax(){
  var req = (window.XMLHttpRequest) ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');  // XMLHttpRequest object

  req.open('POST', 'ajax/send', true); // set the request

  //adds headers
  req.setRequestHeader('Content-type', 'application/x-www-form-urlenecodd');
  req.setRequestHeader('X-CSRF-TOKEN', '{{csrf_token()}}');
  //...
}
- Cu jQuery:
headers: {
  'X-CSRF-TOKEN': '+ csrf_token
},

Exemplu Laravel - Ajax

1. Creati un fisier view: resources/views/test_ajax.blade.php si copiati codul urmator in acest fisier.
<!doctype html>
<html lang="en">
<head>
<title>Laravel Ajax Test Example</title>
<script>
var csrf_token ='{{csrf_token()}}';
</script>
</head>
<body>
<h1>Laravel Ajax Test Example</h1>
<div id='see_resp'>
Acest mesaj va fi inlocuit cu un raspuns Ajax. Un array JSON trimis de la server.<br>
Apasati pe buton pentru a inlocui mesajul.
</div>
<button id='btn_ajax'>Test Ajax</button>

<script>
var see_resp = document.getElementById('see_resp');

//sends data to server, via POST, and displays the received answer
function ajaxReq(){
  var req = (window.XMLHttpRequest) ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');  // XMLHttpRequest object

  //pairs index=value with data to be sent to server (including csrf_token)
  var data ='_token={{csrf_token()}}&id=1';

  req.open('POST', 'ajax/send', true); // set the request

  //adds header for POST request
  req.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');

  req.send(data); //sends data

  // If the response is successfully received, will be added in #see_resp
  req.onreadystatechange = function(){
    if(req.readyState ==4){
//    alert(req.responseText); //just for debug
      see_resp.innerHTML = req.responseText;
    }
  }
}

//register click event on #btn_ajax
document.getElementById('btn_ajax').addEventListener('click', ajaxReq);
</script>
</body>
</html>
Daca folositi jQuery, schimbati codul din elementul <script> care e inainte de </body> cu acest script jQuery:
<script>
function ajaxReq(){
  $.ajax({
    type:'POST',
    url:'/ajax/send',
    headers: {
      'X-CSRF-TOKEN': csrf_token
    },
    data:'id='+ 1,
    success:function(resp){
      $('#see_resp').html(JSON.stringify(resp));
    }
  });
}

$('#btn_ajax').on('click', ajaxReq);
</script>
2. Acum vom crea un controller numit AjaxController. Copiati urmatorul cod in fisierul app/Http/Controllers/AjaxController.php.
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;

class AjaxController extends Controller {

  //Responds to requests to /ajax
  //returns view() response
  public function index(Request $request){
    return view('test_ajax');
  }

  //Responds to post requests to /ajax/send
  //receives the $request instance
  //returns response with a JSON array, with input id, and Laravel version
  public function send(Request $request){
    //if required fields are received, and not empty
    if($request->has(['id']) && $request->id!=null){
      global $app;
      return response()->json(['id'=>$request->id, 'version'=>$app::VERSION]);
    }
    else return 'Not valid id.';
  }
}
3. Pentru a fixa Rutele, adaugati urmatoarele linii in routes/web.php.
//shows the ajax test page
Route::get('/ajax', 'AjaxController@index');

//when ajax request
Route::post('/ajax/send', 'AjaxController@send');
4. Accesati urmatoarea adresa URL pentru a testa acest exemplu.
//localhost:8000/ajax
- Va afisa o pagina cu un continut ca in acest Demo:
Laravel Ajax Test Example
Acest mesaj va fi inlocuit cu un raspuns Ajax. Un array JSON trimis de la server.
Apasati pe buton pentru a inlocui mesajul.

Lucru cu csrf_token care expira

Ca sa pastrati o pagina activa cu Ajax mai mult de 120 de minute (care este durata implicita a sesiunii Laravel), trebuie sa reinitializati valoarea csrf_token in javascript, deoarece si acel token va expira.
- Spre exemplu, puteti folosi acest script care obtine si stocheaza in JavaScript sirul 'csrf_token' la fiecare 30 de minute.

1. In fisierul view:
<script>
//Laravel csrf_token used in Ajax requests
var csrf_token ='{{csrf_token()}}';

//get csrf_token from Laravel
function getCsrf(){
  var req = (window.XMLHttpRequest) ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');  // XMLHttpRequest object

  req.open('POST', '/ajax/getcsrf', true); // set the request

  //adds header for POST request
  req.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
  req.setRequestHeader('X-CSRF-TOKEN', csrf_token);

  req.send('_token={{csrf_token()}}'); //sends csrf_token

  // If the response is successfully received, sets csrf_token
  req.onreadystatechange = function(){
    if(req.readyState ==4){
      var resp = JSON.parse(req.responseText);
      if(resp.csrf) csrf_token = resp.csrf;
    }
  }
}

//calls getCsrf() every 30 mintes
window.setInterval(getCsrf, 30*60*1000);
</script>
- Sau cu jQuery:
<script>
//Laravel csrf_token used in Ajax requests
var csrf_token ='{{csrf_token()}}';

//get csrf_token from Laravel
function getCsrf(){
  $.ajax({
    type:'POST',
    url:'/ajax/getcsrf',
    headers: {
      'X-CSRF-TOKEN': csrf_token
    },
    data:'_token='+ csrf_token,
    success:function(resp){
      if(resp.csrf) csrf_token = resp.csrf;
    }
  });
}

//calls getCsrf() every 30 minutes
window.setInterval(getCsrf, 30*60*1000);
</script>
2. In routes/web.php adaugati acest Route:
//ajax request for csrf_token. Returns json array with csrf_token value
Route::post('/ajax/getcsrf', function(){
  return response()->json(['csrf'=>csrf_token()]);
});
- De asemenea, puteti sa mariti durata sesiunii schimband valoarea cheii 'lifetime' in fisierul config/session.php.

Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Care tag HTML5 defineste un text marcat, evidentiat?
<mark> <embed> <span>
<p>Cursuri graruite: <mark>MarPlo.net</mark> , jocuri, anime.</p>
Ce pseudo-clasa CSS defineste un stil la element cand mouse-ul e deasupra lui?
:focus :hover :active
a:hover {
  font-weight: bold;
  color: #00da01;
}
Clic pe functia ce returneaza un sir cu un numar rotunjit la x decimale.
toPrecision(x) toFixed(x) floor(x)
var num = 12.34567;
num = num.toFixed(2);
alert(num);       // 12.35
Indicati functia PHP care adauga continutul unui fisier intr-un array.
[) file() readfile()
$arr = file("a_file.txt", FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES);
var_export($arr);
Clic pe raspunsul potrivit la intrebarea: "What time is it?"
On the 7th of July 1996 It is a quarter to 5. Nice weather.
What time is it? It is a quarter to 5.
- Cat este ora? E 5 fara un sfert.
Indicati raspunsul potrivit la intrebarea: "¿Qué hora es?"
Hace buen tiempo. En el 7 de julio de 1996 Son las tres menos cuarto.
¿Qué hora es? Son las tres menos cuarto.
- Cat este ora? E 3 fara un sfert.
Laravel Ajax tutorial

Last accessed pages

  1. Scriere scripturi PHP elementare (1576)
  2. Conditional IF in Limba Engleza - Fraze Conditionale (20736)
  3. Curs PHP MySQL, Tutoriale si Scripturi PHP (6659)
  4. Espanol Chistes - Glume, Bancuri (877)
  5. Sintaxa JavaScript (2435)

Popular pages this month

  1. Gramatica limbii engleze - Prezentare Generala (2144)
  2. Prezentul simplu si continuu - Present Tense Simple and Continuous (1480)
  3. Cursuri si Tutoriale: Spaniola, Engleza, HTML, CSS, Php-Mysql, JavaScript, Ajax (1072)
  4. Trecutul simplu si continuu - Past Tense Simple and Continuous (1025)
  5. Prezent perfect si Prezent perfect continuu - Present perfect and Continuous (981)