De Javascript router is in staat om Javascript code te genereren om routing af te handelen van Javascript dat client side draait terug naar je applicatie. De Javascript router helpt bij het refactoren van uw applicatie. Als je de structuur van je URL’s of parameternamen verandert, wordt je Javascript automatisch aangepast om die nieuwe structuur te gebruiken.

§Het genereren van een Javascript router

De eerste stap in het gebruik van Play’s Javascript router is het genereren ervan. De router zal alleen de routes blootleggen die je expliciet declareert, waardoor de grootte van de Javascript code wordt geminimaliseerd.

Er zijn twee manieren om een Javascript router te genereren. De ene is om de router in te bedden in de HTML pagina met behulp van template directives. De andere is het genereren van Javascript bronnen in een actie die kan worden gedownload, gecached en gedeeld tussen pagina’s.

§Embedded router

Een embedded router kan worden gegenereerd met behulp van de @javascriptRouter directive binnen een Twirl template. Dit wordt typisch gedaan binnen het hoofddecoratiesjabloon.

@()(implicit request: play.mvc.Http.Request)@helper.javascriptRouter("jsRoutes")( routes.javascript.Users.list, routes.javascript.Users.get)

De eerste parameter is de naam van de globale variabele waarin de router zal worden geplaatst. De tweede parameter is de lijst van Javascript routes die in deze router moeten worden opgenomen.

§Router resource

Een router resource kan worden gegenereerd door een actie te maken die de router generator aanroept. Het heeft een vergelijkbare syntaxis als het insluiten van de router in een template:

import play.mvc.Http;import play.routing.JavaScriptReverseRouter;import play.mvc.Controller;import play.mvc.Result;

public Result javascriptRoutes(Http.Request request) { return ok(JavaScriptReverseRouter.create( "jsRoutes", "jQuery.ajax", request.host(), routes.javascript.Users.list(), routes.javascript.Users.get())) .as(Http.MimeTypes.JAVASCRIPT);}

Voeg vervolgens de corresponderende route toe:

GET /javascriptRoutes controllers.Application.javascriptRoutes(request: Request)

Als je deze actie hebt geïmplementeerd, en aan je routes bestand hebt toegevoegd, kun je het vervolgens als een resource in je templates opnemen:

<script type="text/javascript" src="@routes.Application.javascriptRoutes"></script>

§Gebruik maken van de router

Gebruik makend van jQuery als voorbeeld, is het maken van een oproep zo simpel als:

$.ajax(jsRoutes.controllers.Users.get(someId)) .done( /*...*/ ) .fail( /*...*/ );

De router maakt ook een paar andere eigenschappen beschikbaar, waaronder de url en de type (de HTTP methode). Bijvoorbeeld de bovenstaande oproep aan jQuery’s ajax functie kan ook worden gemaakt als:

var r = jsRoutes.controllers.Users.get(someId);$.ajax({url: r.url, type: r.type, success: /*...*/, error: /*...*/ });

De bovenstaande aanpak is nodig wanneer andere eigenschappen moeten worden ingesteld, zoals succes, fout, context etc.

De absoluteURL en de webSocketURL zijn methoden (geen eigenschappen) die de volledige url string retourneren. Een Websocket verbinding kan worden gemaakt zoals:

var r = jsRoutes.controllers.Users.list();var ws = new WebSocket(r.webSocketURL());ws.onmessage = function(msg) { /*...*/};

§jQuery ajax methode ondersteuning

Note: Ingebouwde ondersteuning voor jQuery’s ajax functie zal worden verwijderd in een toekomstige release. Dit gedeelte over de ingebouwde ondersteuning is alleen bedoeld als referentie. Gebruik de ajax-functie van de router niet in nieuwe code en overweeg bestaande code zo snel mogelijk te upgraden. In het vorige gedeelte over het gebruik van de router wordt beschreven hoe jQuery moet worden gebruikt.

Als jQuery niet jouw ding is, of als je de ajax-methode van jQuery op de een of andere manier wilt verfraaien, kun je de router een functie geven die wordt gebruikt om ajax-query’s uit te voeren. Deze functie moet het object accepteren dat wordt doorgegeven aan de ajax router methode, en moet verwachten dat de router de type en url eigenschappen erop heeft ingesteld op de juiste methode en url voor het router request.

Om deze functie te definiëren, geef je in je actie de ajaxMethod methode parameter door, bijv:

JavaScriptReverseRouter.create( "jsRoutes", "myAjaxMethod", request.host(), routes.javascript.Users.list(), routes.javascript.Users.get())

Volgende: Ingebedde routerings-DSL