Last updated: May 13th, 2020
Next, let's add DYNAMIC_HELLO_WORLD as a new RouteId to MyRouteId like so (in bold):
package org.webpieces.helloworld.web.myapp;
import org.webpieces.router.api.routes.RouteId;
public enum MyRouteId implements RouteId {
HELLO_WORLD, DYNAMIC_HELLO_WORLD
}
Next, let's create our first dynamic route that will capture the {name} that is typed in the url. Modify MyMainRoutes to look like so:
package org.webpieces.helloworld.web.myapp;
import org.webpieces.ctx.api.HttpMethod;
import org.webpieces.router.api.routes.Port;
import org.webpieces.router.api.routes.Routes;
import org.webpieces.router.api.routebldr.DomainRouteBuilder;
import org.webpieces.router.api.routebldr.RouteBuilder;
public class MyMainRoutes implements Routes {
@Override
public void configure(DomainRouteBuilder bldr) {
RouteBuilder b = bldr.getAllDomainsRouteBuilder();
b.addRoute(Port.BOTH, HttpMethod.GET, "/helloworld", "MyMainController.helloWorld", MyRouteId.HELLO_WORLD);
b.addRoute(Port.BOTH, HttpMethod.GET , "/helloworld/{name}/{id}", "MyMainController.dynamicHelloWorld", MyRouteId.DYNAMIC_HELLO_WORLD);
}
}
This new route will match urls like http://localhost:8080/helloworld/dean/123 and http://localhost:8080/helloworld/declan/765 and will capture the name and id that is typed in to be stored in the name and id variables. Next, let's add the dynamicHelloWorld method in the MyMainController class which accepts the name and id variables. However, in this case, we will require the id to be an int. The resulting Controller file is then:
package org.webpieces.helloworld.web.myapp;
import javax.inject.Singleton;
import org.webpieces.router.api.controller.actions.Action;
import org.webpieces.router.api.controller.actions.Actions;
@Singleton
public class MyMainController {
public Action helloWorld() {
return Actions.renderThis();
}
public Action dynamicHelloWorld(String name, int id) {
return Actions.renderThis(
"name", name,
"id", id);
}
}
This means if someone types in the url http://localhost:8080/helloworld/dean/mary, they will get a 404 NOT_FOUND since there will be no page there because mary is not an integer. Finally, let's add the html file with the same name as the method dynamicHelloWorld.html but this time, let's insert *[${name}$ and ${id}$]* so we echo back what was entered into the url:
*[
Hello ${name}$. Your id is ${id}$
]*
Hopefully your DevelopmentServer is still running in which case you can now go to your new route http://localhost:8080/helloworld/dean/892 or http://localhost:8080/helloworld/catalina/444 or any name you like
Congratulations on your first 'dynamic' webpieces page, next we will make our app a bit more persistent so that we save stuff to a database (HERE, we prevent SQL injection attacks)
FOR FUN: Let's perform a common hacker attack. You will notice the example has a script tag with a comment of 'I would put real javascript here'. Let's try to insert html into the name to get more javascript into the page. First, you must understand urls do not allow certain characters. If I want a '/' for instance, I have to send %2F. Webpieces will receive '/' as we decode this for you. So, go to urlencoder.org and type in:
*[]*
The result is %3Cscript%3E%2F%2FMy%20hidden%20javascript%20attack%20%3C%2Fscript%3E%0A so let's create the url and attack trying to insert our script into the website. You can now hit the url http://localhost:8080/helloworld/%3Cscript%3E%2F%2FMy%20hidden%20javascript%20attack%20%3C%2Fscript%3E%0A/5777 Note that since you can see what the hacker typed into 'name', this means his script is not running while the script 'you' added in dynamicHelloWorld.html is running as it doesn't show on the page. All variables from controller passed to the webpage are HTML encoded which prevents the attack. You can also decide to not escape but beware of attacks like this if you do that
Next Persistent Helloworld