I’ve noticed some strange behaviour with my Laravel/Inertia/vue.js app.

When returning to an open tab in the navigator after some time, the app displays raw JSON instead of the page. The JSON looks like the inertia response.

I’ve noticed this in Chrome but it might happen in other browsers.

This behaviour also sometimes happen when clicking the back button of the navigator.

Example of json displayed :

{
  "component": "Home",
  "props": {
    "jetstream": {
      "canCreateTeams": false,
      "canManageTwoFactorAuthentication": true,
      "canUpdatePassword": true,
      "canUpdateProfileInformation": true,
      "hasEmailVerification": false,
      "flash": [],
      "hasAccountDeletionFeatures": true,
      "hasApiFeatures": false,
      "hasTeamFeatures": false,
      "hasTermsAndPrivacyPolicyFeature": false,
      "managesProfilePhotos": false
    },
    "auth": {
      "user": {
        "id": 10,
        "name": "****",
        "first_name": "****",
        "last_name": "****",
        "registered_as": 1,
        "email": "****",
        "email_verified_at": null,
        "pre_registration_at": null,
        "two_factor_confirmed_at": null,
        "current_team_id": null,
        "profile_photo_path": null,
        "created_at": "2024-10-11T16:07:34.000000Z",
        "updated_at": "2024-10-11T16:12:43.000000Z",
        "profile_photo_url": "https://ui-avatars.com/api/?name=A+R&color=7F9CF5&background=EBF4FF",
        "two_factor_enabled": false
      }
    },
    "errorBags": [],
    "errors": {},
    "flash": {
      "toast": null
    },
    "categories": [
      "****"
    ],
    "filters": []
  },
  "url": "/",
  "version": "33fc74be0d1d546c3d41eede2b9ddfe3"
}