Issues Accessing Prisma-Managed API Token in Shopify Pickup Point Generator Extension

Issues Accessing Prisma-Managed API Token in Shopify Pickup Point Generator Extension

SanderCokart
Shopify Partner
1 0 0

Hello,

We've set up a Shopify Remix app and added a settings page that allows users to store an API token using the following Prisma model:

model ApiToken {
  id        Int      @id @default(autoincrement())
  token     String   @unique
  createdAt DateTime @default(now())
  updatedAt DateTime @updatedAt
}

We also implemented the following server-side functions to manage the API token:

import { db } from "../db.server";

export async function getInnosendApiToken() {
  const token = await db.apiToken.findFirst();
  if (!token) {
    return null;
  }
  return token;
}

export async function setInnosendApiToken(token: string) {
  await db.apiToken.upsert({
    where: { id: 1 }, // Assuming you have a unique identifier for the token
    update: { token },
    create: { token },
  });
}

The issue arises when we try to access this token within the Shopify Pickup Point Options Generator extension. Importing the server function results in WASM errors, and using a fetch request inside the buildExternalApiRequest function within fetch.ts leads to type conflicts with FetchInput.

The working example below uses a hardcoded token (which is obviously not a good solution):

function buildExternalApiRequest(
  latitude: number,
  longitude: number,
  countryCode: CountryCode,
): HttpRequest {
  const url = `http://localhost:5000/v1/pickup-point?latitude=${latitude}&longitude=${longitude}&country_code=${countryCode}`;

  const apiToken =
    "FwCmZtYT_ELfWelibiLU1fmJYQz0yxKCVMX9HGvjMUSCf9UwtHqGwtU9JLjgRBvP3QhchQS3iB1vKAVl_AtxAg";

  return {
    method: HttpRequestMethod.Get,
    url,
    headers: [
      {
        name: "Accept",
        value: "application/json; charset=utf-8",
      },
      {
        name: "Authorization",
        value: `Bearer ${apiToken}`,
      },
    ],
    body: null,
    policy: {
      readTimeoutMs: 1000,
    },
  };
}

My questions:

  1. Am I using tokens completely wrong, and is there a better way to manage this API token?
  2. Is it even possible to access a Prisma-managed token within a Shopify extension?
  3. How can I properly fetch the API token stored in the Prisma database without hitting errors or type conflicts in the extension?

I appreciate any guidance or suggestions on how to solve this!

Thanks in advance!

Replies 0 (0)