DEV Community

Balaramakrishna Kamma
Balaramakrishna Kamma

Posted on

Request Aborted (NS_BINDING_ABORT) In Firefox but working in remaining browsers

const Login = () => {

  const { isAuthenticated } = useSelector(

    (rootState: RootState) => rootState.auth

  );

  const router = useRouter();

  const dispatch = useDispatch();

  const searchParams = useSearchParams();

  const [isLoading, setIsLoading] = useState(false);

  const [passwordVisible, setPasswordVisible] = useState(false);

  const togglePasswordVisibility = () => {

    setPasswordVisible(!passwordVisible);

  };

  const ValidationSchema = z.object({

    email: z.string().email("Please enter a valid email address"),

    password: z

      .string()

      .min(8, "Password must be at least 8 characters")

      .max(20, "Password can't exceed 20 characters"),

    remember_me: z.boolean().optional().default(false),

  });

  const [isPending, setIsPending] = useState(false);

  type ValidationSchemaType = z.infer;

  useEffect(() => {

    if (isAuthenticated) {

      router.push("/app");

    }

  }, [isAuthenticated]);

  const {

    watch,

    setValue,

    register,

    handleSubmit,

    formState: { errors },

  } = useForm({

    resolver: zodResolver(ValidationSchema),

  });

  const handleGetProfileData = async () => {

    try {

      const response = await axios.get(${API_URL}/users/api/v1);

      const userData = response?.data?.data;

      return userData;

    } catch (error) {

      console.log(error);

    }

  };

  const onSubmit: SubmitHandler = async data => {

    setIsPending(true);

    try {

      const validatedData = ValidationSchema.parse(data);

      const response = await axios.post(

        API_URL + "/users/api/v1/auth/login",

        validatedData

      );

      const expiryTime = watch("remember_me")

        ? 30 * 24 * 60 * 60 * 1000

        : 7 * 24 * 60 * 60 * 1000;

      setCookie("token", response.data.data.token, {

        secure: true,

        sameSite: "none",

        expires: new Date(Date.now() + expiryTime),

        // domain: process.env.NEXT_PUBLIC_APP_BASE_URL,

      });

      const userData = await handleGetProfileData();

      dispatch(login(userData));

      router.push("/app");

      toast.success(response.data.message);

    } catch (error: any) {

      if (error.response) {

        toast.error(error.response.data.message);

      } else {

        toast.error(error.message);

      }

      console.error("Login failed:", error);

    } finally {

      setIsPending(false);

    }

  };

return(
//rest of code
);
};

I have written like this for user authentication. But I'm getting error request aborted.
-> I have entered credentials and send to backend.
-> Token is generating and get success message.
-> After that I've to redirect to app page. but while redirecting the request is aborting.

can any one help me in this to solve this issue

Top comments (0)