PACKAGE · PAYMENT

@tosspayments/payment-widget-sdk

TossPayments.js Payment Widget SDK.

WEEKLY DOWNLOADS 4.9K
STARS 122
FORKS 12
OPEN ISSUES 1
GZIP SIZE 1.5 kB
UNPACKED SIZE 20.1 kB
DEPENDENCIES 1
LAST UPDATED 28d ago
DOWNLOAD TRENDS

@tosspayments/payment-widget-sdk downloads — last 12 months

Download trends for @tosspayments/payment-widget-sdk1 download series from Jun 2025 to May 2026. Use left and right arrow keys to inspect monthly values.011.0K22.1K33.1K44.2KJun 2025SepDecMarMay 2026
@tosspayments/payment-widget-sdk
ABOUT @TOSSPAYMENTS/PAYMENT-WIDGET-SDK

The @tosspayments/payment-widget-sdk is a JavaScript SDK designed to simplify the integration of Toss Payments' payment processing capabilities into web applications. It addresses the complexity involved in handling sensitive payment information, secure transaction flows, and user interface elements required for seamless checkout experiences, abstracting away much of the low-level HTTP communication and validation logic.

This SDK's core philosophy centers on providing a developer-friendly and efficient way for merchants to accept online payments. Its primary audience includes web developers building e-commerce platforms, subscription services, or any application requiring online payment collection. The widget aims to reduce integration time and potential errors by offering a standardized and well-tested interface for payment gateway interactions.

The SDK exposes a `PaymentWidgetInstance` object through its initialization API, `PaymentWidget.create()`. Developers then use methods on this instance, such as `renderPaymentMethods`, to display available payment options and `requestPayment` to initiate the payment process. It leverages a Promise-based or async/await pattern for handling asynchronous operations, making it straightforward to manage the state and outcomes of payment requests within modern JavaScript applications.

Integration is primarily achieved through simple JavaScript inclusion or via import statements in module bundler environments like Webpack or Rollup. It is designed to be framework-agnostic, making it suitable for use in vanilla JavaScript projects, as well as within popular front-end frameworks like React, Vue, or Angular. The generated payment widget can be embedded directly into a host application's DOM, allowing for a consistent user experience.

With a gzipped bundle size of only 1.5 kB, this SDK is highly optimized for performance and minimal impact on application load times. This small footprint is achieved through careful code management and focusing solely on the core payment widget functionality. The package is also written in TypeScript, providing type safety for developers working in TypeScript environments or those who prefer strong typing.

While this SDK handles numerous payment scenarios, it's important to note that it focuses specifically on the client-side integration of the payment widget. Server-side integrations for order management, fulfillment, and robust security checks are still the responsibility of the developer. The SDK does not manage user authentication or complex business logic beyond facilitating the payment transaction itself.

WHEN TO USE
  • When integrating Toss Payments checkout flow into a React, Vue, or vanilla JavaScript application.
  • When you need to dynamically render payment methods like credit cards, bank transfers, or mobile payments within your UI.
  • When abstracting the complexity of secure payment execution and handling payment gateway responses is a priority.
  • To leverage the `requestPayment` API for initiating masked card, bank transfer, or other Toss Payments-supported payment methods.
  • When building e-commerce sites or services requiring a streamlined and compliant payment collection process.
  • To utilize the `renderPaymentMethods` and `updateAmountWidget` APIs for interactive payment amount adjustments.
WHEN NOT TO USE
  • If you are integrating with a payment provider other than Toss Payments.
  • If your application requires direct control over every low-level HTTP request to a payment gateway, bypassing an SDK abstraction.
  • When the primary need is for a server-side payment processing API or webhooks, as this SDK focuses on client-side widget integration.
  • If you wish to avoid any external dependencies, even lightweight ones. A completely custom, manual integration might be considered instead.
  • When your payment flow does not involve a visual checkout widget and can be handled entirely through server-to-server communication or simpler API calls.

CORRECTIONS

Spot wrong data here?

A short note helps us fix it.

Anonymous · No account · No email back

COMPARISONS 2
@tosspayments/payment-widget-sdk vs stripe ★ 4.4K · 6.8M/wk @tosspayments/payment-widget-sdk vs @lemonsqueezy/lemonsqueezy.js ★ 530 · 51.6K/wk