如何在 .NET Core 3.1 中使用全局异常自定义筛选器显示错误模式?

How to display an Error Modal using a Global Exception Custom Filter in .NET Core 3.1?

我实现了以下全局自定义异常过滤器:

public class ExceptionCustomFilter : IExceptionFilter
{
    private readonly IWebHostEnvironment _hostingEnvironment;
    private readonly IModelMetadataProvider _modelMetadataProvider;
    private readonly IHttpContextAccessor _httpContextAccessor;

    public ExceptionCustomFilter(
        IWebHostEnvironment hostingEnvironment,
        IModelMetadataProvider modelMetadataProvider,
        IHttpContextAccessor httpContextAccessor)
    {
        _hostingEnvironment = hostingEnvironment;
        _modelMetadataProvider = modelMetadataProvider;
        _httpContextAccessor = httpContextAccessor;
    }

    public void OnException(ExceptionContext filterContext)
    {
        //Redirect to global handler
        filterContext.Result = new ViewResult();
        {
            ViewName = "Error"
        };
        filterContext.ExceptionHandled = true;
        filterContext.HttpContext.Response.Clear();
    }
}

并且我将以下代码添加到我的 Startup ConfigureServices() 方法中:

services.AddControllersWithViews(options =>
{
    options.Filters.Add(typeof(ExceptionCustomFilter));
});
services.AddMvc(options =>
{
    options.EnableEndpointRouting = false;
    options.Filters.Add(typeof(ExceptionCustomFilter));
}); 

我想让我的 "Error" 视图(目前在我的 Views > Shared 文件夹中找到)在每次我的 ExceptionFilter 捕获任何异常时作为模态弹出。

我的 "Error.cshtml" 现在查看:

// Render styles

<script type="text/javascript">
    $(function () {
        $('#modalError').modal('show');
    });
</script>

<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <div class="error">
                <i class="icon-erro fa fa-exclamation-circle" aria-hidden="true"></i>
                <h2> Error </h2>
            </div>
        </div>

        <div class="modal-body">
            <div class="error">
                <p>
                    // content
                </p>
            </div>
        </div>
    </div>
</div>

更新:我设法弄明白了,显然缺少一些 div ID,我返回的是 ViewResult 而不是 PartialViewResult...

完整代码如下:

在我的自定义异常过滤器中

public void OnException(ExceptionContext filterContext)
{
    var logErroService = new LogErroService(filterContext.HttpContext);
    logErroService.Create(filterContext.Exception);
    if (IsAjaxRequest(filterContext.HttpContext.Request))
    {
        // Displays the error message as a modal
        filterContext.Result = new PartialViewResult()
        { 
            ViewName = "_ModalError"
        };
        filterContext.ExceptionHandled = true; 
        filterContext.HttpContext.Response.Clear();
    }
    else
    {
        // Displays the error message as a HTML Page
        filterContext.Result = new ViewResult()
        {
            ViewName = "_Error"
        };
        filterContext.ExceptionHandled = true;
        filterContext.HttpContext.Response.Clear();
    }
}

我的 _Error.cshtml 观点:

@{
    Layout = null;
}

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <!--Local-->
    // Import styles and scripts

    <title>Ops, an error has ocurred!</title>
</head>
<body>
    <div class="error">
        <i class="icon-erro fa fa-exclamation-circle" aria-hidden="true"></i>
        <h2>Error</h2>
    </div>
</body>
</html>

当错误来自 AJAX 请求时, 调用 _ModalError.cshtml

<!-- Local -->
// Import styles and scripts

<script type="text/javascript">
    $(function () {
        $('#ModalError').modal();
    });
</script>

<div class='modal fade' id='ModalError'>
    <div id='divModalErrorBody'>

        <div class="modal-dialog" role="document">
            <div class="modal-content">

                <div class="modal-body">
                    <button type="button" class="close" data-dismiss="modal">
                            <span aria-hidden="true">×</span>
                            <span class="sr-only">Exit</span>
                    </button>

                    <div class="error-modal">
                        <i class="icon-erro fa fa-exclamation-circle" aria-hidden="true"></i>
                        <h2> Error </h2>
                    </div>
                </div>

            </div>
        </div>

    </div>
</div>