如何使html显示从hx-delete请求返回的403错误页面?

Question

在我的项目中，当web浏览器提交一个hx-delete请求时，后端确定用户没有该请求所需的权限，后端返回一个完整的403错误页面。默认情况下，html会忽略这个响应。我希望html显示完整的403错误页面。

我该怎么做?

Answer 1

我通过将这段代码添加到页面中来解决这个问题。

/***
* Swaps in the body of error pages returned from htmx requests 
*/
document.addEventListener("htmx:beforeOnLoad", function (event) {
const xhr = event.detail.xhr
if (xhr.status == 500 || xhr.status == 403 || xhr.status == 404) {
event.stopPropagation() // Tell htmx not to process these requests
document.children[0].innerHTML = xhr.response // Swap in body of response instead
}
})