CODEWITHSUNDEEP
springspring-bootvaadin
Johannes Dorn
Johannes Dorn

Reputation: 1357

How do i show a Vaadin UI for 404 errors with Spring Boot?

I am trying to show a Vaadin rendered page to users who encounter a 404 (or other) error in my Spring Boot application.

In particular, i want to serve this page when the URL does not match any UI. I have multiple UIs all mapped to their own path, if the user visits a path that does not belong to a UI, the 404 page should be served.

I've tried a very simple approach were i defined a UI which is mapped to "/error":

@Widgetset("server.AeriWidgetset")
@SpringUI(path = "/error")
public class ErrorUI extends UI {

    @Override
    protected void init(VaadinRequest request) {
        Label lblError = new LabelBuilder().withValue("This is an error").build();

        VerticalLayout layout = new MVerticalLayout().with(lblError).withMargin(true);
        setContent(layout);
    }
}

When triggering a 404 error, the init() method is called but i only get the following output in the browser, which 

{"v-uiId":4,"uidl":"{\"Vaadin-Security-Key\":\"118c54bc-5ce8-421a-9103-d71e11bf40d9\",\"syncId\": 0, \"resynchronize\": true, \"clientId\": 0, \"changes\" : [[\"change\",{\"pid\":\"39\"},[\"0\",{\"id\":\"39\",\"location\":\"http:\\/\\/localhost:9002\\/asd\"}]]], \"state\":{\"39\":{\"localeServiceState\":{\"localeData\":[{\"name\":\"de_DE\",\"monthNames\":[\"Januar\",\"Februar\",\"März\",\"April\",\"Mai\",\"Juni\",\"Juli\",\"August\",\"September\",\"Oktober\",\"November\",\"Dezember\"],\"shortMonthNames\":[\"Jan\",\"Feb\",\"Mär\",\"Apr\",\"Mai\",\"Jun\",\"Jul\",\"Aug\",\"Sep\",\"Okt\",\"Nov\",\"Dez\"],\"shortDayNames\":[\"So\",\"Mo\",\"Di\",\"Mi\",\"Do\",\"Fr\",\"Sa\"],\"dayNames\":[\"Sonntag\",\"Montag\",\"Dienstag\",\"Mittwoch\",\"Donnerstag\",\"Freitag\",\"Samstag\"],\"firstDayOfWeek\":1,\"dateFormat\":\"dd.MM.yy\",\"twelveHourClock\":false,\"hourMinuteDelimiter\":\":\",\"am\":null,\"pm\":null}]},\"theme\":\"aeri\",\"height\":\"100.0%\",\"width\":\"100.0%\",\"registeredEventListeners\":[\"clientConnectorDetach\"]},\"40\":{\"spacing\":true,\"childData\":{\"41\":{\"alignmentBitmask\":5,\"expandRatio\":0}},\"marginsBitmask\":15,\"width\":\"100.0%\"},\"41\":{\"text\":\"This is an error\",\"width\":\"100.0%\"}}, \"types\":{\"39\":\"0\",\"40\":\"1\",\"41\":\"2\"}, \"hierarchy\":{\"39\":[\"40\"],\"40\":[\"41\"]}, \"rpc\" : [], \"meta\" : {\"repaintAll\":true}, \"resources\" : {}, \"typeMappings\" : { \"com.vaadin.ui.UI\" : 3 , \"com.vaadin.server.AbstractClientConnector\" : 4 , \"com.vaadin.ui.AbstractSingleComponentContainer\" : 5 , \"com.vaadin.ui.AbstractComponent\" : 6 , \"com.vaadin.ui.AbstractLayout\" : 7 , \"org.vaadin.viritin.layouts.MVerticalLayout\" : 1 , \"com.vaadin.ui.VerticalLayout\" : 8 , \"com.ctrlflow.aer.server.ui.ErrorUI\" : 0 , \"com.vaadin.ui.Label\" : 2 , \"com.vaadin.ui.AbstractComponentContainer\" : 9 , \"com.vaadin.ui.AbstractOrderedLayout\" : 10 }, \"typeInheritanceMap\" : { \"3\" : 5 , \"5\" : 6 , \"6\" : 4 , \"7\" : 9 , \"1\" : 8 , \"8\" : 10 , \"0\" : 3 , \"2\" : 6 , \"9\" : 6 , \"10\" : 7 }, \"timings\":[1448, 2]}"}

When i go to the error page directly, it renders just fine.

How can i render a 404 or other error pages with Vaadin?

Upvotes: 0

Views: 1603

Answers (1)

p.streef
p.streef

Reputation: 3815

You can do this by using a navigator.

Something like:

@Autowired
private SpringViewProvider viewProvider;

@Autowired
ErrorView errorView; //public class ErrorView extends VerticalLayout implements View 

...

Navigator nav = new Navigator(UI.getCurrent(),viewContainer);
nav.addProvider(viewProvider);
nav.setErrorView(errorView);

for a fully working solution check out the quicktickets demo -- (github)

Upvotes: 0

Related Questions