More than 1 year has passed since last update.

[Salesforce] Experience CloudのLWRでログアウト処理を実装する

Last updated at 2022-12-02Posted at 2022-12-02

LWR以外でログアウトさせる

Experience Cloudでログアウトさせるには、[/sitePrefix]/secur/logout.jspに遷移させます。
PageReferenceを使ったログアウトは下記になるのですが、Build Your Own (LWR) テンプレートではサポートされません¹。

this[NavigationMixin.Navigate]({
    type: "comm__loginPage",
    attributes: {
        actionName: "logout"
    }
});

basePathからログアウトURLを取得する

LWRではかわりにbasePathからURLを取得します。basePathは/sを含むので、取り除く必要があります。

import { LightningElement, api } from "lwc";
import basePath from "@salesforce/community/basePath";

export default class Logout extends LightningElement {
    get logoutLink() {
        const sitePrefix = basePath.replace(/\/s$/i, "");
        return sitePrefix + "/secur/logout.jsp";
    }
}

<a href={logoutLink}>Logout</a>

javascriptの処理の中でログアウトさせる

上記の方法でstandard__webPageのurlを指定してページ遷移させようとすると、[/sitePrefix]/sが余計についてしまうので正しいURLが指定できません。Navigateのかわりにfetch　apiを使うことでうまく遷移できます。

logoutUrlはgetLogoutUrlを使用することでも取得できます。

import getLogoutUrl from '@salesforce/apex/applauncher.IdentityHeaderController.getLogoutUrl';
import getLoginUrl from '@salesforce/apex/system.Network.getLoginUrl';

fetch apiを使うことでJavaScriptでログアウトさせることができます。

import getLogoutUrl from '@salesforce/apex/applauncher.IdentityHeaderController.getLogoutUrl';

export default class Logout extends LightningElement {
    async logout() {
        const logoutUrl = await getLogoutUrl();
        await fetch(logoutUrl);
        // 上記だけだとページ遷移しないので、ページ遷移する場合はここにページ遷移の処理を入れる
    }
}

参考

https://developer.salesforce.com/docs/atlas.en-us.exp_cloud_lwr.meta/exp_cloud_lwr/get_started_comp_navigation.htm ↩

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up