Angular 5 resource not found when going to specific route.

[javadevmtl]

Hi running vertx 3.5.0

I have all the angular static resources in webroot and I can server the page no problem...

But for example when we click a link "TODOS" on the UI the URL switches to the TODOs page of the app, the URL also becomes http://localhost/TODOS but the moment you refresh it displays RESOURCE NOT FOUND, because the browser is now trying to fetch TODOS obviously that doesn't exist.

This is the whole application...

public class AdminUIRestVerticle extends RestApiVerticle {

    @Override
    public void start(Future<Void> future) throws Exception {
        super.start();

        final Router router = Router.router(vertx);
        // Body handler
        router.route("/*").handler(StaticHandler.create());

        String host = config().getString("address", "0.0.0.0");
        int port = config().getInteger("port", 8080);

        // create HTTP server and publish REST service
        createHttpServer(router, host, port)
                .setHandler(future.completer());
    }
}

[Johannes Schüth]

Hi,

for that kind of routing in an angular 5 app you need to also serve the index.html file for all those requests. Otherwise the generated links are not bookmarkable.

I just send the index.html file this way:

--snip-- route("/*").method(GET).handler(rh -> { rh.response().sendFile("./demo/dist/index.html"); }); --snap--

See https://github.com/gentics/mesh/blob/1e0e81035632494eab737493a8da4c62fc57dd9d/demo/src/main/java/com/gentics/mesh/demo/verticle/DemoAppEndpoint.java#L43 how I use it in my App.

Greetings,

Johannes

[John Smith]

Ok I have my build pushing to webroot so I guess I can just push the one from there??? 

--
You received this message because you are subscribed to a topic in the Google Groups "vert.x" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/vertx/3gm75Yh6rkI/unsubscribe.
To unsubscribe from this group and all its topics, send an email to vertx+unsubscribe@googlegroups.com.
Visit this group at https://groups.google.com/group/vertx.
To view this discussion on the web, visit https://groups.google.com/d/msgid/vertx/94b889a5-20c1-4cc4-995e-0173d57c69ee%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

[John Smith]

Yeah that works for me thanks!

[Paulo Lopes]

Hi, I'd recommend to add a slightly different handler that returns a redirect code instead:

set the "location" header pointing to the index.html or the main html page and return a 302 status code. This would tell browsers to go to the right place and will not polute your browser cache which could store different copies of your application on different paths and introduce behavior changes when some paths get updates to new code.

[John Smith]

Have the example for that? Thanks.

--

You received this message because you are subscribed to a topic in the Google Groups "vert.x" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/vertx/3gm75Yh6rkI/unsubscribe.
To unsubscribe from this group and all its topics, send an email to vertx+unsubscribe@googlegroups.com.
Visit this group at https://groups.google.com/group/vertx.

To view this discussion on the web, visit https://groups.google.com/d/msgid/vertx/163f8467-ade6-4c01-93b1-1098589800bb%40googlegroups.com.

[John Smith]

I did this...

Is it ok?

    protected void rediret(RoutingContext rc) {

        rc.response().putHeader("Location", "/index.html").setStatusCode(302).end();

    }

[John Smith]

Sorry did this...

router.route("/*").handler(StaticHandler.create());
router.route("/*").  handler(this::rediretHandler);

and

protected void rediretHandler(RoutingContext rc) {

    rc.response().putHeader("Location", "/index.html").setStatusCode(302).end();
}

Is that right?

[javadevmtl]

Yeah the redirect way doesn't work for me so far...  I use the send file method and it works. I can browse TODOS, The redirect way always send me back to index.html which renders the main page over and over.

[javadevmtl]

This works also...

protected void rediretHandler(RoutingContext rc) {
   System.out.println("Here: " + rc.currentRoute().getPath());

    rc.response().putHeader("Location", rc.currentRoute().getPath()).setStatusCode(302).end();
}

And doesn't make extra requests to the servers. Is that the desired effect?

[javadevmtl]

This seems even more desirable as an effect? And it preserves the path on the browser.

protected void rediretHandler(RoutingContext rc) {

   System.out.println("Heressss: " + rc.request().path());

    rc.response().putHeader("Location", rc.request().path()).setStatusCode(304).end();
}

[Paulo Lopes]

304 is more suited for caching purposes as it states that the resouce has not been modified since the last access. I don't think you should be using that status code...

[John Smith]

ok but setting location to / and 302 always erases the route in tne browser.

--

You received this message because you are subscribed to a topic in the Google Groups "vert.x" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/vertx/3gm75Yh6rkI/unsubscribe.
To unsubscribe from this group and all its topics, send an email to vertx+unsubscribe@googlegroups.com.
Visit this group at https://groups.google.com/group/vertx.

To view this discussion on the web, visit https://groups.google.com/d/msgid/vertx/a1ed1299-6a80-49bd-b0c5-a6c72ef52915%40googlegroups.com.

[Paulo Lopes]

Ok in that case it might make sense to use ctx,reroute()

On Thursday, February 22, 2018 at 2:57:23 PM UTC+1, javadevmtl wrote:

ok but setting location to / and 302 always erases the route in tne browser.

On Feb 22, 2018 1:58 AM, "Paulo Lopes" <pml...@gmail.com> wrote:

304 is more suited for caching purposes as it states that the resouce has not been modified since the last access. I don't think you should be using that status code...

On Thursday, February 22, 2018 at 2:46:08 AM UTC+1, javadevmtl wrote:

This seems even more desirable as an effect? And it preserves the path on the browser.

protected void rediretHandler(RoutingContext rc) {

   System.out.println("Heressss: " + rc.request().path());

    rc.response().putHeader("Location", rc.request().path()).setStatusCode(304).end();
}

On Wednesday, 21 February 2018 20:27:00 UTC-5, javadevmtl wrote:

This works also...

protected void rediretHandler(RoutingContext rc) {
   System.out.println("Here: " + rc.currentRoute().getPath());

    rc.response().putHeader("Location", rc.currentRoute().getPath()).setStatusCode(302).end();
}

And doesn't make extra requests to the servers. Is that the desired effect?

On Wednesday, 21 February 2018 20:18:06 UTC-5, javadevmtl wrote:

Yeah the redirect way doesn't work for me so far...  I use the send file method and it works. I can browse TODOS, The redirect way always send me back to index.html which renders the main page over and over.

--
You received this message because you are subscribed to a topic in the Google Groups "vert.x" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/vertx/3gm75Yh6rkI/unsubscribe.

To unsubscribe from this group and all its topics, send an email to vertx+un...@googlegroups.com.

[John Smith]

Do you have an example of thay? What does reroute do?

To unsubscribe from this group and all its topics, send an email to vertx+unsubscribe@googlegroups.com.

Visit this group at https://groups.google.com/group/vertx.

To view this discussion on the web, visit https://groups.google.com/d/msgid/vertx/fbd00664-458b-4b5a-b663-c24e9e076cd9%40googlegroups.com.

[John Smith]

Do i use it in conjuction with 302 and location /

Or in the route "/*" handler just do rc.reroute("index.html")???

[John Smith]

Ok this works...

router.route("/*").handler(StaticHandler.create());

router.route("/*").handler(rc -> {
    rc.reroute("index.html");
});

Behaves like if "ng serve" (node.js) was serving. It even knows when to return 304 or 302 on it's own.

[Paulo Lopes]

Hi,

Sorry for the short anwsers before as I was replying on a rush. So what reroute does is a internal redirect by simulating a restart of the request to a given path (only path, query strings are not considered), then since the file index.html is served by the static handler it will use the browser cache headers to validate the browser cache age and return appropriately, so that is why you get the correct status as you say ng serve does ;)