javascript - cookies försvinner efter att sidan laddats om på localhost

när du går in på webbplatsen sätts kakor och allt går bra, men när du laddar om sidan raderas de inställda kakorna

svar från inloggning(tillbaka):

    export const sendAccessTokenAndRefreshToken = (response:ServerResponse, accesstoken:string, refreshtoken:string) => {

    response.writeHead(200, {
        'Content-Type': 'text/json; application/json',
        "Access-Control-Allow-Credentials": "true",
        "Access-Control-Allow-Methods": "GET,PUT,POST,DELETE,PATCH,OPTIONS",
        "Access-Control-Allow-Origin": "http://localhost:3000",
        "Access-Control-Allow-Headers": "Access-Control-Allow-Headers, Origin, X-Requested-With, Content-Type, Accept, Authorization",
        'Set-Cookie':  [`refreshtoken=${refreshtoken}; Secure; HttpOnly; SameSite=None; Path=/; Max-Age=99999999;`]
       
    });

    response.end(JSON.stringify({accesstoken}));

}

svarsalternativ (CORS):

response.writeHead(200, {
    'Content-Type': 'text/json; application/json',
    "Access-Control-Allow-Credentials": "true",
    "Access-Control-Allow-Origin": "http://localhost:3000",
    "Access-Control-Expose-Headers": "Authorization",
    "Access-Control-Allow-Headers": "Access-Control-Allow-Headers, Origin, X-Requested-With, Content-Type, Accept, Authorization",
});

response.end(JSON.stringify({message: 'Cors Work!'}));

när inloggning är klar:

ange bildbeskrivning här

efter sidan laddats om:

ange bildbeskrivning här

I den här bilden kan du se att när du skickar en POST-förfrågan visas cookies, men efter en omstart försvinner de

ange bildbeskrivning här

front login.js:

    const body = {

    login: login_input.value,
    password: password_input.value

}

fetch('http://127.0.0.1:3000/login', {
    method: 'POST',
    mode: 'cors',
    headers: {
        'Content-Type': 'application/json'
    },
    credentials: 'include',
    body: JSON.stringify(body)
})
.then((response) => response.json())
.then((json) => {
    localStorage.setItem('token', json.accesstoken);

Hur löser man detta problem? Jag försökte använda Cors-webbläsartillägget, men inte ens det hjälpte.

hur man löser detta problem utan att använda onödiga ramverk?

Svar #1

Jag misstänker att det är användningen av ' och ` citationstecken i koden nedan:

"Access-Control-Allow-Headers": "Access-Control-Allow-Headers, Origin, X-Requested-With, Content-Type, Accept, Authorization", 'Set-Cookie': [refreshtoken=$ {refreshtoken}; Säker; HttpOnly; SameSite=None; Path=/; Max-Age=99999999;]

Ta bort '`' och ta också bort [] du ska inte ha det heller.

Något som:

"Set-Cookie":  "refreshtoken=${refreshtoken}; Secure; HttpOnly; SameSite=None; Path=/; Max-Age=99999999;"

då är det en annan fråga om det är en bra idé att lagra uppdateringstoken i en cookie, men det är en annan diskussion.

För att komplettera detta svar skrev jag ett blogginlägg som går in mer i detalj på detta ämne: Felsökning av cookie-problem

Svar #2

Det händer eftersom kakan visas när begäran är klar. Snarare beror det på egenskapen path; när du laddar om din sida kanske URL:en i din flik och kakans path inte matchar, så du kan inte se kakan (på en specifik path)

Relaterade artiklar