Cant set cookie from Springboot on NuxtJs/VueJs at all

Old title: Cant reset cookie on logout with NuxtJS/VueJS and Springboot/JWT

I have some backend (springboot REST api) that handles signing out and logging in to an account using a cookie but when I sign out it doesn't set the cookie to nothing. It works fine with postman but not with nuxtjs/vuejs. it might just be some header issue not too sure. Also I am using JWT

logout code

<template>
  <div style="max-width: 1200px; margin-left: auto; margin-right: auto">
    <div class="block" style="width: auto">
      <div class="description">
        <button v-on:click="signout">Signout</button>
      </div>
    </div>
  </div>
</template>
 
<script>
import axios from 'axios'
 
export default {
  methods: {
    signout: function () {
 
      const config = {
        headers: {
          Accept: '*/*',
          'Content-Type': 'application/json',
          'Access-Control-Allow-Origin': '*'
        },
      }
 
      axios.post('http://localhost:8080/api/auth/signout', config).then(function (response) {
        console.log("signedout")
      }).catch(function (error) {
        console.log(error)
      })
    },
  },
}
</script>

<template>
  <div style="max-width: 1200px; margin-left: auto; margin-right: auto">
    <div class="block" style="width: auto">
      <h1 class="title">Login</h1>
      <div class="description">
        Username: <input id="username" class="input-box" type="text" placeholder="Username"/><br>
        Password: <input id="password" class="input-box" type="password" placeholder="Password"/><br>
        <button v-on:click="login">Login</button>
      </div>
    </div>
  </div>
</template>
 
<script>
import axios from 'axios'
 
export default {
  name: 'add',
  methods: {
    login: function () {
      const config = {
        headers: {
          Accept: '*/*',
          'Content-Type': 'application/json',
          credentials: "include"
        },
      }
 
      const username = document.getElementById('username').value
      const password = document.getElementById('password').value
      const data = {
        username: username,
        password: password,
      }
 
      axios.post('http://localhost:8080/api/auth/signin', data, config).then(function (response) {
        console.log(response)
      }).catch(function (error) {
        console.log(error)
      })
    },
  },
}
</script>

logout cookie is the same as the login but with an empty value and the expire time to 0

Backend cookies

// Login cookie
ResponseCookie.from(jwtCookie, jwt).path("/api").maxAge(24 * 60 * 60).httpOnly(true).build();

// Logout cookie
ResponseCookie.from(jwtCookie, "").path("/api").maxAge(0).httpOnly(true).build();

It sometimes seems to work. I tried something and it didn't work, then changed the code and checked the cookie before trying the new thing but the logout seemed to of worked. I tried the old code that seemed to of worked but it didn't work.

EDIT: I have tried with normal cookies being sent as well without any JWT code and I still have the same issue. I have tried withCredentials and it didnt work either

Cant set cookie from Springboot on NuxtJs/VueJs at all

0 Answers