MazeMage Comments - Answer Overflow

MazeMage

•Created by MazeMage on 3/5/2025 in #workers-help

KV store in NextJs App

one more question, since I'm a nooby with nextjs. I have a component, where i want to use a secret. from the docs i see the env is accessable only in routers. is there any way to do it safely? the only way i can think of is to make api route, and call it inside the component, but this would make the route accessable to anybody, which defeats the purpose. is there a way to secure it?

9 replies

CDCloudflare Developers

•Created by MazeMage on 3/5/2025 in #workers-help

KV store in NextJs App

opennext, these docs are what i was looking for exactly, thank you

9 replies

CDCloudflare Developers

•Created by MazeMage on 3/5/2025 in #workers-help

KV store in NextJs App

thank you, can I ask as well what is the best/easiest way to read a CF secret in a nextjs worker?

9 replies

CDCloudflare Developers

•Created by MazeMage on 3/5/2025 in #workers-help

KV store in NextJs App

thank you for the answer, aren't they doing the same thing in this case (storing some small data and retrieving it when needed)? I was thinking they both kinda do the same. I tried even this approach:

import { FrameNotificationDetails } from "@farcaster/frame-sdk";
import { binding } from "cf-bindings-proxy";
import { KVNamespace } from "@cloudflare/workers-types";

const kv = binding<KVNamespace>("FARCASTER_NOTIFICATION_TOKENS_KV");

function getUserNotificationDetailsKey(fid: number): string {
  return `user:${fid}`;
}

export async function getUserNotificationDetails(
  fid: number
): Promise<FrameNotificationDetails | null> {
  const value = await kv.get(getUserNotificationDetailsKey(fid));
  return JSON.parse(value || "null");
}

export async function setUserNotificationDetails(
  fid: number,
  notificationDetails: FrameNotificationDetails
): Promise<void> {
  console.log("kv in put: ", kv);
  await kv.put(getUserNotificationDetailsKey(fid), JSON.stringify(notificationDetails));
}

export async function deleteUserNotificationDetails(
  fid: number
): Promise<void> {
  await kv.delete(getUserNotificationDetailsKey(fid));
}

import { FrameNotificationDetails } from "@farcaster/frame-sdk";
import { binding } from "cf-bindings-proxy";
import { KVNamespace } from "@cloudflare/workers-types";

const kv = binding<KVNamespace>("FARCASTER_NOTIFICATION_TOKENS_KV");

function getUserNotificationDetailsKey(fid: number): string {
  return `user:${fid}`;
}

export async function getUserNotificationDetails(
  fid: number
): Promise<FrameNotificationDetails | null> {
  const value = await kv.get(getUserNotificationDetailsKey(fid));
  return JSON.parse(value || "null");
}

export async function setUserNotificationDetails(
  fid: number,
  notificationDetails: FrameNotificationDetails
): Promise<void> {
  console.log("kv in put: ", kv);
  await kv.put(getUserNotificationDetailsKey(fid), JSON.stringify(notificationDetails));
}

export async function deleteUserNotificationDetails(
  fid: number
): Promise<void> {
  await kv.delete(getUserNotificationDetailsKey(fid));
}

but the kv const is undefined when I try to call it. Also I was wondering is the workers approach better than the pages for nextjs?

9 replies

Gaming

Programming