Why am I getting a 404 error in production after migrating to 2.x PD SDK, but not in development?

This topic was automatically generated from Slack. You can find the original thread here.

Hey Team! I migrated to 2.x PD SDK. Now on production I get 404 for this url https://api.pipedream.com/v1/connect/apps?limit=20&q=

It works fine on dev. That url is called from within the sdk using client.apps.list({})

Hey , O believe Pipedream SDK v2 uses pipedream connect v2which requires oauth. You can downgrade to v1

Hey! Could you please elaborate? I am using the PD npm SDK. I get the token as per the documentation. Everything else works fine. The problem seems to occur when I call client.app.list from my frontend. I am not dealing with authentication directly. It is handled by the PD SDK. Why should I downgrade?

_const_ client: PipedreamClient = createFrontendClient({
externalUserId: userId,
tokenCallback: async () _=>_ {
_const_ result = await HttpService.getIntegrationToken();
if (!result) {
throw new _Error_("No token found");
}
return result;
},
});

You can check the example here https://pipedream.com/docs/connect/api-reference/list-apps

Are you AI? :slightly_smiling_face:

I mentioned that I implemented it correctly and it works on dev environment. It only fails to work on production. And it returns 404 for the API. It looks to me like a bug in the SDK. It does not tell me what is not found? I am just querying the list of apps

Could you share the code that you call list app?

_const_ page = await client.apps.list({
q: debouncedSearchQuery,
limit: 20,
});

And the client

_const_ client: PipedreamClient = createFrontendClient({
// token: 'connect-token',
externalUserId: userId,
tokenCallback: async () _=>_ {
_const_ result = await HttpService.getIntegrationToken();
if (!result) {
throw new _Error_("No token found");
}
return result;
},
});

Your code is incorrect. Here’s the example in the doc

import { PipedreamClient } from “@pipedream/sdk”;

const client = new PipedreamClient({
clientId: “YOUR_CLIENT_ID”,
clientSecret: “YOUR_CLIENT_SECRET”,
projectEnvironment: “YOUR_PROJECT_ENVIRONMENT”,
projectId: “YOUR_PROJECT_ID”
});
const response = await client.apps.list({
after: “after”,
before: “before”,
limit: 1,
q: “q”,
sortKey: “name”,
sortDirection: “asc”
});
for await (const item of response) {
console.log(item);
}

// Or you can manually iterate page-by-page
let page = await client.apps.list({
after: “after”,
before: “before”,
limit: 1,
q: “q”,
sortKey: “name”,
sortDirection: “asc”
});
while (page.hasNextPage()) {
page = page.getNextPage();
}

Your code is for backend. I said already that I am having issues on frontend. There is no “clientSecret” or other properties in browser api. That would make the app insecure.

What you have sent does not even compile because clientId, clientSecret and other fields are not available in frontend.

could you please chime in. Is @U03CXTHK4RF AI agent? :slightly_smiling_face: They don’t understand me, and I’m not sure if I should continue talking to them. I’d rather not if they’re AI.

You should call Pipedream API from your backend

It is stated in the doc here https://pipedream.com/docs/connect/api-reference/sdks

Server Usage

Most of your interactions with the Connect API will likely happen on the server, to protect API requests and user credentials. You’ll use the SDK in your frontend to let users connect accounts. Once connected, you’ll use the SDK on the server to retrieve account info, invoke workflows on their behalf, and more.

Then how should I paginate apps.list if it does not return cursor?

apps.list return Page and it has getNextPage function. How to call it via the REST API? It requires reference to the page. But in REST API there is no reference.

Either app.list should expose cursor so I can build my API around it or apps.list is meant to be called from frontend (which works fine in dev environment)

(btw there is a cursor returned in the api but it is not exposed in the TS types. I need to hack it using const res:any to make it’s type “any” ) so I can get cursor. This is a hacky way which I would prefer not to do on production app)

I see. Got it, I’ll check and get back to you

Hey sorry for the confusion — you can make requests directly from the browser with the TS SDK. Can you let me know what’s working and what isn’t working?

Hey Danny! The apps api returns 404 on production when using the TS SDK on frontend. Works correctly on development environment

How are you defining the environment? That wouldn’t make sense for production vs development to lead to a 404.

On frontend I don’t. I use PipedreamClient to get token from backend. I am assuming it figures out the environment based on that.

Is it possible to check http logs for this url?
https://api.pipedream.com/v1/connect/apps?limit=20&q=

It returns a 404 error without providing an explanation

I believe you still need to set the projectEnvironment in the client: SDKs - Pipedream

It is optional so I didn’t set it. I actually create client as this:

_const_ client: PipedreamClient = createFrontendClient({
externalUserId: userId,
tokenCallback: async () _=>_ {
_const_ result = await HttpService.getIntegrationToken();
if (!result) {
throw new _Error_("No token found");
}
return result;
},
});

Will check adding env explicitly