react-native-bootpay-api 4.0.9 → 4.1.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-bootpay-api",
-  "version": "4.0.9",
+  "version": "4.1.2",
   "description": "React Native를 위한 bootpay 라이브러리 입니다.",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
@@ -91,7 +91,8 @@
     "react-native-device-info": "^8.7.0",
     "react-native-sensitive-info": "^5.5.8",
     "react-native-base64": "^0.2.1", 
-    "react-native-aes-crypto": "^2.1.0"
+    "react-native-aes-crypto": "^2.1.0",
+    "lodash": "^4.17.21"
   }, 
   "peerDependencies": {
     "react": "*",

package/src/BootpayWebView.js

@@ -3,6 +3,7 @@
 import React, { Component, useRef, useEffect } from 'react';
 import { SafeAreaView, Modal, Platform, TouchableOpacity, Image, StyleSheet,  BackHandler} from 'react-native';
 import WebView  from 'react-native-webview-bootpay';
+import {debounce} from 'lodash';
 import UserInfo from './UserInfo'
 
 export class BootpayWebView extends Component {
@@ -10,7 +11,7 @@ export class BootpayWebView extends Component {
 
     webView = useRef<WebView>(null); 
 
-    _VERSION = "4.0.8";
+    _VERSION = "4.1.2";
     _DEBUG = false;
     _payload = {};
 
@@ -31,12 +32,20 @@ export class BootpayWebView extends Component {
         )
         UserInfo.setBootpayLastTime(Date.now());
     } 
+
+    componentDidMount() {
+        this.closeDismiss = debounce(this.closeDismiss, 30); 
+    }
+
+
     render() { 
         return <Modal
             animationType={'slide'}
             transparent={false} 
             onRequestClose={()=> { 
-                this.dismiss();
+                this.closeDismiss();
+                // console.log(1234);
+                // this.dismiss();
             }}
             visible={this.state.visibility}>
             <SafeAreaView style={{ flex: 1 }}>
@@ -54,7 +63,7 @@ export class BootpayWebView extends Component {
                             }
                             
                             if(this.props.onCancel != undefined) this.props.onCancel(cancelData);
-                            if(this.props.onClose != undefined) this.props.onClose(closeData); 
+                            if(this.props.onClose != undefined) this.props.onClose(); 
 
                             this.setState({visibility: false})
                         } }>
@@ -69,11 +78,7 @@ export class BootpayWebView extends Component {
                     originWhitelist={['*']}
                     source={{
                         uri: 'https://webview.bootpay.co.kr/4.0.6/'
-                    }}
-                    onRequestClose={()=> {
-                        // console.log('onRequestClose');
-                        this.dismiss();
-                    }}
+                    }} 
                     injectedJavaScript={this.state.script}
                     javaScriptEnabled={true}
                     javaScriptCanOpenWindowsAutomatically={true}
@@ -152,6 +157,16 @@ export class BootpayWebView extends Component {
         UserInfo.updateInfo();  
     }
  
+    // debounceClose = () => {
+    //     // deboun
+    //     console.log('debounceClose');
+    //     _.debounce(this.closeDismiss, 30); 
+    // }
+
+    closeDismiss = () => { 
+        if(this.props.onClose != undefined) this.props.onClose();
+        this.dismiss();
+    }
 
 
     dismiss = () => {
@@ -193,7 +208,7 @@ export class BootpayWebView extends Component {
     }
 
     onMessage = ({ nativeEvent }) => { 
-        // console.log(`onMessage: ${nativeEvent}, ${JSON.stringify(nativeEvent)}`);
+        console.log(`onMessage: ${nativeEvent}, ${JSON.stringify(nativeEvent)}`);
 
         if (nativeEvent == undefined) return;
 
@@ -201,61 +216,90 @@ export class BootpayWebView extends Component {
          
     
         if(res.data == 'close') {
-            if(this.props.onClose == undefined) return;
-            var json = {
-                action: 'BootpayClose',
-                message: '결제창이 닫혔습니다'
-            } 
-            this.props.onClose(json);
-            this.dismiss();
+            this.closeDismiss();
+            // if(this.props.onClose == undefined) return;
+            // var json = {
+            //     action: 'BootpayClose',
+            //     message: '결제창이 닫혔습니다'
+            // } 
+            // this.props.onClose();
+            // this.dismiss();
             return;
         }
 
  
         const data = JSON.parse(res.data);
         // console.log(`redirect: ${JSON.stringify(data)}`);
- 
-        switch (data.event) {
-            case 'cancel':
-                if(this.props.onCancel != undefined) this.props.onCancel(data); 
-                break;
-            case 'error':
-                if(this.props.onError != undefined) this.props.onError(data); 
-                break;
-            case 'issued':
-                if(this.props.onIssued != undefined) this.props.onIssued(data);
-                break;
-            case 'confirm':
-                if(this.props.onConfirm != undefined) this.props.onConfirm(data);
-                break;
-            case 'done':
-                if(this.props.onDone != undefined) this.props.onDone(data); 
-                break;
-            case 'close':
-                if(this.props.onClose != undefined) this.props.onClose(data);
-                this.dismiss();
-                break; 
-        }
- 
-        
 
-        if(this._payload != undefined && this._payload.extra != undefined && this._payload.extra.open_type == 'redirect') {
-            
-           
-            if(data.event == 'done' && this._payload.extra.display_success_result != true) { 
-                if(this.props.onClose != undefined) this.props.onClose(data);
-                this.dismiss();
-            } else if(data.event == 'error' && this._payload.extra.display_error_result != true ) { 
-                if(this.props.onClose != undefined) this.props.onClose(data);
-                this.dismiss();
-            } else if(data.event == 'issued' && this._payload.extra.display_success_result != true ) { 
-                if(this.props.onClose != undefined) this.props.onClose(data);
-                this.dismiss();
-            } else if(data.event == 'cancel') {
-                if(this.props.onClose != undefined) this.props.onClose(data);
-                this.dismiss();
+        redirect = false;
+        show_success = false; 
+        show_error = false; 
+        if(this._payload != undefined && this._payload.extra != undefined) { 
+            if(this._payload.extra.open_type == 'redirect') {
+                redirect = true; 
             }
+            if(this._payload.extra.display_error_result == true) {
+                show_error = true; 
+            }
+            if(this._payload.extra.display_success_result == 'redirect') {
+                show_success = true; 
+            }
+            
         }
+
+        if(redirect == true) {
+            switch (data.event) {
+                case 'cancel':
+                    if(this.props.onCancel != undefined) this.props.onCancel(data); 
+                    this.closeDismiss(); 
+                    break;
+                case 'error':
+                    if(this.props.onError != undefined) this.props.onError(data); 
+                    if(show_error == false) {
+                        this.closeDismiss(); 
+                    }
+                    break;
+                case 'issued':
+                    if(this.props.onIssued != undefined) this.props.onIssued(data);
+                    if(show_success == false) {
+                        this.closeDismiss(); 
+                    }
+                    break;
+                case 'confirm':
+                    if(this.props.onConfirm != undefined) this.props.onConfirm(data);
+                    break;
+                case 'done':
+                    if(this.props.onDone != undefined) this.props.onDone(data); 
+                    if(show_success == false) {
+                        this.closeDismiss(); 
+                    }
+                    break;
+                case 'close':
+                    this.closeDismiss(); 
+                    break; 
+            }
+        } else {
+            switch (data.event) {
+                case 'cancel':
+                    if(this.props.onCancel != undefined) this.props.onCancel(data); 
+                    break;
+                case 'error':
+                    if(this.props.onError != undefined) this.props.onError(data); 
+                    break;
+                case 'issued':
+                    if(this.props.onIssued != undefined) this.props.onIssued(data);
+                    break;
+                case 'confirm':
+                    if(this.props.onConfirm != undefined) this.props.onConfirm(data);
+                    break;
+                case 'done':
+                    if(this.props.onDone != undefined) this.props.onDone(data); 
+                    break;
+                case 'close':
+                    this.closeDismiss(); 
+                    break; 
+            }
+        }  
     }
 
     onShouldStartLoadWithRequest = (url) => { 
@@ -298,16 +342,16 @@ export class BootpayWebView extends Component {
     // } 
 
     transactionConfirm = () => { 
-        const script = "Bootpay.confirm();"
-        //  + 
-        // ".then( function (res) {" + 
-        // this.confirm() + 
-        // this.issued() + 
-        // this.done() + 
-        // "}, function (res) {" +
-        // this.error() + 
-        // this.cancel() + 
-        // "})";
+        const script = "Bootpay.confirm()"
+         + 
+        ".then( function (res) {" + 
+        this.confirm() + 
+        this.issued() + 
+        this.done() + 
+        "}, function (res) {" +
+        this.error() + 
+        this.cancel() + 
+        "})";
 
         this.callJavaScript(script);
     }
@@ -325,8 +369,14 @@ export class BootpayWebView extends Component {
         // console.log('callJavascript: ' + script);
 
         this.webView.injectJavaScript(`
-        javascript:(function(){${script} })()
+        setTimeout(function() { ${script} }, 30);
         `);
+
+        // this.webView.injectJavaScript(`
+        // javascript:(function(){${script} })()
+        // `);
+
+        
         //   this.webView.evalu
     }