react routing is able to handle different url path but tomcat returns 404 not available resources

Question

I am new in reactjs and I have a little project in reactjs to play with and learn it. I need to have to type of headers which will be shown based o

Answer 1

I think an answer to the OP's question should address also the access to static resources via the default servlet.

In my understanding the problem appears in multi-view React applications where a Router is used to alter the page URL in order to reflect the state of the application. This is nice, but if you reload the page by accident you get 404 since there won't be any resource matching the altered URL. It also means such altered URLs can't be bookmarked as direct access to different application views. Unless, we get a little help from the server side.

There are more solutions possible, depending on how the access to static resources is handled, or the chosen implementation (filter, servlet or even JSP), but the basic idea is to serve the main application HTML file for every Routes defined in React.

Supposing you have you have two React Routes defined in your application:

You could create a RouterServlet to forward requests to /view1 or /view2 back to the context root (/), supposing you mapped the application here.

void doGet(HttpServletRequest request, HttpServletResponse response) 
        throws ServletException, IOException 
{
    request.getServletContext().getRequestDispatcher("/").forward(request, response);
}

You can configure it like this:

    RouterServlet
    package.RouterServlet


    RouterServlet
    /view1/*


    RouterServlet
    /view2/*