JSF Spring security log out button

How do I convert the following from a link to a button?

<h:outputLink value="#{request.contextPath}/j_spring_security_logout">Logout</h:outputLink>

If I try and add a开发者_如何学Go navigation rule it can't find j_spring_security_logout...

Either use CSS to style the link to look like a button.

<h:outputLink styleClass="button">

with something like

a.button {
    display: inline-block;
    background: lightgray;
    border: 2px outset lightgray;
    cursor: default;
}
a.button:active {
    border-style: inset;
}

or bring in a plain vanilla HTML form:

<form action="#{request.contextPath}/j_spring_security_logout">
    <input type="submit" value="Logout">
</form>

The another solution is:

<p:button value="Logout with spring" outcome="logout"></p:button>

and do not forget to set it.
faces-config.xml

  <navigation-rule>
    <from-view-id>/your/path/index.xhtml</from-view-id>
      <navigation-case>
          <from-outcome>logout</from-outcome>
          <to-view-id>/j_spring_security_logout?faces-redirect=true</to-view-id>
      </navigation-case>
 </navigation-rule>

if you forget to add "?faces-redirect=true",you receive an error.Because you are redirected to "http://localhost/projectNmae/j_spring_security_logout.xhtml".so you should use it

İf you want to use the "p:commandButton" ,you must return to outcome with managedBean.
( return "logout"; )

To any future readers in the same situation as me and if you are using:

• spring-security version >=4
• jsf + primefaces

And you would like to use <p:commandButton> instead of plain vanilla <input> to take advantage of primeface's styleClass for button styling:

to trigger spring-security's default logout endpoint /logout, you can execute the following custom jquery command in the oncomplete attribute of a commandButton:

// One line version
oncomplete="$.ajax('/logout').then(() => {let dest = window.location.origin + '/login.xhtml'; window.location.href = dest; });"

// Explanation
// Send request to spring security's logout end point
$.ajax("/logout").then(
    () => {
        // Your login page destination
        let dest = window.location.origin + "/login.xhtml";
        // Refresh the browser using the login destination
        window.location.href = dest;
    }
);

The logout button will work and look great at the same time :)