인프런 커뮤니티 질문&답변

덕분에 문제를 해결하였습니다 !! 감사드려요 !!

감사드립니다. 저도 해결했어요!!

해당 사항을 모두 확인하였는데 여전히 404 에러뜹니다. 강의에서 나온거처럼 포트원 테스트 결제로 하고있는데, 테스트 결제로 받은 impUid는 404 에러 뜨는걸까요 ? GraphQL API 문제 페이지에서 createPointTransactionOfLoading API 호출해봐도 404 에러뜹니다. 저의 코드를 보고 답변을 해주시면 감사하겠습니다.

PointModal.index.tsx

const onClickAddPoint = () => {
    const IMP = window.IMP
    IMP.init('imp31236121')
    IMP.request_pay(
      {
        pg: 'kakaopay',
        pay_method: 'card',
        merchant_uid: `payment-${new Date().getTime()}`, // 주문 고유 번호
        name: '마우스',
        amount: selectedPoint,
        buyer_email: 'admin@joonggomarket.com',
        buyer_name: '김지환',
        buyer_tel: '010-5838-5146',
        buyer_addr: '경기도 용인시 기흥구',
        buyer_postcode: '01181',
        m_redirect_url: 'http://localhost:3000/markets', // 모바일에서는 결제시, 페이지 주소가 바뀜. 따라서, 결제 끝나고 돌아갈 주소 입력해야함
      },
      async function (response: any) {
        console.log(response)
        const { success, imp_uid } = response
        if (success) {
          await createPointTransactionOfLoading(imp_uid)
        } else {
          Modal.error({ content: '카카오페이 결제를 정상적으로 처리하지 못하였습니다.' })
        }
      }
    )
  }

useMutationCreatePointTransactionOfLoading.tsx

import { gql, useMutation } from '@apollo/client'
import { Modal } from 'antd'
import type {
  IMutation,
  IMutationCreatePointTransactionOfLoadingArgs,
} from 'src/commons/types/generated/types'
import { useRouter } from 'next/router'
import { FETCH_USER_LOGGEDIN } from '../../quires/user/useQueryFetchUserLoggedIn'

export const CREATE_POINT_TRANSACTION_OF_LOADING = gql`
  mutation createPointTransactionOfLoading($impUid: ID!) {
    createPointTransactionOfLoading(impUid: $impUid) {
      _id
      amount
    }
  }
`

export const useMutationCreatePointTransactionOfLoading = () => {
  const router = useRouter()
  const [createPointTransactionOfLoadingMutation, { loading }] = useMutation<
    Pick<IMutation, 'createPointTransactionOfLoading'>,
    IMutationCreatePointTransactionOfLoadingArgs
  >(CREATE_POINT_TRANSACTION_OF_LOADING)

  const createPointTransactionOfLoading = async (
    impUid: IMutationCreatePointTransactionOfLoadingArgs['impUid']
  ): Promise<void> => {
    try {
      const result = await createPointTransactionOfLoadingMutation({
        variables: {
          impUid,
        },
        refetchQueries: [
          {
            query: FETCH_USER_LOGGEDIN,
          },
        ],
      })
      Modal.success({
        content: `${new Intl.NumberFormat('en-US').format(result?.data.createPointTransactionOfLoading.amount)}원 포인트 충전이 완료되었습니다.`,
      })
    } catch (error) {
      if (error instanceof Error) Modal.error({ content: error.message })
    }
  }

  return { createPointTransactionOfLoading, loading }
}