Stripe() 값이 잘못되었습니다.apiKey는 문자열이어야 합니다.지정한: 정의되지 않음

Stripe() 값이 잘못되었습니다.apiKey는 문자열이어야 합니다.지정한: 정의되지 않음

"Vue Stripe Checkout 3" 컴포넌트를 사용하고 있는데 구현하려고 하면 다음 오류가 나타납니다.

Invalid value for Stripe (): apiKey should be a string. You specified: undefined.

데이터에는 다음이 있습니다.

publishableKey: process.env.PUBLISHABLE_KEY,

또한 키를 직접 추가하려고 했는데(publishableKey: 'my key') 동작하지 않았습니다.소품 안에 직접 넣으려고 했는데 아무것도 안 넣었어요.

<template>
<div>
          <stripe-checkout 
          ref="checkoutRef" 
          :pk="publishableKey"
          :items="items"
          :successUrl="successUrl"
          :cancelUrl="cancelUrl">

    <template slot="checkout-button">
      <button @click="checkout" class="btn-yellow wow fadeInUp btn" style="visibility: visible; animation-name: fadeInUp;">Pagar</button>
    </template>
  </stripe-checkout>
       
</div>
</template>

<script>
import { StripeCheckout } from 'vue-stripe-checkout';

export default {
   components: {
    StripeCheckout
  },
   data: () => ({
    loading: false,
publishableKey: 'sk_test_51H85e2F5x69G5dDPxFEtO0RyIBWBEWkqwV9fpN5ovLysfCxJ15kfyeALoUFdZNi57yt0zj40h4LV3l5Zkra6WPCw00by0N0W3a',
    items: [
      {
        sku: item.sku, 
        quantity: 1
      }
    ],
    successUrl: 'https://tarfut.es',
    cancelUrl: 'https://tarfut.es',
  }),
    
    methods: {
      checkout () {
      this.$refs.checkoutRef.redirectToCheckout();
    },
    },
}
</script>

잘 부탁드립니다.

Next.js 앱에서도 비슷한 오류가 발생했는데, 이 오류는 키를 입력함으로써 해결했습니다.string.

교체 시도:

publishableKey: process.env.PUBLISHABLE_KEY,

포함:

publishableKey: `${process.env.PUBLISHABLE_KEY}`,

이는 에서 설정할 env 변수를 nuxt 어플리케이션에 지정하지 않았기 때문입니다.

정확해야 합니다.nuxt.config.js생산에서 접근할 수 있어야 합니다.

export default {
    mode: 'universal',
    env: {
        API_BASE_URL: process.env.API_BASE_URL,
        STRIPE_API_KEY: process.env.STRIPE_API_KEY,
        GOOGLE_ANALYTICS: process.env.GOOGLE_ANALYTICS
        ...
    },
    ...

여기 공식 문서가 있습니다.

언급URL : https://stackoverflow.com/questions/63059353/invalid-value-for-stripe-apikey-should-be-a-string-you-specified-undefined