Search code examples
reactjsauthenticationfirefoxcookiesjs-cookie

Cookies can't be set in Firefox


This is a React app. In authentication, i involve the cookies (first-party) to be one of the credentials to be authenticated, the case is it works on Chrome, but not in Firefox. Chrome is successfully get and stored the cookies, but Firefox doesn't get that cookies.

I'm using js-cookie to handle Cookies management

const isLogined = () => {
    var xhr = new XMLHttpRequest();
    const data = { Name, Password };
    enableLoading();
    setTimeout(() => {
      Http.post(`thisistheapiurl`, data, (xhr.withCredentials = true))
        .then(res => {
          disableLoading();
          if (res.status === 200) {
            if (res.data.result !== "failed") {
              var expired = new Date(new Date().getTime() + 3600 * 1000);
              Cookies.set("header", `${res.headers["x-header"]}`, {
                expires: expired
              });
              Cookies.set("signature", `${res.headers["x-signature"]}`, {
                expires: expired
              });
              Cookies.set("refreshToken", `${res.headers["x-refreshtoken"]}`, {
                expires: expired
              });
              // alert("succes");
              window.location.href = "/dashboard";
            } else {
              setStatus(
                intl.formatMessage({
                  id: "AUTH.VALIDATION.INVALID_LOGIN"
                })
              );
            }
          }
        })
        .catch(err => {
          console.log(err);
          disableLoading();
          setStatus(
            intl.formatMessage({
              id: "AUTH.VALIDATION.INVALID_LOGIN"
            })
          );
        });
    }, 1000);
  };

Solution

  • just add event.preventDefault() before isLogined Function on your onSubmit form. and u doesn't need call isLogined function on button if u already using button type="submit"