Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Single page application with Java EE/Wildfly: server-side configuration

I want to write an SPA with AngularJS on client side and Java EE on server side. If I understand it correctly, the idea for the frontend is to create a default page (let's call it index.html) and implement routing to exchange parts of this default page. So with every request the default page is loaded and the routing logic replaces its parts depending on context path:

<!-- index.html -->
<html>
    <body>
        <!-- this block is replaced depending on context -->
        <div ng-view></div>
    </body>
</html>

<!-- page one -->
<div>
    <h1>Page One</h1>
    <a href="/specific">Some specific stuff</a>
</div>

<!-- page two -->
<div>
    <h1>Page Two</h1>
</div>

Now, the routing logic could be something like this:

angular.module('myApp', [])
    .config(['$routeProvider', function ($routeProvider) {
        $routeProvider
            .when('/', {templateUrl: 'pages/pageOne.html'})
            .when('/someSpecific', {templateUrl: 'pageTwo.html'})
            .otherwise({redirectTo: '/'});
    }
]);

The question is, how do I couple this with Java EE and a Wildfly server instance? If I declare index.html as the welcome page and do nothing else, the direct calls like http://website.org/someSpecificContext will fail because no page is mapped to the path (and shouldn't be), so no page and no angular code will be loaded. If I make a redirection from every possible subpath to index.html in a servlet filter, then the path information will be lost, so every call will end in the index page. Maybe it's a silly newbie question, but I'm really stuck here and would appreciate any help.

like image 487
hoefling Avatar asked Oct 14 '15 14:10

hoefling


People also ask

How do I deploy a Java Web application in WildFly?

Deploy an application But if you are running a standalone WildFly service, a simple way to deploy your application is to copy your application archive ( war/ear/jar ) into the $JBOSS_HOME/standalone/deployments directory in the server installation. The deployment-scanner subsystem detects the archive and deploys it.

Is WildFly an application server?

WildFly is a Java Enterprise Edition fully featured application server that provides all the necessary features to run a Java web application. WildFly is designed and maintained by Red Hat and was formally known as JBoss AS.

What is WildFly server used for?

WildFly is a popular choice for users and developers worldwide who develop enterprise-capable applications. WildFly, formerly known as JBoss Application Server, is an open source Java EE application server. Its primary goal is to provide a set of vital tools for enterprise Java applications.


1 Answers

I personally use undertow rewrite handler for this. There is unfortunately not a lot of documentation about this feature. You can find info here and also here. You have to basically rewrite those html 5 urls that only Angular knows about, however you have to respond with your server side REST component (I suppose you're using REST) when Angular asks for backend data. My REST resources are under the /api root-path. This is an example of the undertow-handlers.conf file to be placed in the WEB-INF folder:

regex['(.*/order/?.*?$)'] and not regex['(.*/api.*)'] -> rewrite['/index.html']
regex['(.*/billing/?.*?$)'] and not regex['(.*/api.*)'] -> rewrite['/index.html']
like image 171
Franck Avatar answered Sep 29 '22 09:09

Franck