[Javascript] Funzione Errata procedura

[max1974]

Salve ragazzi ho una funzione per il controllo delle autorizzazioni in apertura pagina che legge le autorizzazioni utente scritte nel db.
Questa qui:

function autor(local,page){
    //controllo se utete abilitato a questa pagina ed il modo di abilitazione
    console.log("step-1a="+local);
  $.ajax({
       url:"php/ajax_aut.php",
       method:"POST",
       data:{pages:local},
       dataType:"json",
       success:function(data){
       //fare controllo pagina che posizione è
       var $posizione=data.posizione;
       var $char=sessionStorage.getItem("Autor")[$posizione-1];
       console.log("step-1b"+$char);
       var $user_mode = "";
       switch($char) {
            case '0'://NON AUTORIZZATO
              $user_mode = 'no-control';
            break;
            case '1'://AUTORIZZATO USER
              $user_mode = 'control-users-user';
            break;
            case '2'://AUTORIZZATO EDITOR
              $user_mode = 'control-users-editor';
            break;
            case '3'://AUTORIZZATO ADMIN
              $user_mode = 'control-users-admin';
            break;
            default:
              $user_mode = 'no-control';
            break;
          }
          console.log("step-1c"+$user_mode);
          if ($user_mode == 'no-control' && page !="index"){
              var notify = Lobibox.notify('error', {
                  title: 'AUTORIZZAZIONE',
                  msg: 'Non sei autorizzato ad accedere a questa pagina, contattare AMMINISTRATORE di Sistema, a breve verrai reindirizzato alla "DASHBOARD"',
                  showClass: 'fadeInDown',
                  hideClass: 'fadeUpDown',
              });
              window.location.href = "#blank";
              setTimeout(function(){
                  window.location.href = "#gest-rfi-dashboard";
              }, notify.$options.delay);
            }
            else {
              return $user_mode;
            }
        }
     });
}

questa funzione la richiamo piu volte dalla pagina stessa in questo modo :

  var grumode = autor("Gruppi","index");
          console.log("step2="+grumode);
          var incmode = autor("Lettere Incarico","index");
          console.log("step2="+incmode);
          var pmmode = autor("Project Manager","index");
          console.log("step2="+pmmode);

a questo punto mi aspetto che stampasse nella console questa sequenza:
step-1a=
step-1b=
step-1c=
step-2=

giusto ????

invece ho questa sequenza
step-1a=
step-2=
step-1b=
step-1c=
ma in questo modo non funziona perche al momento in cui stampa step-2 non ha ancora i dati che mi necessitano che sarebbero queli di ritorno dalla funzione.....
come posso ovviare ???? in cosa sbaglio ???
PS: i valori stampati a video delle variabili nei vari step-1 sono corretti.

 

[max1974]

Help me PLEASE !!!...
è come se la parte di codice...
$.ajax({})
venisse sorvolato o ci mette troppo tempo a rispondere in confronto alla chiamata....e poi viene elaborato successivamente..... BHOOOOOO!!!!!!!
SOLUZIONI & RIMEDI ????

 

[WmbertSea]

Salve, il problema principale sta nella natura stessa di ajax (Asynchronous JavaScript and XML) proprio perché è un sistema asincrono. Questo significa che i dati in risposta vengono trasmessi dal server e ricevuti dal client senza interferire sul resto dello script che invece prosegue in modo parallelo per i fatti suoi. In sostanza la funzione di risposta (quella che definisci per la proprietà success) viene eseguita solo quando si ottiene la risposta dal server ma il resto dello script continua normalmente la sua esecuzione.

Soluzione:

Qualche anno fa, sebbene ajax sia asincrono per definizione, prima della versione jquery 1.8 era possibile forzare una chiamata definendo la proprietà async: false in modo che lo script si interrompesse restando in attesa della risposta. Questo metodo è attualmente deprecato.

La soluzione è usare il meccanismo delle funzioni di callback (familiare nella gestione degli eventi in javascript). Puoi quindi definire una funzione come parametro nella chiamata della funzione principale, in modo che sia lanciata non appena si riceve la risposta ajax. Dovrai quindi impostare le successive chiamate, alla funzione principale, annidandole di volta in volta nelle funzioni di callback... più facile a farsi che a dirsi.

Qui un esempio partendo dal tuo script:

// Funzione principale con chiamata ajax
function autor(local, page, callback) {
    console.log("step-1a=" + local);
    
    $.ajax({
        url: "php/ajax_aut.php",
        method: "POST",
        data: { pages: local },
        dataType: "json",
        success: function(data) {
            /* ... */
            
            console.log("step-1b" + $char);
            
            var $user_mode = "";
            /* ... */
            
            console.log("step-1c" + $user_mode);
            
            if ($user_mode == 'no-control' && page != "index") {
            
            } else {
                callback($user_mode);
            }
        },
        /* ... meglio definire anche error */
        error: function() {
            console.log('Richiesta fallita, qualcosa è andato storto!');
        }
    });
}

// Serie di chiamate annidate con relativi callback, eseguite in sequenza relativamente alle risposte ajax ricevute
autor("Gruppi", "index", function(grumode) {
    console.log("step2=" + grumode);
    
    autor("Lettere Incarico", "index", function(incmode) {
        console.log("step2=" + incmode);
        
        autor("Project Manager", "index", function(pmmode) {
            console.log("step2=" + pmmode);
            
        });
    });
});

Vedi se riesci a combinarci qualcosa, fai sapere