# Handling AJAX requests with expired authentication

## The Problem:

When an ajax request is made from a page that requires a valid user (in the session), the page does not redirect (to a Login page) when the auth session has expired. This makes the page look unresponsive and provides a less than ideal user experience.

## The Solution:

The solution is quite simple though not that obvious. It has 2 parts:

* The middleware will recognise the expired auth and that the request is ajax, then send a custom `Response` the page will recognise.
* The Javascript on the page will check the ajax response before it gets processes by other event handlres. If the response matches the criteria the browser redirects to the login page.

## The Code:

### Auth Middleware

In your `AuthenticationMiddleware`\
do something similar to the following

```python
def before(self, request, response):
    if not request.user():
        if request.is_ajax():
            response.content = "MASONITE_LOGIN_REQUIRED"
            response.status(403)
            return response

        return response.redirect(name="login")

    return request
```

### Page Template

Add the `.ajaxComplete()` block the `document.ready` javascript function in your page

```javascript
$(document).ready(function() {
    $(document).ajaxComplete(
        function (event, request, options) {
            if (request.responseText === "MASONITE_LOGIN_REQUIRED") {
                window.location.href = "{{ route(name='login') }}";
            }
        }
    )
});
```

This is for JQuery but you can adjust this id for whatever JS framework you're using.

## Middleware ordering

This adjustment is not strictly required but does provide a better user experience.

By default the `VerifyCsrfToken` middleware is set as part of the `web` middleware group. This will prevent the auth middleware checking the request before processing the page form data and may generate an invalid form error which is not what the user might expect.

To resolve this you can easily rearrange the order of middlewares.

In your `Kernel.py` file adjust the `route_middleware` similar to this:

```python
route_middleware = {
    "web": [SessionMiddleware, LoadUserMiddleware],
    "auth": [AuthenticationMiddleware, VerifyCsrfToken],
...
}
```

**NOTE:** the `VerifyCsrfToken` comes *AFTER* the `AuthenticationMiddleware`. This means that in this example only the routes tagged as `auth` will check the csrf token in form data.

## Notes:

* The `MASONITE_LOGIN_REQUIRED` can be anything you like, so making it a `const` of some kind is probably advisable to prevent issues with typos.
* The above javascript assumes you have a route named `login`


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.masoniteproject.com/how-to-guides/expired-auth-with-ajax.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
