title: How to fix nuxt auth page reload problem?
body: <p>When I log in with nuxt auth, I redirect the user to his profile page. But after reload on the profile page I get an error like the screenshot:</p>
  <p><a href="https://i.stack.imgur.com/U7UzA.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/U7UzA.png" alt="enter image description here" /></a></p>
  <p>I have searched this problem related to @nuxtjs/auth-next ssr problem. Most of the solution is to downgrade the @nuxtjs/axios version. I have already tried this but not fixed.</p>
  <p>Here is my profile page code:</p>
  <pre class="lang-html prettyprint-override"><code>&lt;template&gt;
      &lt;div v-show=&quot;$auth.user&quot;&gt;
          &lt;!-- profile image --&gt;
          &lt;div class=&quot;w-full flex&quot;&gt;
              &lt;div&gt;
                  &lt;div class=&quot;bg-gray-200 p-5 w-40 h-44&quot;&gt;&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class=&quot;ml-6&quot;&gt;
                  &lt;h2 class=&quot;font-bold text-2xl mb-4&quot;&gt;Profile Details&lt;/h2&gt;
                  &lt;h6 class=&quot;font-semibold text-lg&quot;&gt;{{$auth.user.name}}&lt;/h6&gt;
                  &lt;p&gt;&lt;span class=&quot;font-medium&quot;&gt;Email: &lt;/span&gt;{{$auth.user.email}}&lt;/p&gt;
                  &lt;p&gt;&lt;span class=&quot;font-medium&quot;&gt;Phone: &lt;/span&gt;{{$auth.user.phone}}&lt;/p&gt;
                  &lt;p&gt;&lt;span class=&quot;font-medium&quot;&gt;Last Login: &lt;/span&gt;{{$auth.user.lastLoginForHuman}}&lt;/p&gt;
                  &lt;nuxt-link to=&quot;/customer/change-password&quot; class=&quot;block mt-3 text-primary-500 text-sm hover:underline&quot;&gt;Change Password&lt;/nuxt-link&gt;
              &lt;/div&gt;
  
          &lt;/div&gt;
  
          &lt;!-- details --&gt;
          &lt;div class=&quot;w-full mt-5&quot;&gt;
              &lt;div class=&quot;grid grid-cols-2 sm:grid-cols-2 gap-4&quot;&gt;
                  &lt;input-field label=&quot;First name&quot;&gt;&lt;/input-field&gt;
                  &lt;input-field label=&quot;Last name&quot;&gt;&lt;/input-field&gt;
                  &lt;input-field type=&quot;email&quot; label=&quot;Email&quot;&gt;&lt;/input-field&gt;
                  &lt;input-field label=&quot;Phone&quot;&gt;&lt;/input-field&gt;
              &lt;/div&gt;
  
              &lt;div class=&quot;flex justify-end&quot;&gt;
                  &lt;button-field label=&quot;Update&quot; class=&quot;bg-primary-500 text-white py-3 px-10&quot;&gt;&lt;/button-field&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  
      &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  export default {
      name: &quot;Profile&quot;,
      data() {
          return {
              form: {
                  firstName: this.$auth.user?.firstName,
                  lastName: this.$auth.user?.lastName,
                  email: this.$auth.user?.email,
                  phone: this.$auth.user?.phone,
              },
              photo: null,
          };
      },
  };
  &lt;/script&gt;
  </code></pre>
  <p>&quot;@nuxtjs/auth-next&quot;: &quot;^5.0.0-1624817847.21691f1&quot;,
  &quot;@nuxtjs/axios&quot;: &quot;^5.13.6&quot;,
  &quot;nuxt&quot;: &quot;^2.15.7&quot;</p>