Home  >  Article  >  Backend Development  >  The browser did not save the cookie

The browser did not save the cookie

王林
王林forward
2024-02-09 10:30:09588browse

The browser did not save the cookie

php Xiaobian Youzi is here to introduce a common problem - the browser does not save cookies. When we use browsers to access web pages on a daily basis, cookies are a common mechanism that can help websites remember the user's login status, personalized settings and other information. However, sometimes we encounter problems such as the browser not saving cookies, resulting in the loss of login status and the inability to browse the web normally. So why does this happen? Let’s explore it together!

Question content

Tried 15648070,15648070 unfortunately without success:)

Hello, it is my first time to use gin to build an api. I encountered some problems when setting cookies on the browser

What I mean is, when looking at the request on the dev tools, I see the set-cookie header with the correct value, also ## in that request #cookie I also saw cookie under the tab

The main problem is that it doesn't save on my browser (

dev tools -> application -> storage -> cookiesand my cookie does not exist)

rear end:

router.use(cors.new(cors.config{
        allowmethods:     []string{"get", "post", "put", "patch", "delete", "head", "options"},
        allowheaders:     []string{"origin", "content-length", "content-type"},
        maxage:           12 * time.hour,
        allowallorigins:  true,
        allowcredentials: true,
    }))

    router.post("/users/login", server.loginuser)
func (server *server) loginuser(ctx *gin.context) {
        ...
    ctx.setcookie("access_token", accesstoken, 3600, "/", "localhost", false, true)
    ctx.setcookie("refresh_token", refreshtoken, 3600, "/", "localhost", false, true)

    ctx.json(http.statusok, gin.h{"ok": true, "payload": rsps})

}

front end:

const login = async () => {
    const res = await fetch("http://localhost:3000/users/login", {
      method: "POST",
      body: JSON.stringify({ username, password }),
    });
    const data = await res.json();
    console.log(data);
  };
  const handleFormSubmit = (e) => {
    e.preventDefault();
    login();
  };

  return (
    <div>
      <h1>Login Page</h1>
      <form onSubmit={handleFormSubmit}>
         ...
        <button type="submit">Login</button>
      </form>
    </div>
  );

Any clues..?

Solution

(Thanks to the

#Reactiflux channel on Discord)

I missed two things..

Service-Terminal:

  • AllowHeaders headers -> Add "Access-Control-Allow-Headers", "Authorization"

  • Add

    AllowOriginFunc -> means disallow * instead of specific domain

front end:

    Add
  • withCredentials: true to my axios configuration

The above is the detailed content of The browser did not save the cookie. For more information, please follow other related articles on the PHP Chinese website!

Statement:
This article is reproduced at:stackoverflow.com. If there is any infringement, please contact admin@php.cn delete