setSignedCookie is not setting up the cookie , local host

[pranaydwivedi444]

What version of Hono are you using?

4.5.11

What runtime/platform is your app running on?

Cloudfare workers

What steps can reproduce the bug?

I try to sign the cookie , it does return token and everything , but when i try to check it in browser , it doesn't show me cookie in application tab via localhost , and says authorization error I am working on a backend using Hono, JWT, and signed cookies. When a user signs in, I generate a JWT token and set it as a signed cookie using the following code:

c```
onst jwt = await sign({ id: user.id }, c.env.JWT_SECRET);
const cookie_secret = c.env.COOKIE_SECRET;
console.log(jwt);
await setSignedCookie(c, "bearer_token", jwt, cookie_secret, {
expires: new Date(Date.now() + 7 * 24 * 60 * 60 * 1000), // Cookie expiry (1 week)
httpOnly: true, // Only accessible via HTTP (prevents JavaScript access)
sameSite: "None", // Allows cross-site cookies
});
return c.json({ message: "successfully signed in", success: true });

### What is the expected behavior?
I expect the signed cookie to be set in the browser (visible in the Application > Cookies tab) after signing in, and for it to be automatically sent with subsequent API requests. However, after signing in:

The cookie doesn't appear in the browser's Application tab. I get a 401 Unauthorized error when trying to make authenticated requests to the API, indicating the token is missing or not being sent. What I've Tried:

Checked the logs: The JWT is being correctly generated, but it isn't appearing as a cookie in the browser. Cookie options: I added the httpOnly: true flag to prevent JavaScript access and sameSite: "None" to allow cross-site requests (since my frontend and backend are on different origins during development: localhost and 127.0.0.1). CORS handling: My frontend uses axios to make requests with withCredentials: true for cookies, and I’ve configured CORS on the server.

### What do you see instead?

_No response_

### Additional information

_No response_

[yusukebe]

Hi @pranaydwivedi444

I think the screenshot says all of the things:

It's not a bug.

[pranaydwivedi444]

https://medium-blog-worker-serverless.vercel.app/blog/all
I have deployed it , here is my front end ,
here is my backend ,
https://backend.pranaydwivedi444.workers.dev/
I still can't understand the issue why the CORS error
Post Man easily can run this

app.post("/signup", async (c) => {
  //fetching body
  const body = await c.req.json();
  const prisma = c.get("prisma");
  const { success } = signupInput.safeParse(body);
  if (!success) {
    return c.text("invalid inputs", 411);
  }
  //create user in db
    const existingUser = await prisma.user.findUnique({
      where: { email: body.email },
    });

    if (existingUser) {
      return c.json({ error: "User already exists" }, 409); // Conflict status code
    }

  try {
    const user = await prisma.user.create({
      data: {
        email: body.email,
        name: body.name || " ",
        password: body.password,
      },
    });
    const secret = c.env.JWT_SECRET;
    const JWT = await sign({ id: user.id }, secret);
    const cookie_secret = c.env.COOKIE_SECRET;
    await setSignedCookie(c, "bearer_token", JWT, cookie_secret, {
      expires: new Date(Date.now() + 7 * 24 * 60 * 60 * 1000),
      sameSite: "None",
      secure: true,
      httpOnly: true,
    });
    // return jwt token
    return c.json({
      message: "successfull signed in",
      success : true,
    });
  } catch (err) {
    c.status(403);
    return c.json({ error: `error while signingup + ${err}` });
  }
});

app.post("/signin", async (c) => {
  const prisma = c.get("prisma");
  const body = await c.req.json();
  const { success } = signinInput.safeParse(body);
  if (!success) {
    return c.text("invalid inputs", 411);
  }
  const user = await prisma.user.findUnique({
    where: {
      email: body.email,
      password: body.password,
    },
  });

  if (!user) {
    c.status(403);
    return c.json({ error: "user not found" });
  }
  
  const jwt = await sign({ id: user.id }, c.env.JWT_SECRET); 
  const cookie_secret = c.env.COOKIE_SECRET;
  await setSignedCookie(c, "bearer_token", jwt, cookie_secret, {
    expires: new Date(Date.now() + 7 * 24 * 60 * 60 * 1000),
  });
  return c.json({ message :"successfully signed in ", success: true });
});

Here is my auth middleware :

export const authMiddleware: MiddlewareHandler = async function (c, next) {
  try {
    // const headerToken = c.req.header("Authorization") || "";
    // const token = headerToken.split(" ")[1];
    const cookie_secret = c.env.COOKIE_SECRET;
    const token = await getSignedCookie(c, cookie_secret, "bearer_token");
    if (!token) {
      c.status(401);
      return c.json({
        message: "Tokken missing",
      });
    }

    const secret = c.env.JWT_SECRET;
    const response = await verify(token, secret);
    if (response.id) {
      c.set("authorId", response.id);
      await next();
    }
  } catch (error) {
    c.status(401);
    return c.json({
      message: "Tokken error" + error,
    });
  }
};

I am using axios to send request

async function handleAPIBlogRequest(url: string) {
  try {
    const response = await axios.get(`${backendUrl}/${url}`, {
      withCredentials: true,
    });
    return response.data;
  } catch (error) {
    throw error;
  }
}

[yusukebe]

@pranaydwivedi444

It's difficult to run your code on my machine. Please provide a minimal project that does not use Prisma, Zod, or some libraries. If not, I'll close this issue.

[khangal]

import { Hono } from 'hono'
import { logger } from "hono/logger"
import { setSignedCookie, setCookie } from "hono/cookie"

const app = new Hono()
app.use(logger())

app.get('/', (c) => {
  setSignedCookie(c, "refreshToken", "example_value", "cookie_secret", {
    secure: true,
    httpOnly: true,
    // signingSecret: config.cookieSecret,
    // domain: undefined
  })

  setCookie(c, "accessToken", "example_value", { secure: true, httpOnly: true })

  return c.text('Hello Hono!')
})

Deno.serve(app.fetch)

refresh token is not set, but accessToken is set here

my deno.json

{
  "nodeModulesDir": "auto",
  "imports": { 
    "hono": "npm:hono@^4.6.4"
  },
  "tasks": {
    "dev": "deno run --watch --allow-net main.ts",
    "start": "deno run --allow-net main.ts"
  },
  "compilerOptions": {
    "jsx": "precompile",
    "jsxImportSource": "hono/jsx"
  },
  "deploy": {
    "project": "704a9cc1-f4cd-47cd-bfb4-fedd7e72bc2e",
    "exclude": [
      "**/node_modules"
    ],
    "include": [],
    "entrypoint": "main.ts"
  }
}

[github-actions]

This issue has been marked as stale due to inactivity.

[github-actions]

Closing this issue due to inactivity.