1

Stripe recently added typings to their stripe-node library with version 8. This replaced the need for the separate @types/stripe from DefinitelyTyped. In a node TypeScript environment using these types is straightforward, but I'm wondering if it's feasible to make use of these types in a client-side TypeScript application (Angular) that compiles to browser JavaScript.

It seems to work to npm install --save stripe and import Stripe from 'stripe' wherever I want to add Stripe typings, but with this being a node library I want to make sure I'm not missing anything obvious. Is there any concern with importing a library designed for node in a client application?

EDIT:

To be clear, I am not asking if it's ok to make full use of stripe-node in my client. That would be a huge security risk. Now that the library has typings built-in, it would be nice if we could reference those types in client-side typescript.

Improve this question

3 Answers 3

Reset to default
2

The types for stripe-node won't work for Stripe.js, you'll want to use these instead: https://github.com/stripe/stripe-js

npm install @stripe/stripe-js

See this bit about TypeScript support: https://github.com/stripe/stripe-js#typescript-support

Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

I am building out the type structure for some response data, and one of the responses is a list of stripe invoices and I'd like to use the Stripe.Invoice type from stripe-node. Such a type does not exist in stripe-js.
That feature would also not exist in Stripe.js, it would only exist in stripe-node. Can you share more about what you're building? Stripe.js is only for client side interaction which doesn't support listing invoices for example, you'd need to use stripe-node or another server language for that.
Apologies for not responding sooner. I have an API endpoint that returns invoices from stripe for a given customer. It would be nice if on my client I could reference the Invoices type provided by this library, because that's exactly what's getting returned in the response. All of the stripe-node functionality is handled server-side, but it would be nice if on my client I could reference the Invoices type provided by this library, because that's exactly what's getting returned in the response
1

Concerns would be there, only if you use your server secret in your frontend code. As far as you are not doing that & using server library just for the type definitions in frontend, There is no issue at all.

Improve this answer

1 Comment

I fully understand why you should not use stripe-node on a client app. I am strictly asking about the types provided as part of the library. For example, I have an API endpoint that returns invoices from stripe for a given customer. It would be nice if on my client I could reference the Invoices type provided by this library, because that's exactly what's getting returned in the response.
1

I use a monorepo package to export the TypeScript interfaces from the stripe-node library.

project
└── packages
    ├── common
    └── web
  • Prevents clashing with Stripe from @stripe/stripe-js
  • Avoids adding stripe-node to web, which could be used in a bad way (e.g. using secrets)
  • Allows extending types when stripe API calls are made with expand
// project/packages/common/stripe.ts
import { Stripe } from "stripe";

type StripeInvoice = Stripe.Invoice;
type StripeSubscription = Stripe.Subscription;
type StripeSubscriptionList = Stripe.Response<
  Stripe.ApiList<Stripe.Subscription>
>;
type StripeCustomer = Stripe.Customer;

export {
  StripeInvoice,
  StripeCustomer,
  StripeSubscription,
  StripeSubscriptionList,
};

// project/packages/web/request.ts
import { StripeSubscriptionList } from "@project/common/stripe";

const listSubscriptions = async () => {
  // Wrapper function for the fetch API
  return await fetchAPI<StripeSubscriptionList>("subscriptions", {
    method: "GET",
  });
};
Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.