cache.match() returing undefined always - caching

Question

I'm trying to code a cloudflare service worker that with cache the jokes fetched from the API for a minute. But, the problem is that the cache.match(path) returns undefined everytime.
So, every time i refresh the page in localhost, it fethes the API and returns and new joke, it doesn't cache the old joke for a minute. Why response is undefined always, even i'm putting the cache.
const getResponse = async (request: Request, ctx: ExecutionContext): Promise<Response> => {
let response: Response | undefined;
let cache: Cache;
const path = request.url;
cache = await caches.open('my-cache');
const endpoint = "https://official-joke-api.appspot.com/random_joke"
response = await cache.match(path);
console.log(response)
if (response) {
const last_modified = await response.headers("Last-Modified");
const now = new Date().getTime();
const prev = new Date(last_modified).getTime();
if (now - prev < 60000) {
return response;
}
}
const new_jokes = await (await fetch(endpoint)).json();
response = new Response(JSON.stringify(new_jokes), {
headers: {
"Content-Type": "application/json",
"Last-Modified": new Date().toUTCString(),
}
})
ctx.waitUntil(
cache.put(path, response.clone())
)
return response;
}
export default {
async fetch(req: Request, env: Env, ctx: ExecutionContext) {
return getResponse(req, ctx);
}
}