MrPeterss•3mo ago

Next.js + Springboot with Payment Widget SDK

Hi everyone. I am having some trouble coming up with a solution for my Next.js Frontend and Springboot Backend. I want the payment to be confirmed in my springboot backend when the payment request is succeeded from toss. Previously, I was doing this with the successUrl parameter in the requestPayment method (shown below). However, I don't want to expose my endpoints so that anyone can call it. I only want toss to be able to call my endpoint. I was thinking of using an api key, but i have no clue how i might be able to do this without exposing the key to the browser in the nextwork tab when the method is called. The last thing i want to happen is people going in and confirming a bunch of orders that were not paid.

await paymentWidget?.requestPayment({
                orderId: order,
                orderName: "order for " + name,
                customerName: name,
                customerEmail: email,
                customerMobilePhone: phoneNumber,
                successUrl: `${window.location.origin}/api/orders/confirm/${order}`,
                failUrl: `${window.location.origin}/api/orders/fail/${order}`,
              });

await paymentWidget?.requestPayment({
                orderId: order,
                orderName: "order for " + name,
                customerName: name,
                customerEmail: email,
                customerMobilePhone: phoneNumber,
                successUrl: `${window.location.origin}/api/orders/confirm/${order}`,
                failUrl: `${window.location.origin}/api/orders/fail/${order}`,
              });

5 Replies

토스페이먼츠 BOT•3mo ago

⏳ 잠시만 기다려주세요! 곧 답변드리겠습니다

오류 문의일 경우 아래 정보를 미리 전달해주시면, 빠른 답변에 도움이 됩니다.

- 주문번호(orderId) : - 문의 내용 :

(img를 함께 첨부해주시면 도움이됩니다)

* 계약관련 내용은 1544-7772로 문의주세요. * 주말/공휴일에는 답변이 늦을 수 있어요.

Ayaan•3mo ago

Hi @MrPeterss, thank you for reach us. Unfortunately, in Toss Payments' PaymentWidget SDK v1, you must call successUrl and failUrl with SDK call parameters. (It has no choice but to be exposed to the frontend.) Is there a reason why you are reluctant to disclose the successUrl and failUrl endpoints? If there is any way I can guide you in this regard, I will be happy to let you know. Ah, I checked. you want to prevent users from confirming a payment without paying, right? In this case, we suggest you implement the following steps - 1. Saving the amount that is supposed to be paid with orderId (or even more data if you want) on secured data storage such as Redis, Session, DB, etc. 2. On successUrl, query the saved data on step 1 by orderId to see if the saved amount is the same. 3. If the amount is incorrect or it is the case that you don't want it to happen, you can return forbidden status before calling confirm API 4. If the amount is correct, call confirm API as expected. If the user doesn't authenticate (3DS), the API request will declined as Toss doesn't have any card information yet.

MrPeterss•3mo ago

thats a nice solution, but users could still confirm the payment without paying if they know the amount they were supposed to pay for the order

Ayaan•3mo ago

If the user has not yet paid (authenticated), the payment will be declined on Toss Payments' confirm API as Toss does not have card information before the user authenticates the identity in the Card companies' 3DS app.

토스페이먼츠 BOT•3mo ago

❤️ 기술문의 경험이 어떠셨나요?!

간단히 코멘트 남겨주세요! 제품 발전에 큰 힘이 됩니다.