Implementare richieste Ajax e JSONP con PhoneGap

Pubblicato il 14 Maggio 2018

In questo breve tutorial vedremo come implementare richieste Ajax e JSONP con PhoneGap. Le richieste ci torneranno utili per tutte le trasmissioni dati che dovranno avvenire tra l’applicazione mobile che stiamo sviluppando con PhoneGap e il server con cui gestiamo le operazioni backend.

Per implementare le richieste nella nostra applicazione mobile utilizzeremo jQuery mentre, la parte backend, la implementeremo in PHP. Vediamo subito una richiesta Ajax con metodo POST:

$.post('http://your_url/file.php', { name: encodeURIComponent(name) }, function (data) {

    data = JSON.parse(data);

    alert("Response: " + data.response);

});

Il codice PHP è il seguente:

//Operations
header('content-type: application/json; charset=utf-8');
echo json_encode(array('response' => 'ok'));

Vediamo adesso una richiesta JSONP con il metodo getJSON:

$.getJSON("http://your_url/file.php?format=json&name=" + encodeURIComponent(name) + "&callback=?", function (data) {

    alert("Response: " + data.response);

});

Il codice PHP è il seguente:

//Operations

$arr = array(
    'response' => 'ok'
);

header('content-type: application/json; charset=utf-8');
echo $_GET['callback'] ."(" .json_encode($arr) .")";

Non dobbiamo dimenticare una cosa fondamentale quando si lavora con PhoneGap: per implementare le richieste dobbiamo inserire nel file config.xml i plugin core necessari. In particolare inappbrowser e whitelist.

E’ tutto! Per non perdere i prossimi articoli ricorda che puoi iscriverti gratuitamente alla newsletter tramite il box qui a destra 😉

Autore: emawebdesign

Full Stack Developer, SEO Specialist, esperto della trasformazione digitale con oltre 20 anni di esperienza.

Pubblicato in: