Roep vanaf de server een ander adres aan met AJAX()

Total.js 5 · total5@0.0.19 httprequestsajax Uitgevoerd met Total.js 5

AJAX('METHOD url', [data], [callback]) doet een HTTP-verzoek en geeft je het geparste antwoord. Het is de korte vorm van REQUEST() voor API's die JSON spreken: dezelfde aanroep die jComponent in de browser heeft, zodat de code van de pagina en van de server op elkaar lijken.

Het adres begint met een optionele methode: AJAX('POST [https://example.com/api/'](https://example.com/api/'), data). Zonder methode is het een GET.
data wordt, als het is opgegeven, verzonden als JSON-body. Het verzoek draagt de header x-requested-with: XMLHttpRequest, zodat aan de andere kant $.xhr true is.
Het antwoord wordt geparst op basis van zijn content type: JSON wordt een object, application/x-www-form-urlencoded wordt een object, al het andere komt aan als tekst.
Bij een status van 400 of hoger wordt de promise afgewezen (of krijgt de callback eerst de fout) met de geparste body van het antwoord als fout. Een callback wordt aangeroepen als callback(err, value, response).
Zonder callback geeft het een promise terug.

Gebruik voor XML-antwoorden REQUEST() en verwerk de body zelf: AJAX() is bedoeld voor JSON- en tekstantwoorden.

Het voorbeeld roept routes van dezelfde applicatie aan, waarvan het adres $.hostname('/') geeft, zodat het geen andere server nodig heeft.

controllers/calls.js

exports.install = function() {
	ROUTE('GET /api/hello/', hello);
	ROUTE('POST /api/echo/', echo);
	ROUTE('GET /api/text/', text);
	ROUTE('GET /api/xml/', xml);
	ROUTE('GET /api/fail/', fail);
	ROUTE('GET /calls/', calls);
};

function hello($) {
	$.json({ hello: 'world', xhr: $.xhr });
}

function echo($) {
	$.json({ received: $.body, xhr: $.xhr });
}

function text($) {
	$.plain('plain text');
}

function xml($) {
	$.xml('<a><b>1</b></a>');
}

function fail($) {
	$.invalid('It is wrong');
}

async function calls($) {

	const base = $.hostname('/');
	const out = {};

	out.hello = await AJAX('GET ' + base + 'api/hello/');
	out.nomethod = await AJAX(base + 'api/hello/');
	out.echo = await AJAX('POST ' + base + 'api/echo/', { a: 1 });
	out.text = await AJAX(base + 'api/text/');

	try {
		await AJAX(base + 'api/fail/');
	} catch (err) {
		out.error = err.message || err;
	}

	out.callback = await new Promise(resolve => AJAX(base + 'api/hello/', (err, value, response) => resolve({ err: err, hello: value.hello, status: response.status })));

	out.xml = await Promise.race([
		AJAX(base + 'api/xml/').then(() => 'answered', () => 'rejected'),
		new Promise(resolve => setTimeout(() => resolve('never answered'), 1000))
	]);

	$.json(out);
}