ErrorScreen

ErrorScreenコンポーネントはエラーを全画面で表示するためのコンポーネントです。

使用上の注意

以下のように、エラーによってユーザーが操作できない状況や、ユーザーに操作させたくない状況で使用してください。

• 存在しないページにアクセスした場合
• ページにアクセスする権限がない場合
• サービスがメンテナンス中の場合
• 一定時間操作がなかった場合
• 予期しないエラーが発生した場合

具体例はエラー別の表示内容に記述しています。

フォームのバリデーションエラーや連携APIの疎通エラーのような一時的なエラーの場合、NotificationBarやResponseMessage、InformationPanelなどを使用を検討します。詳細はフィードバックの基準を参照してください。

レイアウト

ロゴ、タイトル、メッセージ、リンクを表示できます。

ロゴ

デフォルトでSmartHRのロゴが表示されます。特別な理由がない限り、必ずロゴを表示してください。

タイトル

なぜエラーが発生したのかがわかる文言を設定します。

メッセージ

タイトルに補足が必要な場合、メッセージを設定します。

リンク

エラーになったときにユーザーの助けになるようなページへ誘導できる場合はリンクを表示してください。

必要に応じて別タブで開くオプションも設定します。

エラー別の表示内容

存在しないページにアクセスした場合（404 Not Foundエラー）

存在しないページはにアクセスした原因として、ページ自体が移動・削除された可能性やユーザーがURLを間違えている可能性を提示しましょう。プロダクトのホームへ戻るリンクも表示してください。

ページにアクセスする権限がない場合（403 Forbiddenエラー）

ユーザーがページにアクセスする権限をもっていない場合、プロダクトのホームへ戻るリンクを表示します。必要に応じて、管理者へ問い合わせるという対応策を提示してください。

サービスがメンテナンス中の場合（503 Service Unavailableエラー）

サービスがメンテナンス中の場合、SmartHRのメンテナンス・障害のお知らせへのリンクを表示してください。お知らせは、別タブで開くように設定してください。

一定時間操作がなかった場合（401 Unauthorizedエラー）

一定の時間、ユーザーが操作しなかった場合、自動でログアウトしたことがわかるメッセージとログインボタンを表示します。ログインボタンを押せば、再ログインできるようにしてください。

「セッションがタイムアウトしました。」は一般的なユーザーには伝わりにくい表現なので「自動でログアウトしました」を推奨します。

予期しないエラーが発生した場合（500 Internal Server Errorエラーなど）

データの閲覧・作成・更新が安全に実行できない状況の場合、予期しないエラーが発生したメッセージを表示してください。

また、このページに記載されていないその他のエラーをまとめて扱う場合にも、以下の表示内容を使用できます。

必要があればプロダクトのホームへ戻るリンクを表示してください。

props