Autenticazione in jQuery Mobile e PhoneGap

Question

Ho un'applicazione Web creata con jQuery Mobile e PHP (framework CodeIgniter). Ora sto cercando di creare anche una versione PhoneGap per renderla distribuibile come app standalone. Tuttavia, l'app Web PHP. la versione utilizza Ion Auth, un plugin CodeIgniter per l'autenticazione. Pertanto, quando si accede a una pagina che richiede l'autenticazione, l'app reindirizza al metodo di accesso del controller di autenticazione. E dopo l'autenticazione, ti reindirizza alla home page (la pagina jQuery Mobile in questo caso). Questo funziona bene nell'app Web., Poiché la home page viene aperta dal controller di casa in primo luogo comunque.

Ma ecco il punto cruciale: nella versione PhoneGap, la pagina "home" deve essere il file index.html in PhoneGap. Apparentemente puoi caricare un altro url all'avvio aggiungendo un valore in PhoneGap.plist, ma questo non è accettabile da Apple per l'invio all'app store. E se faccio un redirect nel autenticazione, non posso tornare al file index.html dopo l'autenticazione ...

Quindi, come si dovrebbe fare per l'autenticazione in un PhoneGap/jQuery Mobile app?

UPDATE:

Ho provato questo secondo una delle risposte, ma l'applicazione cerca ancora di accedere alla pagina dell'account/login (che non esiste), quando voglio fare il login attraverso il POST e restituiscono un valore dal metodo:

$('#login_form').bind('submit', function() { 
     event.preventDefault(); 
     //send a post request to your web-service 
     $.post('http://localhost/app_xcode/account/login', $(this).serialize(), function (response) { 
      //parse the response string into an object 
      var response = response; 
      //check if the authorization was successful or not 
      if (response == true) { 
       $.mobile.changePage('#toc', "slide"); 
      } else { 
       alert('login failed'); 
       $.mobile.changePage('#toc', "slide"); 
      } 
     }); 
    }); 

Ecco il metodo di controllo:

function login() 
    { 
     //validate form input 
     $this->form_validation->set_rules('identity', 'Identity', 'required'); 
     $this->form_validation->set_rules('password', 'Password', 'required'); 

     $base_url = $this->config->item('base_url'); 

     $mobile = $this->detect_mobile(); 
     if ($mobile === false && $base_url != 'http://localhost/app_xcode/') //Only restrict if not developing 
      redirect('account/notAMobile'); 

     else if ($this->form_validation->run() == true) { //check to see if the user is logging in 
      //check for "remember me" 
      $remember = (bool)$this->input->post('remember'); 

      if ($this->ion_auth->login($this->input->post('identity'), $this->input->post('password'), $remember)) { //if the login is successful 
       //redirect them back to the home page 
       $this->session->set_flashdata('message', $this->ion_auth->messages()); 

       echo true; 
       /*redirect($this->config->item('base_url'), 'refresh');*/ 
      } 
      else 
      { //if the login was un-successful 
       //redirect them back to the login page 
       $this->session->set_flashdata('message', $this->ion_auth->errors()); 
       /*redirect('account/login', 'refresh');*/ //use redirects instead of loading views for compatibility with MY_Controller libraries 
      } 
     } 
     else 
     { //the user is not logging in so display the login page 
      //set the flash data error message if there is one 
      $this->data['message'] = (validation_errors()) ? validation_errors() 
        : $this->session->flashdata('message'); 

      $this->data['identity'] = array('name' => 'identity', 
              'id' => 'identity', 
              'type' => 'text', 
              'value' => $this->form_validation->set_value('identity'), 
      ); 
      $this->data['password'] = array('name' => 'password', 
              'id' => 'password', 
              'type' => 'password', 
      ); 

     } 
    } 

credo di aver rimosso o commentato eventuali reindirizzamenti che erano lì. Quindi non so perché cerca di caricare ancora la vista? Ha qualcosa a che fare con jQuery Mobile che cerca di navigare lì perché pubblico su quell'URL?

Answer 1

È possibile effettuare richieste al proprio servizio Web (Autenticazione ionica) dall'app. con jQuery. Il tuo login sarebbe simile a questa:

//add event handler to the `submit` event for your login form 
$('#login_form').bind('submit', function() { 

    //send a post request to your web-service 
    $.post('http://my-domain.com/my-auth/auth.php', $(this).serialize(), function (response) { 

     //parse the response string into an object 
     response = $.parseJSON(response); 

     //check if the authorization was successful or not 
     if (response.status === 'success') { 
      //do login here 
     } else { 
      //do error here 
     } 
    }); 
}); 

$(this).serialize() aggiungerà i dati del form di login alla richiesta posta. Questo esempio presume che il tuo servizio web restituirà JSON.

Answer 2

Hai guardato a PhoneGap Plugin: ChildBrowser (iPhone, Android, altro) e il suo metodo locChanged?

Ho solo app codificate che utilizzano OAuth (Twitter App) e OpenID (AppLaud App) per PhoneGap/Android, ma il plug-in del browser figlio ha ciò che è necessario per quelle. Suoni come Ion Auth può essere simile: dopo auth guidato dal provider, restituisci l'app all'app senza interruzioni.

Answer 3

Il motivo per cui il modulo è ancora in fase di invio e si sta tentando di modificare le pagine è perché si è verificato un errore di sintassi nel gestore di invio JavaScript. Sulla linea due, event non è definito, quindi prova a chiamare gli errori event.preventDefault(). Sebbene il gestore non riesca, il browser invia ancora il modulo utilizzando il valore predefinito action e method.

O modificare la firma della funzione su function(event) { o semplicemente restituire false dalla funzione. Restituire false equivale a prevenire l'impostazione predefinita.

$('#login_form').bind('submit', function() { 

    //send a post request to your web-service 
    $.post('http://localhost/app_xcode/account/login', $(this).serialize(), function (response) { 
     //check if the authorization was successful or not 
     if (response == true) { 
      $.mobile.changePage('#toc', "slide"); 
     } else { 
      alert('login failed'); 
      $.mobile.changePage('#toc', "slide"); 
     } 
    }, 'JSON'); 

    return false; 
});