Search code examples
ajaxwickethtmlstateless

Wicket why page expires when opening link in new tab?


I'm building a wicket bootsrap web application with the following specs (from pom.xml):

wicket version: 6.15.0

wicket-bootstrap-core.version: 0.9.3-SNAPSHOT

I have a base page which is the father of my other pages and adds to mark up a horizontal navigation bar on top, with key component:

BootstrapBookmarkablePageLink extends BookmarkablePageLink

This is part of my BasePage.java

public abstract class BasePage extends GenericWebPage<Void> {

private static final long serialVersionUID = 1L;
String username;

public WicketApplication getApp() {
    return WicketApplication.class.cast(getApplication());
}

public BasePage(final PageParameters parameters) {
    super(parameters);

    // Read session data
    cachedUsername = (String)
BasicAuthenticationSession.get().getAttribute("username");

    // create navbar
    add(newNavbar("navbar"));

}

/**
 * @return application properties
 */
public Properties getProperties() {
    return WicketApplication.get().getProperties();
}

/**
 * creates a new {@link Navbar} instance
 *
 * @param markupId
 * The components markup id.
 * @return a new {@link Navbar} instance
 */

protected Navbar newNavbar(String markupId) {
    Navbar navbar = new Navbar(markupId) {
        private static final long serialVersionUID = 1L;

        @Override
        protected TransparentWebMarkupContainer newCollapseContainer(String  
componentId) {
            TransparentWebMarkupContainer container = 
super.newCollapseContainer(componentId);
            container.add(new CssClassNameAppender("bs-navbar-collapse"));
            return container;
        }
    };

    navbar.setPosition(Navbar.Position.TOP);
    // navbar.setInverted(true);

    NavbarButton<Void> myTab = new NavbarButton<Void>(MyPage.class, new  
PageParameters().add("name", "")
            .add("status", "All").add("date", ""), Model.of("My page"));
    NavbarButton<Void> myOtherTab = new NavbarButton<Void>
(MyOtherPage.class, new PageParameters().add("status", "initial")
            .add("date", ""), Model.of("My other page"));


navbar.addComponents(NavbarComponents.transform(
Navbar.ComponentPosition.LEFT, 
myTab, myOtherTab));

    return navbar;
}
}

Then, MyPage renders a filter form, an html table, ajaxbuttons and some links, Some of my components are ajax components:

public class MyPage extends BasePage {
private static final long serialVersionUID = 5772520351966806522L;
@SuppressWarnings("unused")
private static final Logger LOG = LoggerFactory.getLogger(MyPage.class);
private static final Integer DAYS = 270;

private DashboardFilteringPageForm filteringForm;
private CityInitialForm ncForm;
private String CityName;
private String startDate;
private CitysTablePanel citysTable;
private WebMarkupContainer numberOfNodes;

public MyPage(PageParameters parameters) throws ParseException {
    super(parameters);

    // get Citys list from repo
    final List<City> repoCitys = (List<City>) methodToGetCities();

    // select number of nodes
    numberOfNodes = new WebMarkupContainer("numberOfNodes") {
        private static final long serialVersionUID = 5772520351966806522L;
    };
    numberOfNodes.setOutputMarkupId(true);

    ncForm = new CityInitialForm("ncForm");

    // validation
    add(new FeedbackPanel("feedbackPanel")).setOutputMarkupId(true);
    ncForm.getNumberField().setRequired(true);

    ncForm.add(new AjaxButton("ncButton") {
        private static final long serialVersionUID = -6846211690328190809L;

        @Override
        protected void onInitialize() {
            super.onInitialize();
            add(newAjaxFormSubmitBehavior("change"));
        }

        @Override
        protected void onSubmit(AjaxRequestTarget target, Form<?> form) {

            // redirect to other page

        }

        @Override
        protected void updateAjaxAttributes(AjaxRequestAttributes 
attributes) {
            super.updateAjaxAttributes(attributes);
            attributes.getAjaxCallListeners().add(new 
DisableComponentListener(citysTable));
        }

    });

    numberOfNodes.add(ncForm);

    // filters
    CityName = parameters.get("name").toString() == null ? "" : 
parameters.get("name").toString();
    startDate = parameters.get("date").toString();

    filteringForm = new DashboardFilteringPageForm("filteringForm") {
        private static final long serialVersionUID = -1702151172272765464L;
    };

    // initialize form inputs
    filteringForm.setCityName(CityName);
    try {
        filteringForm.setStartDate(new SimpleDateFormat("EE MMM dd HH:mm:ss 
z yyyy", Locale.ENGLISH)
                .parse(getStartDate().equals("") ? 
CortexWebUtil.subtractDays(new Date(), DAYS).toString() : getStartDate()));
    } catch (Exception e) {
        setResponsePage(SignInPage.class, new PageParameters());
    }

    filteringForm.add(new AjaxButton("button") {
        private static final long serialVersionUID = -6846211690328190809L;

        @Override
        protected void onInitialize() {
            super.onInitialize();
            add(newAjaxFormSubmitBehavior("change"));
        }

        @Override
        protected void onSubmit(AjaxRequestTarget target, Form<?> paForm) {
            // retrieve Citys
            filterCitysAjax(target, "All");
        }

        @Override
        protected void updateAjaxAttributes(AjaxRequestAttributes 
attributes) {
            super.updateAjaxAttributes(attributes);
            attributes.getAjaxCallListeners().add(new 
DisableComponentListener(citysTable));
        }

    });

    filteringForm.getCityNameTextField().add(new OnChangeAjaxBehavior() {

        private static final long serialVersionUID = 1468056167693038096L;

        @Override
        protected void onUpdate(AjaxRequestTarget target) {
            try {
                filterCitysAjax(target, "All");
            } catch (Exception e) {
                System.out.println(e.getMessage());
            }

        }

        @Override
        protected void updateAjaxAttributes(AjaxRequestAttributes 
attributes) {
            super.updateAjaxAttributes(attributes);
            attributes.getAjaxCallListeners().add(new 
DisableComponentListener(citysTable));
        }
    });

    // new City link
    AjaxLink<Void> newCityLink = newCityLink("newCity", repoCitys);

    // Citys table
    citysTable = new CitysTablePanel("CitysTable", repoCitys);
    citysTable.setOutputMarkupId(true);

    // add components
    add(filteringForm, newCityLink, numberOfNodes, citysTable);

}


private void filterCitysAjax(AjaxRequestTarget target, String status) {

    methodToFilterResults();

    //  re-render table component 
    CitysTablePanel cityTableNew = new CitysTablePanel("CitysTable", citys);
    cityTableNew.setOutputMarkupId(true);
    cityTableNew.setVisibilityAllowed(true);
    cityTableNew.setVisible(true);
    citysTable.replaceWith(cityTableNew);
    target.add(cityTableNew);
    citysTable = cityTableNew;
    target.appendJavaScript(CortexWebUtil.TABLE_ODD_EVEN_ROWS);

}

private AjaxLink<Void> newCityLink(String string, final List<City> Citys) {

    final AjaxLink<Void> newCityLink = new AjaxLink<Void>(string) {
        private static final long serialVersionUID = -5420108740617806989L;

        @Override
        public void onClick(final AjaxRequestTarget target) {
                numberOfNodes.add(new AttributeModifier("style", 
"display:block"));
                target.add(numberOfNodes);
        }
    };

    // new City image
    Image newCityImage = new Image("newCityIcon", new 
ContextRelativeResource("/img/new_City_icon.png"));
    add(newCityLink);
    newCityLink.add(newCityImage);

    return newCityLink;

}

}

So MyPage works but when I open MyOtherPage Link in an a new tab and trigger an ajax component in MyPage (e.g the AjaxButton) then I get the page expirtaion error.

Why is that happening? Do I need to use stateless pages? ( stateless link )

Why would it be so ard in wicket to open links in new tabs and use ajax components? I must be missing sometthing..


Solution

  • Here are few possible reasons:

    • MyPage fails to serialize

      Wicket stores stateful pages in page storage (in the disk, by default). Later when you click a stateful link Wicket tries to load the page. First it looks in the http session where the page is kept in its live form (i.e. not serialized). If it is not found there then Wicket looks in the disk. Wicket keeps only the page(s) used in the last user request in the Http Session (to keep memory footprint small). By clicking on MyOtherPage link you put an instance of MyOtherPage in the Http session and the old instance (of MyPage) is only in the disk. But: if MyPage fails to serialize to byte[] then it cannot be stored in the disk and thus later requests will fail with PageExpiredException.

      Todo: Check your logs for NotSerializableException with nice debug message of the reason.

    • MyOtherPage is too big

      By default Wicket writes up to 10M per user session in the disk. If MyPage is let's say 2M and MyOtherPage is 9M (both sizes are quite big, but I don't know what happens in your app...) then saving MyOtherPage will remove MyPage from the disk. Later attempts to load MyPage will fail with PageExpiredException.

      Todo: Review your usage of Wicket Models.