react-native-bootpay-api 1.4.4 → 4.0.0-beta.0

package/package.json

@@ -1,12 +1,15 @@
 {
   "name": "react-native-bootpay-api",
-  "version": "1.4.4",
-  "description": "test",
+  "version": "4.0.0-beta.0",
+  "description": "React Native를 위한 bootpay 라이브러리 입니다.",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
-  "types": "src/index.d.ts",
+  "types": "src/index.d.ts", 
   "react-native": "src/index",
   "source": "src/index",
+  "contributors": [
+    "Bootpay <bootpay.co.kr@gmail.com>"
+  ],
   "files": [
     "src",
     "lib",
@@ -23,14 +26,18 @@
     "!**/__mocks__"
   ],
   "scripts": {
-    "test": "jest",
-    "typescript": "tsc --noEmit",
-    "lint": "eslint \"**/*.{js,ts,tsx}\"",
-    "prepare": "bob build",
-    "release": "release-it",
-    "example": "yarn --cwd example",
-    "pods": "cd example && pod-install --quiet",
-    "bootstrap": "yarn example && yarn && yarn pods"
+    "android": "react-native run-android",
+    "ios": "react-native run-ios --project-path example/ios",
+    "macos": "react-native run-macos --scheme WebviewExample --project-path example/macos",
+    "start": "cd example && react-native start",
+    "windows": "install-windows-test-app --project-directory example/windows && react-native run-windows --root example --arch x64",
+    "ci": "CI=true && yarn lint",
+    "ci:publish": "yarn semantic-release",
+    "lint": "yarn tsc --noEmit && yarn eslint ./src --ext .ts,.tsx",
+    "build": "yarn tsc",
+    "prepare": "yarn build",
+    "appium": "appium",
+    "test:windows": "yarn jest --setupFiles=./jest-setups/jest.setup.js"
   },
   "keywords": [
     "react-native",
@@ -41,103 +48,53 @@
   "author": "bootpay <bootpay.co.kr@gmail.com> (https://github.com/bootpay)",
   "license": "MIT",
   "bugs": {
-    "url": "https://github.com/bootpay/react-native-bootpay-api/issues"
+    "url": "https://bootpay.channel.io/"
   },
-  "homepage": "https://github.com/bootpay/react-native-bootpay-api#readme",
+  "homepage": "https://www.bootpay.co.kr/",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
   },  
   "devDependencies": {
-    "@commitlint/config-conventional": "^11.0.0",
-    "@react-native-community/eslint-config": "^2.0.0",
-    "@release-it/conventional-changelog": "^2.0.0",
+    "@babel/core": "^7.0.0",
+    "@babel/runtime": "^7.0.0",
+    "@react-native-community/cli": "^6.0.0",
+    "@react-native-community/cli-platform-android": "^6.0.0",
+    "@react-native-community/cli-platform-ios": "^6.0.0",
+    "@semantic-release/git": "7.0.16",
+    "@types/invariant": "^2.2.30",
     "@types/jest": "^26.0.0",
-    "@types/react": "^16.9.19",
-    "@types/react-native": "0.62.13",
-    "commitlint": "^11.0.0",
-    "eslint": "^7.2.0",  
-    "jest": "^26.0.1",
-    "pod-install": "^0.1.0",
-    "prettier": "^2.0.5",
-    "react": "16.13.1",
-    "react-native": "0.63.4",
-    "react-native-builder-bob": "^0.18.0",
-    "release-it": "^14.2.2",
-    "typescript": "^4.1.3",
-    "react-native-webview-bootpay": "^11.6.45",
-    "react-native-device-info": "^8.4.0",
+    "@types/react": "^17.0.0",
+    "@types/react-native": "^0.64.0",
+    "@types/selenium-webdriver": "4.0.9",
+    "@typescript-eslint/eslint-plugin": "2.1.0",
+    "@typescript-eslint/parser": "2.1.0",
+    "appium": "1.17.0",
+    "eslint": "6.3.0",
+    "eslint-config-airbnb": "18.0.1",
+    "eslint-config-prettier": "6.2.0",
+    "eslint-plugin-import": "2.18.2",
+    "eslint-plugin-jsx-a11y": "6.2.3",
+    "eslint-plugin-react": "7.14.3",
+    "eslint-plugin-react-native": "3.7.0",
+    "jest": "^26.6.3",
+    "metro-react-native-babel-preset": "^0.66.2",
+    "react": "17.0.2",
+    "react-native": "^0.66.0-0",
+    "react-native-macos": "^0.66.0-0",
+    "react-native-test-app": "^1.3.2",
+    "react-native-windows": "^0.66.0-0",
+    "selenium-appium": "1.0.2",
+    "selenium-webdriver": "4.0.0-alpha.7",
+    "semantic-release": "15.13.24",
+    "typescript": "^4.0.0", 
+    "react-native-webview-bootpay": "^11.18.13",
+    "react-native-device-info": "^8.7.0",
     "react-native-sensitive-info": "^5.5.8",
     "react-native-base64": "^0.2.1", 
-    "react-native-aes-crypto": "^1.3.10"
+    "react-native-aes-crypto": "^2.1.0"
   }, 
   "peerDependencies": {
     "react": "*",
     "react-native": "*"
-  },
-  "jest": {
-    "preset": "react-native",
-    "modulePathIgnorePatterns": [
-      "<rootDir>/example/node_modules",
-      "<rootDir>/lib/"
-    ]
-  }, 
-  "commitlint": {
-    "extends": [
-      "@commitlint/config-conventional"
-    ]
-  },
-  "release-it": {
-    "git": {
-      "commitMessage": "chore: release ${version}",
-      "tagName": "v${version}"
-    },
-    "npm": {
-      "publish": true
-    },
-    "github": {
-      "release": true
-    },
-    "plugins": {
-      "@release-it/conventional-changelog": {
-        "preset": "angular"
-      }
-    }
-  },
-  "eslintConfig": {
-    "root": true,
-    "extends": [
-      "@react-native-community",
-      "prettier"
-    ],
-    "rules": {
-      "prettier/prettier": [
-        "error",
-        {
-          "quoteProps": "consistent",
-          "singleQuote": true,
-          "tabWidth": 2,
-          "trailingComma": "es5",
-          "useTabs": false
-        }
-      ]
-    }
-  },
-  "eslintIgnore": [
-    "node_modules/",
-    "lib/"
-  ], 
-  "react-native-builder-bob": {
-    "source": "src",
-    "output": "lib",
-    "targets": [
-      "commonjs",
-      "module",
-      [
-        "typescript",
-        {
-          "project": "tsconfig.build.json"
-        }
-      ]
-    ]
   }
 }

package/src/BootpayWebView.js

@@ -1,19 +1,37 @@
 
 
-import React, { Component, useRef } from 'react';
-import { SafeAreaView, Modal, Platform, TouchableOpacity, Image, StyleSheet } from 'react-native';
+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 UserInfo from './UserInfo'
 
 export class BootpayWebView extends Component {
+ 
+
     webView = useRef<WebView>(null); 
 
+    
     state = {
         visibility: false, 
         script: '',
         firstLoad: false
     } 
-s
+ 
+    // canGoBack() {
+    //     console.log('canGoBack');
+    //     if(this.webView.current) {
+    //         return this.webView.current.canGoBack();
+    //     }
+    //     return false;
+    // }
+
+    // goBack() {
+    //     console.log('GoBack');
+    //     if(this.webView.goBack) {
+    //         this.webView.current.goBack();
+    //     }
+    // }
+
     async componentWillUnmount() {
         this.setState(
             {
@@ -25,12 +43,13 @@ s
         UserInfo.setBootpayLastTime(Date.now());
     }
  
-    render() {
-
-
+    render() { 
         return <Modal
             animationType={'slide'}
-            transparent={false}
+            transparent={false} 
+            onRequestClose={()=> { 
+                this.dismiss();
+            }}
             visible={this.state.visibility}>
             <SafeAreaView style={{ flex: 1 }}>
                 {
@@ -58,15 +77,20 @@ s
                 }
                 <WebView
                     ref={(wv) => this.webView = wv}
+                    // ref={btWebView}
                     useWebKit={true}
                     originWhitelist={['*']}
                     source={{
-                        uri: 'https://inapp.bootpay.co.kr/3.3.3/production.html'
+                        uri: 'https://webview.bootpay.co.kr/4.0.0/'
+                    }}
+                    onRequestClose={()=> {
+                        console.log('onRequestClose');
+                        this.dismiss();
                     }}
                     injectedJavaScript={this.state.script}
                     javaScriptEnabled={true}
                     javaScriptCanOpenWindowsAutomatically={true}
-                    scalesPageToFit={true} 
+                    // scalesPageToFit={true} 
                     onMessage={this.onMessage}
                     onShouldStartLoadWithRequest={this.onShouldStartLoadWithRequest}
                 />
@@ -75,22 +99,24 @@ s
         </Modal>
     }
 
-    request = async (payload, items, user, extra) => {        
+    requestPayment = async (payload, items, user, extra) => {        
+        this.bootpayRequest(payload, items, user, extra, "requestPayment");
+    }
+
+    requestSubscription = async (payload, items, user, extra) => {        
+        this.bootpayRequest(payload, items, user, extra, "requestSubscription");
+    }
 
+    requestAuthentication = async (payload, items, user, extra) => {        
+        this.bootpayRequest(payload, items, user, extra, "requestAuthentication");
+    }
+
+    bootpayRequest = async (payload, items, user, extra, requestMethod) => {              
         payload.application_id =  Platform.OS == 'ios' ? this.props.ios_application_id : this.props.android_application_id;
         payload.items = items;
         payload.user_info = user;
         payload.extra = extra; 
- 
-
-        var quickPopup = '';
-
-        if(extra != undefined && extra.quick_popup != undefined) {
-            if(extra.quick_popup == 1) {
-                quickPopup = 'BootPay.startQuickPopup();';
-            }
-        } 
-        
+  
 
         //visibility가 true가 되면 webview onLoaded가 실행됨
         this.setState(
@@ -99,15 +125,17 @@ s
                 script: `
                 ${await this.getMountJavascript()}
                 ${quickPopup}
-                ${this.generateScript(payload)}
+                ${this.generateScript(payload, requestMethod)}
                 `,
                 firstLoad: false,
                 showCloseButton: extra.show_close_button || false  
             }
         ) 
 
-        UserInfo.updateInfo();
+        UserInfo.updateInfo();  
     }
+ 
+
 
     dismiss = () => {
         this.setState(
@@ -127,15 +155,21 @@ s
     }
 
 
-    generateScript= (payload) => { 
-        const onError = '.error(function(data){ window.BootpayRNWebView.postMessage( JSON.stringify(data) ); })';
-        const onCancel = '.cancel(function(data){ window.BootpayRNWebView.postMessage( JSON.stringify(data) ); })';
-        const onReady = '.ready(function(data){ window.BootpayRNWebView.postMessage( JSON.stringify(data) ); })';
-        const onConfirm = '.confirm(function(data){ window.BootpayRNWebView.postMessage( JSON.stringify(data) ); })';
-        const onClose = '.close(function(data){ window.BootpayRNWebView.postMessage("close"); })';
-        const onDone = '.done(function(data){ window.BootpayRNWebView.postMessage( JSON.stringify(data) ); })';
+    generateScript= (payload, requestMethod) => {  
+        var requestMethod = "requestPayment";
+
+        const script = "Bootpay." + requestMethod + 
+        `(${JSON.stringify(payload)})` +
+        ".then( function (res) {" + 
+        confirm() + 
+        issued() + 
+        done() + 
+        "}, function (res) {" +
+        error() + 
+        cancel() + 
+        "})";
 
-        return `BootPay.request(${JSON.stringify(payload)})` + onError + onCancel + onReady + onConfirm + onClose + onDone + '; void(0);';
+        this.callJavaScript(script);
     }
 
     onMessage = ({ nativeEvent }) => { 
@@ -193,9 +227,9 @@ s
 
     getBootpayPlatform = () => { 
         if(Platform.OS == 'ios') {
-            return "BootPay.setDevice('IOS');";
+            return "Bootpay.setDevice('IOS');";
         } else if(Platform.OS == 'android'){
-            return "BootPay.setDevice('ANDROID');"; 
+            return "Bootpay.setDevice('ANDROID');"; 
         }
     }
 
@@ -208,18 +242,23 @@ s
         // }
     // } 
 
-    transactionConfirm = (data) => {
-        // console.log('transactionConfirm: ' + data);
-
-        var json = JSON.stringify(data)
-        this.callJavaScript(`
-        BootPay.transactionConfirm(${json});
-          `);
+    transactionConfirm = () => { 
+        const script = "Bootpay.confirm()" + 
+        ".then( function (res) {" + 
+        confirm() + 
+        issued() + 
+        done() + 
+        "}, function (res) {" +
+        error() + 
+        cancel() + 
+        "})";
+
+        this.callJavaScript(script);
     }
 
     removePaymentWindow = () => {
         this.callJavaScript(`
-        BootPay.removePaymentWindow();
+        Bootpay.removePaymentWindow();
           `);
     } 
 
@@ -236,14 +275,38 @@ s
 
     getAnalyticsData = async () => { 
         const uuid = await UserInfo.getBootpayUUID(); 
-        const bootpaySK = await UserInfo.getBootpaySK();
+        // const bootpaySK = await UserInfo.getBootpaySK();
         const bootLastTime = await UserInfo.getBootpayLastTime();      
 
 
         const elaspedTime = Date.now() - bootLastTime;  
-        return `window.BootPay.setAnalyticsData({uuid:'${uuid}',sk:'${bootpaySK}',sk_time:${bootLastTime},time:${elaspedTime}});`;
+        return `window.Bootpay.$analytics.setAnalyticsData({uuid:'${uuid}', time:${elaspedTime}});`;
         // this.callJavaScript(`window.BootPay.setAnalyticsData({uuid:'${uuid}',sk:'${bootpaySK}',sk_time:${bootLastTime},time:${elaspedTime}});`); 
     }
+
+    confirm = () => {
+        return "if (res.event === 'confirm') { window.BootpayRNWebView.postMessage( JSON.stringify(res) ); }";
+    }
+
+    done = () => {
+        return "else if (res.event === 'done') { window.BootpayRNWebView.postMessage( JSON.stringify(res) ); }";
+    }
+
+    issued = () => {
+        return "else if (res.event === 'issued') { window.BootpayRNWebView.postMessage( JSON.stringify(res) ); }";
+    }
+
+    error = () => {
+        return "if (res.event === 'error') { window.BootpayRNWebView.postMessage( JSON.stringify(res) ); }";
+    }
+
+    cancel = () => {
+        return "else if (res.event === 'cancel') { window.BootpayRNWebView.postMessage( JSON.stringify(res) ); }";
+    }
+
+    close = () => {
+        return "document.addEventListener('bootpayclose', function (e) {  window.BootpayRNWebView.postMessage('close'); });";
+    }
 } 
 
 

package/src/UserInfo.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UserInfo.d.ts","sourceRoot":"","sources":["UserInfo.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIlC,MAAM,CAAC,OAAO,OAAO,QAAS,SAAQ,SAAS;IAC3C,MAAM,CAAC,cAAc,QAAS,MAAM,cAAc,GAAG,sBAYpD;IAED,MAAM,CAAC,cAAc,QAAS,MAAM,OAAO,GAAG,sBAW7C;IAED,MAAM,CAAC,cAAc,yBAGpB;IAED,MAAM,CAAC,YAAY,yBAElB;IAED,MAAM,CAAC,YAAY,QAAS,MAAM,sBAEjC;IAED,MAAM,CAAC,YAAY,SAAU,MAAM,QAAQ,MAAM,sBAEhD;IAED,MAAM,CAAC,kBAAkB,yBAExB;IAED,MAAM,CAAC,kBAAkB,CAAC,GAAG,EAAE,MAAM;IAIrC,MAAM,CAAC,gBAAgB;IAIvB,MAAM,CAAC,gBAAgB,QAAS,MAAM,sBAErC;IAED,MAAM,CAAC,UAAU,sBAWhB;CACJ"}

package/src/UserInfo.js

@@ -0,0 +1,67 @@
+import { Component } from 'react';
+import DeviceInfo from 'react-native-device-info';
+import SInfo from 'react-native-sensitive-info';
+export default class UserInfo extends Component {
+    static getBootpayInfo = (key, defaultVal) => {
+        return new Promise((resolve, reject) => {
+            SInfo.getItem(key, {
+                sharedPreferencesName: 'bootpaySharedPrefs',
+                keychainService: 'bootpayKeychain'
+            }).then((res) => {
+                res == undefined ? resolve(defaultVal) : resolve(res);
+                resolve(res);
+            }).catch((error) => {
+                reject(error);
+            });
+        });
+    };
+    static setBootpayInfo = (key, val) => {
+        return new Promise((resolve, reject) => {
+            SInfo.setItem(String(key), String(val), {
+                sharedPreferencesName: 'bootpaySharedPrefs',
+                keychainService: 'bootpayKeychain'
+            }).then((res) => {
+                resolve(res);
+            }).catch((error) => {
+                reject(error);
+            });
+        });
+    };
+    static getBootpayUUID = () => {
+        let uuid = DeviceInfo.getUniqueId();
+        return UserInfo.setBootpayInfo('uuid', uuid);
+    };
+    static getBootpaySK = () => {
+        return UserInfo.getBootpayInfo('bootpay_sk', '');
+    };
+    static setBootpaySK = (val) => {
+        return UserInfo.setBootpayInfo('bootpay_sk', val);
+    };
+    static newBootpaySK = (uuid, time) => {
+        return UserInfo.setBootpaySK(`${uuid}_${time}`);
+    };
+    static getBootpayLastTime = async () => {
+        return await UserInfo.getBootpayInfo('bootpay_last_time', 0);
+    };
+    static setBootpayLastTime(val) {
+        return UserInfo.setBootpayInfo('bootpay_last_time', val);
+    }
+    static getBootpayUserId() {
+        return UserInfo.getBootpayInfo('bootpay_user_id', '');
+    }
+    static setBootpayUserId = (val) => {
+        return UserInfo.setBootpayInfo('bootpay_user_id', val);
+    };
+    static updateInfo = async () => {
+        const uuid = await UserInfo.getBootpayUUID();
+        const bootpaySK = await UserInfo.getBootpaySK();
+        const lastTime = await UserInfo.getBootpayLastTime();
+        let current = Date.now();
+        if (bootpaySK == '')
+            await UserInfo.newBootpaySK(uuid, current);
+        const isExpired = current - lastTime > 30 * 60 * 1000;
+        if (isExpired)
+            await UserInfo.newBootpaySK(uuid, current);
+        await UserInfo.setBootpayLastTime(current);
+    };
+}

package/CHANGELOG.md

@@ -1,20 +0,0 @@
-### 1.4.4
-- 사용하지 않은 패키지 제거 
-
-### 1.4.3
-- bootpay anlaytics api 추가 
-
-### 1.0.4
-- typescript declare 적용 
-
-### 1.0.3
-- close button 클릭시 onCancel, onClose 이벤트 호출 
-
-### 1.0.2
-- callJavascript 버그 수정 
-
-### 1.0.1
-- close.png 못찾는 버그 수정 
-
-### 1.0.0
-- first release  

package/lib/commonjs/BootpayAnalytics.js

@@ -1,131 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.pageTrace = exports.userTrace = void 0;
-
-var _reactNativeBase = _interopRequireDefault(require("react-native-base64"));
-
-var _reactNativeDeviceInfo = _interopRequireDefault(require("react-native-device-info"));
-
-var _reactNative = require("react-native");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-// import CryptoJS from 'crypto-js'; 
-var Aes = _reactNative.NativeModules.Aes;
-
-const userTrace = async (applicationId, userId, phone, email, gender, birth, area) => {
-  try {
-    const payload = {
-      "id": userId,
-      "ver": _reactNativeDeviceInfo.default.getVersion(),
-      "application_id": applicationId,
-      "phone": phone,
-      "email": email,
-      "gender": gender,
-      "birth": birth,
-      "area": area
-    };
-    var key = getRandomKey(32);
-    var iv = getRandomKey(16);
-
-    try {
-      const data = await Aes.encrypt(JSON.stringify(payload), stringToHex(key), stringToHex(iv)).then(cipher => cipher);
-      const response = await fetch('https://analytics.bootpay.co.kr/login', {
-        method: 'POST',
-        headers: {
-          Accept: 'application/json',
-          'Content-Type': 'application/json'
-        },
-        body: JSON.stringify({
-          data: data,
-          session_key: await getSessionKey(key, iv)
-        })
-      });
-      const json = await response.json();
-      return json;
-    } catch (e) {
-      console.log(e);
-    }
-  } catch (error) {
-    console.error(error);
-  }
-};
-
-exports.userTrace = userTrace;
-
-const pageTrace = async (applicationId, url, pageType, items) => {
-  try {
-    const payload = {
-      "application_id": applicationId,
-      "url": url,
-      "page_type": pageType,
-      "items": items,
-      "referer": ''
-    };
-    var key = getRandomKey(32);
-    var iv = getRandomKey(16);
-
-    try {
-      const data = await Aes.encrypt(JSON.stringify(payload), stringToHex(key), stringToHex(iv)).then(cipher => cipher);
-      const response = await fetch('https://analytics.bootpay.co.kr/call', {
-        method: 'POST',
-        headers: {
-          Accept: 'application/json',
-          'Content-Type': 'application/json'
-        },
-        body: JSON.stringify({
-          data: data,
-          session_key: await getSessionKey(key, iv)
-        })
-      });
-      const json = await response.json();
-      return json;
-    } catch (e) {
-      console.log(e);
-    }
-  } catch (error) {
-    console.error(error);
-  }
-};
-
-exports.pageTrace = pageTrace;
-
-const stringToHex = str => {
-  var hex = '';
-
-  for (var i = 0, l = str.length; i < l; i++) {
-    hex += str.charCodeAt(i).toString(16);
-  }
-
-  return hex;
-};
-
-const getRandomKey = length => {
-  var text = '';
-  var keys = 'abcdefghijklmnopqrstuvwxyz1234567890ABCDEFGHIJKLMNOPQRSTUVWXYZ';
-
-  for (var i = 0; i < length; i++) text += keys.charAt(Math.floor(Math.random() * keys.length));
-
-  return text;
-};
-
-const getSessionKey = async (key, iv) => {
-  const keyValue = _reactNativeBase.default.encode(key);
-
-  const ivValue = _reactNativeBase.default.encode(iv);
-
-  return `${keyValue}##${ivValue}`;
-};
-
-const strEncode = async (str, key, iv) => {
-  return await Aes.encrypt(str, key, iv).then(cipher => {
-    Aes.hmac256(cipher, key).then(hash => {
-      console.log('HMAC', hash);
-      return hash;
-    });
-  });
-};
-//# sourceMappingURL=BootpayAnalytics.js.map