googlepay secrets implementation (#180)

* googlepay secrets impl * remove unnecessary DEFAULT_CONFIG usages * corrects gatewayMerchantId key and fixes page to display googlepay tokens * use test env (prod not yet enabled) Co-authored-by: Huawei Gu <hgu@circle.com>
circlefin · Mar 9, 2022 · c470133 · c470133
1 parent 0c1c8a6
commit c470133
Show file tree

Hide file tree

Showing 3 changed files with 56 additions and 14 deletions.
diff --git a/lib/googlePay.ts b/lib/googlePay.ts
@@ -51,6 +51,9 @@ interface PaymentToken {
 interface PaymentRequestConfig {
   amount: string
   environment: Environment
+  merchantId: string
+  merchantName: string
+  checkoutKey: string
 }
 
 function getIsReadyToPayRequest() {
@@ -67,21 +70,25 @@ function getPaymentDataRequest(config: PaymentRequestConfig) {
     config.amount === null
       ? DEFAULT_CONFIG.transactionInfo.totalPrice
       : config.amount
-
   const paymentDataRequest: PaymentDataRequest = {
     apiVersion: DEFAULT_CONFIG.apiVersion,
     apiVersionMinor: DEFAULT_CONFIG.apiVersionMinor,
     merchantInfo: {
-      merchantId: DEFAULT_CONFIG.merchantInfo.merchantId,
-      merchantName: DEFAULT_CONFIG.merchantInfo.merchantName,
+      merchantId: config.merchantId,
+      merchantName: config.merchantName,
     },
     allowedPaymentMethods: [
       {
         type: DEFAULT_CONFIG.allowedPaymentMethods.type,
         parameters: DEFAULT_CONFIG.allowedPaymentMethods.parameters,
-        tokenizationSpecification: <PaymentMethodTokenizationSpecification>(
-          DEFAULT_CONFIG.tokenizationSpecification
-        ),
+        tokenizationSpecification: <PaymentMethodTokenizationSpecification>{
+          type: DEFAULT_CONFIG.tokenizationSpecification.type,
+          parameters: {
+            gateway:
+              DEFAULT_CONFIG.tokenizationSpecification.parameters.gateway,
+            gatewayMerchantId: config.checkoutKey,
+          },
+        },
       },
     ],
     transactionInfo: <TransactionInfo>{

diff --git a/pages/debug/payments/digitalWallets/convertToken.vue b/pages/debug/payments/digitalWallets/convertToken.vue
@@ -22,7 +22,11 @@
             Autogenerate token
           </v-btn>
           <div v-if="displayGooglePayButton" id="google-pay-button"></div>
-          <v-card v-if="tokensGenerated" class="body-1 px-6 py-8 mb-4">
+          <v-card
+            v-if="tokensGenerated"
+            max-width="400"
+            class="body-1 px-6 py-8 mb-4"
+          >
             <h2 class="title">Token Information</h2>
             <p class="font-weight-light mt-2">
               Protocol Version: {{ formData.protocolVersion }}
@@ -78,6 +82,11 @@ import {
 } from '~/lib/googlePay'
 import ButtonOptions = google.payments.api.ButtonOptions
 import PaymentData = google.payments.api.PaymentData
+import {
+  checkoutKey,
+  merchantId,
+  merchantName,
+} from '~/server-middleware/googlePaySecrets'
 
 @Component({
   components: {
@@ -95,7 +104,7 @@ import PaymentData = google.payments.api.PaymentData
 export default class ConvertToken extends Vue {
   formData = {
     type: 'Google Pay',
-    protocolVersion: 'ECv1',
+    protocolVersion: '',
     signature: '',
     signedMessage: '',
     amount: '0.00',
@@ -114,10 +123,12 @@ export default class ConvertToken extends Vue {
     allowedPaymentMethods: [DEFAULT_CONFIG.allowedPaymentMethods],
   }
 
+  // Production environment is not yet enabled for googlepay - will uncomment lines 129-131 when it is
   getGooglePayEnvironment() {
-    return getLive()
-      ? DEFAULT_CONFIG.environment.prod
-      : DEFAULT_CONFIG.environment.test
+    return DEFAULT_CONFIG.environment.test
+    // return getLive() && !getIsStaging()
+    //   ? DEFAULT_CONFIG.environment.prod
+    //   : DEFAULT_CONFIG.environment.test
   }
 
   mounted() {
@@ -151,20 +162,25 @@ export default class ConvertToken extends Vue {
   }
 
   onGooglePayButtonClicked() {
-    const env = this.getGooglePayEnvironment()
-    const paymentsClient = getGooglePaymentsClient(env)
+    const environment = this.getGooglePayEnvironment()
+    const paymentsClient = getGooglePaymentsClient(environment)
     const paymentDataConfig: PaymentRequestConfig = {
       amount: this.formData.amount,
-      environment: env,
+      environment,
+      merchantId,
+      merchantName,
+      checkoutKey,
     }
     paymentsClient
       .loadPaymentData(getPaymentDataRequest(paymentDataConfig))
       .then((paymentData: PaymentData) => {
         const paymentTokenString =
           paymentData.paymentMethodData.tokenizationData.token // payment token as JSON string
         const paymentToken: PaymentToken = JSON.parse(paymentTokenString) // payment token as object with keys protocolVersion, signature, and signedMessage
+        this.formData.protocolVersion = paymentToken.protocolVersion
         this.formData.signature = paymentToken.signature
         this.formData.signedMessage = paymentToken.signedMessage
+        this.tokensGenerated = true
       })
       .catch(function (err: any) {
         console.error(err)

diff --git a/server-middleware/googlePaySecrets.ts b/server-middleware/googlePaySecrets.ts
@@ -0,0 +1,19 @@
+const googlePaySecretsAreSet = !(
+  process.env.GOOGLE_PAY_PAYFAC_MERCHANT_ID == null ||
+  process.env.GOOGLE_PAY_PAYFAC_MERCHANT_NAME == null ||
+  process.env.GOOGLE_PAY_PAYFAC_CHECKOUT_KEY == null
+)
+
+const merchantId: string = googlePaySecretsAreSet
+  ? process.env.GOOGLE_PAY_PAYFAC_MERCHANT_ID!
+  : ''
+
+const merchantName: string = googlePaySecretsAreSet
+  ? process.env.GOOGLE_PAY_PAYFAC_MERCHANT_NAME!
+  : ''
+
+const checkoutKey: string = googlePaySecretsAreSet
+  ? process.env.GOOGLE_PAY_PAYFAC_CHECKOUT_KEY!
+  : ''
+
+export { merchantId, merchantName, checkoutKey }