@bootpay/client-js 5.0.0-beta.9 → 5.0.0-rc.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +10 -1
- package/dist/index.es.js +4933 -6288
- package/dist/index.umd.js +2 -1
- package/dist/package.json.d.ts +4 -2
- package/dist/src/bootpay-widget.d.ts +6 -2
- package/dist/src/bootpay.d.ts +2 -1
- package/dist/src/lib/bootpay-widget.d.ts +14 -1
- package/dist/src/lib/bootpay.d.ts +1 -1
- package/dist/src/lib/event/widget.d.ts +17 -0
- package/dist/src/lib/template/modal.d.ts +16 -0
- package/dist/src/lib/template/payment.d.ts +3 -3
- package/dist/src/lib/template/widget.d.ts +6 -1
- package/dist/src/models/bootpay-interface.d.ts +18 -0
- package/dist/src/models/bootpay-widget-interface.d.ts +6 -0
- package/dist/src/support/environment.d.ts +2 -1
- package/dist/src/support/event-logger.d.ts +42 -0
- package/dist/src/support/logger.d.ts +0 -42
- package/dist/src/support/widget-store.d.ts +4 -0
- package/package.json +4 -2
- package/vite.config.ts +11 -7
- package/dist/style.css +0 -1
- package/dist/test/payment/css/style.css +0 -52
- package/dist/test/payment/ehowlsla.html +0 -92
- package/dist/test/payment/iframe.html +0 -71
- package/dist/test/payment/index.html +0 -285
- package/dist/test/payment/js/development-ehowlsla.js +0 -286
- package/dist/test/payment/js/development.js +0 -971
- package/dist/test/payment/js/widget.js +0 -369
- package/dist/test/payment/widget.html +0 -164
- /package/{tsconfig.build.json → tsconfig.json.esnext} +0 -0
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { BootpayManager } from "../support/bootpay-manager";
|
|
2
2
|
import { SessionStorageManager } from "../support/storage";
|
|
3
3
|
import { ConfirmModel, EnvironmentModel, ErrorModel, ExtraModel, ItemModel, RequestAuthenticationModel, RequestPaymentModel, RequestPaymentUrlModel, RequestSubscriptionModel } from "../models/bootpay-interface";
|
|
4
|
-
import { EventLoggerManager } from
|
|
4
|
+
import { EventLoggerManager } from '../support/event-logger';
|
|
5
5
|
export declare class BootpayRequestPaymentManager extends BootpayManager {
|
|
6
6
|
$session: SessionStorageManager;
|
|
7
7
|
$logger: any;
|
|
@@ -1,4 +1,15 @@
|
|
|
1
1
|
import { BootpayWindowEvent } from '../../support/event';
|
|
2
|
+
import { ResponseBootpayWidgetTermsModel } from '../../models/bootpay-widget-interface';
|
|
3
|
+
import { ExtraModel } from '../../models/bootpay-interface';
|
|
4
|
+
export interface SelectPaymentEventData {
|
|
5
|
+
pg?: string;
|
|
6
|
+
method?: string;
|
|
7
|
+
wallet_id?: string;
|
|
8
|
+
term_passed?: boolean;
|
|
9
|
+
select_terms?: ResponseBootpayWidgetTermsModel[];
|
|
10
|
+
extra?: ExtraModel;
|
|
11
|
+
completed?: boolean;
|
|
12
|
+
}
|
|
2
13
|
declare class BootpayWidgetEventManager extends BootpayWindowEvent {
|
|
3
14
|
$messageEventName: string;
|
|
4
15
|
$eventPrefix: string;
|
|
@@ -16,6 +27,12 @@ declare class BootpayWidgetEventManager extends BootpayWindowEvent {
|
|
|
16
27
|
* @date: 2023-06-15
|
|
17
28
|
*/
|
|
18
29
|
destroyAllEvent(): void;
|
|
30
|
+
/**
|
|
31
|
+
* 결제 선택시 global 이벤트를 분리하여 호출한다
|
|
32
|
+
* Comment by GOSOMI
|
|
33
|
+
* @date: 2024-04-24
|
|
34
|
+
*/
|
|
35
|
+
triggerGlobalChangeEvent(data: SelectPaymentEventData): void;
|
|
19
36
|
}
|
|
20
37
|
export declare const BootpayWidgetEvent: BootpayWidgetEventManager;
|
|
21
38
|
export {};
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { TemplateManager } from '../../support/template-manager';
|
|
2
|
+
declare class ModalTemplateManager extends TemplateManager {
|
|
3
|
+
$windowId: string;
|
|
4
|
+
$modalWindowId: string;
|
|
5
|
+
$iFrameId: string;
|
|
6
|
+
$template: string;
|
|
7
|
+
$additionalClass: string;
|
|
8
|
+
constructor();
|
|
9
|
+
template(): string;
|
|
10
|
+
createIFrame(url: string): void;
|
|
11
|
+
destroy(): void;
|
|
12
|
+
resize(resizeData: any): void;
|
|
13
|
+
postMessage(event: string, data?: any): void;
|
|
14
|
+
}
|
|
15
|
+
export declare const ModalTemplate: ModalTemplateManager;
|
|
16
|
+
export {};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { TemplateManager } from "../../support/template-manager";
|
|
2
|
-
import { ConfirmModel } from "../../models/bootpay-interface";
|
|
2
|
+
import { ConfirmModel, PopupDisplayResponseModel } from "../../models/bootpay-interface";
|
|
3
3
|
declare class TemplatePaymentManager extends TemplateManager {
|
|
4
4
|
$template: string;
|
|
5
5
|
$formId: string;
|
|
@@ -64,7 +64,7 @@ declare class TemplatePaymentManager extends TemplateManager {
|
|
|
64
64
|
* @date: 2021-05-12
|
|
65
65
|
* @returns void
|
|
66
66
|
*/
|
|
67
|
-
createPopupButton(displayData:
|
|
67
|
+
createPopupButton(displayData: PopupDisplayResponseModel): void;
|
|
68
68
|
/**
|
|
69
69
|
* 팝업창을 띄운다
|
|
70
70
|
* Comment by GOSOMI
|
|
@@ -105,7 +105,7 @@ declare class TemplatePaymentManager extends TemplateManager {
|
|
|
105
105
|
* @date: 2021-06-23
|
|
106
106
|
* @returns void
|
|
107
107
|
*/
|
|
108
|
-
showPopupMessage(displayData:
|
|
108
|
+
showPopupMessage(displayData: PopupDisplayResponseModel): void;
|
|
109
109
|
/**
|
|
110
110
|
* 팝업 버튼 창을 닫는다
|
|
111
111
|
* Comment by GOSOMI
|
|
@@ -4,7 +4,6 @@ declare class TemplateWidgetManager extends TemplateManager {
|
|
|
4
4
|
$template: string;
|
|
5
5
|
$iFrameId: string;
|
|
6
6
|
$widgetStore: WidgetStoreModel;
|
|
7
|
-
isRendered: boolean;
|
|
8
7
|
constructor();
|
|
9
8
|
/**
|
|
10
9
|
* 첫 Rendering을 진행한다
|
|
@@ -37,6 +36,12 @@ declare class TemplateWidgetManager extends TemplateManager {
|
|
|
37
36
|
* @date: 2023-06-15
|
|
38
37
|
*/
|
|
39
38
|
postMessage(event: string, data?: any): void;
|
|
39
|
+
/**
|
|
40
|
+
* render가 되었는지 체크한다
|
|
41
|
+
* Comment by GOSOMI
|
|
42
|
+
* @date: 2024-02-22
|
|
43
|
+
*/
|
|
44
|
+
isRendered(): boolean;
|
|
40
45
|
}
|
|
41
46
|
export declare const TemplateWidget: TemplateWidgetManager;
|
|
42
47
|
export {};
|
|
@@ -15,6 +15,7 @@ export interface RequestPaymentModel {
|
|
|
15
15
|
order_name: string;
|
|
16
16
|
price: number;
|
|
17
17
|
tax_free?: number;
|
|
18
|
+
deposit_price?: number;
|
|
18
19
|
platform_type?: number;
|
|
19
20
|
currency?: string;
|
|
20
21
|
order_id: string;
|
|
@@ -24,6 +25,9 @@ export interface RequestPaymentModel {
|
|
|
24
25
|
tk?: string;
|
|
25
26
|
user_token?: string;
|
|
26
27
|
wallet_id?: string;
|
|
28
|
+
widget_key?: string;
|
|
29
|
+
commission_keys?: CommissionKeyModel;
|
|
30
|
+
redirect_url?: string;
|
|
27
31
|
metadata?: any;
|
|
28
32
|
user?: UserModel;
|
|
29
33
|
items?: Array<ItemModel>;
|
|
@@ -51,6 +55,7 @@ export interface RequestSubscriptionModel {
|
|
|
51
55
|
order_name: string;
|
|
52
56
|
platform_type?: number;
|
|
53
57
|
uuid?: string;
|
|
58
|
+
redirect_url?: string;
|
|
54
59
|
sk?: string;
|
|
55
60
|
ti?: number;
|
|
56
61
|
tk?: string;
|
|
@@ -67,6 +72,7 @@ export interface RequestAuthenticationModel {
|
|
|
67
72
|
pg: string;
|
|
68
73
|
method?: string;
|
|
69
74
|
order_name: string;
|
|
75
|
+
redirect_url?: string;
|
|
70
76
|
platform_type?: number;
|
|
71
77
|
uuid?: string;
|
|
72
78
|
sk?: string;
|
|
@@ -211,6 +217,7 @@ export interface ExtraModel {
|
|
|
211
217
|
easy_payment_method?: 'card' | '카드' | 'point' | '포인트';
|
|
212
218
|
cash_receipt_type?: '소득공제' | '지출증빙';
|
|
213
219
|
identity_no?: string;
|
|
220
|
+
override_global_event?: boolean;
|
|
214
221
|
}
|
|
215
222
|
export interface WidgetExtraModel {
|
|
216
223
|
card_quota?: string | string[];
|
|
@@ -238,4 +245,15 @@ export interface EnvironmentModel {
|
|
|
238
245
|
width: number;
|
|
239
246
|
height: number;
|
|
240
247
|
}
|
|
248
|
+
export interface PopupDisplayResponseModel {
|
|
249
|
+
gatewayUrl: string;
|
|
250
|
+
receiptId: string;
|
|
251
|
+
name: string;
|
|
252
|
+
message?: string;
|
|
253
|
+
price: number;
|
|
254
|
+
}
|
|
255
|
+
export interface CommissionKeyModel {
|
|
256
|
+
commerce?: string;
|
|
257
|
+
marketer?: string;
|
|
258
|
+
}
|
|
241
259
|
export {};
|
|
@@ -4,6 +4,7 @@ export interface RequestBootpayWidgetModel {
|
|
|
4
4
|
price: number;
|
|
5
5
|
tax_free?: number;
|
|
6
6
|
currency?: string;
|
|
7
|
+
key?: string;
|
|
7
8
|
user_token?: string;
|
|
8
9
|
use_only_oopay?: boolean;
|
|
9
10
|
use_terms?: boolean;
|
|
@@ -23,3 +24,8 @@ export interface ExternalBootpayWidgetTermsModel {
|
|
|
23
24
|
url: string;
|
|
24
25
|
required: 'required' | 'optional';
|
|
25
26
|
}
|
|
27
|
+
export interface ExternalBootpaySelectModel {
|
|
28
|
+
payment_type?: string;
|
|
29
|
+
method_alias?: string;
|
|
30
|
+
wallet_id?: string;
|
|
31
|
+
}
|
|
@@ -29,13 +29,14 @@ export interface EnvironmentInterface {
|
|
|
29
29
|
WIDGET_URL: EnvironmentMode;
|
|
30
30
|
sdkNames: SdkNameInterface;
|
|
31
31
|
sdkVersion: string;
|
|
32
|
+
packageVersion: string;
|
|
32
33
|
sdkName: number;
|
|
33
34
|
set(env: 'development' | 'stage' | 'production'): void;
|
|
34
35
|
setApplicationId(applicationId: string | undefined): string | undefined;
|
|
35
36
|
setLocale(locale: string): void;
|
|
36
37
|
currentApplicationId(applicationId: string | undefined): string | undefined;
|
|
37
38
|
setDevelopmentHost(host: string): void;
|
|
38
|
-
setVersion(version: string, name: SdkKeyType): void;
|
|
39
|
+
setVersion(version: string, name: SdkKeyType, packageExtendVersion?: string | undefined): void;
|
|
39
40
|
toApi(uri: string): string;
|
|
40
41
|
toDoor(uri: string): string;
|
|
41
42
|
toWidget(uri: string): string;
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { Resource } from './resource';
|
|
2
|
+
import { SessionStorageManager } from './storage';
|
|
3
|
+
interface EventDataModel {
|
|
4
|
+
application_id?: string;
|
|
5
|
+
step: string;
|
|
6
|
+
tk?: string;
|
|
7
|
+
status?: number;
|
|
8
|
+
msg?: string;
|
|
9
|
+
trace?: string;
|
|
10
|
+
request?: any;
|
|
11
|
+
response?: any;
|
|
12
|
+
version?: string;
|
|
13
|
+
}
|
|
14
|
+
export declare class EventLoggerManager extends Resource {
|
|
15
|
+
$session: SessionStorageManager;
|
|
16
|
+
$tk?: string;
|
|
17
|
+
$applicationId?: string;
|
|
18
|
+
$platformType?: number;
|
|
19
|
+
$receiptId?: string;
|
|
20
|
+
constructor();
|
|
21
|
+
/**
|
|
22
|
+
* Token키를 설정
|
|
23
|
+
* Comment by GOSOMI
|
|
24
|
+
* @date: 2021-05-20
|
|
25
|
+
* @param tokenKey: string
|
|
26
|
+
* @returns void
|
|
27
|
+
*/
|
|
28
|
+
setTokenKey(tokenKey: string): void;
|
|
29
|
+
setReceiptId(receiptId: string): void;
|
|
30
|
+
clearInstance(): void;
|
|
31
|
+
send(eventData: EventDataModel): Promise<any> | void;
|
|
32
|
+
sendError(eventData: EventDataModel): void;
|
|
33
|
+
setApplicationId(key: string | undefined): void;
|
|
34
|
+
/**
|
|
35
|
+
* 결제창 닫기 이벤트를 전송한다
|
|
36
|
+
* Comment by GOSOMI
|
|
37
|
+
* @date: 2022-05-13
|
|
38
|
+
*/
|
|
39
|
+
sendCloseEvent(): Promise<any>;
|
|
40
|
+
}
|
|
41
|
+
export declare const EventLogger: EventLoggerManager;
|
|
42
|
+
export {};
|
|
@@ -1,22 +1,9 @@
|
|
|
1
|
-
import { Resource } from "./resource";
|
|
2
|
-
import { SessionStorageManager } from "./storage";
|
|
3
1
|
export declare const LOG_LEVEL: {
|
|
4
2
|
debug: number;
|
|
5
3
|
info: number;
|
|
6
4
|
warning: number;
|
|
7
5
|
error: number;
|
|
8
6
|
};
|
|
9
|
-
interface EventDataModel {
|
|
10
|
-
application_id?: string;
|
|
11
|
-
step: string;
|
|
12
|
-
tk?: string;
|
|
13
|
-
status?: number;
|
|
14
|
-
msg?: string;
|
|
15
|
-
trace?: string;
|
|
16
|
-
request?: any;
|
|
17
|
-
response?: any;
|
|
18
|
-
version?: string;
|
|
19
|
-
}
|
|
20
7
|
export declare const Logger: {
|
|
21
8
|
level: number;
|
|
22
9
|
/**
|
|
@@ -32,32 +19,3 @@ export declare const Logger: {
|
|
|
32
19
|
warn(key: string, message: any): void;
|
|
33
20
|
error(key: string, message: any): void;
|
|
34
21
|
};
|
|
35
|
-
export declare class EventLoggerManager extends Resource {
|
|
36
|
-
$session: SessionStorageManager;
|
|
37
|
-
$tk?: string;
|
|
38
|
-
$applicationId?: string;
|
|
39
|
-
$platformType?: number;
|
|
40
|
-
$receiptId?: string;
|
|
41
|
-
constructor();
|
|
42
|
-
/**
|
|
43
|
-
* Token키를 설정
|
|
44
|
-
* Comment by GOSOMI
|
|
45
|
-
* @date: 2021-05-20
|
|
46
|
-
* @param tokenKey: string
|
|
47
|
-
* @returns void
|
|
48
|
-
*/
|
|
49
|
-
setTokenKey(tokenKey: string): void;
|
|
50
|
-
setReceiptId(receiptId: string): void;
|
|
51
|
-
clearInstance(): void;
|
|
52
|
-
send(eventData: EventDataModel): Promise<any> | void;
|
|
53
|
-
sendError(eventData: EventDataModel): void;
|
|
54
|
-
setApplicationId(key: string | undefined): void;
|
|
55
|
-
/**
|
|
56
|
-
* 결제창 닫기 이벤트를 전송한다
|
|
57
|
-
* Comment by GOSOMI
|
|
58
|
-
* @date: 2022-05-13
|
|
59
|
-
*/
|
|
60
|
-
sendCloseEvent(): Promise<any>;
|
|
61
|
-
}
|
|
62
|
-
export declare const EventLogger: EventLoggerManager;
|
|
63
|
-
export {};
|
|
@@ -5,12 +5,14 @@ export interface WidgetStoreModel {
|
|
|
5
5
|
applicationId: string | undefined;
|
|
6
6
|
price: number;
|
|
7
7
|
taxFree: number | undefined;
|
|
8
|
+
depositPrice: number | undefined;
|
|
8
9
|
currency: string | undefined;
|
|
9
10
|
userToken: string | undefined;
|
|
10
11
|
pg: string | undefined;
|
|
11
12
|
method: string | undefined;
|
|
12
13
|
walletId?: string;
|
|
13
14
|
useOnlyOOpay: boolean;
|
|
15
|
+
widgetKey?: string | undefined;
|
|
14
16
|
termsPassed: boolean;
|
|
15
17
|
sandbox: boolean;
|
|
16
18
|
useTerms: boolean;
|
|
@@ -27,6 +29,7 @@ export interface WidgetStoreData {
|
|
|
27
29
|
application_id?: string;
|
|
28
30
|
price?: number;
|
|
29
31
|
tax_free?: number;
|
|
32
|
+
deposit_price?: number;
|
|
30
33
|
currency?: string;
|
|
31
34
|
user_token?: string;
|
|
32
35
|
pg?: string;
|
|
@@ -35,6 +38,7 @@ export interface WidgetStoreData {
|
|
|
35
38
|
use_only_oopay?: boolean;
|
|
36
39
|
use_terms?: boolean;
|
|
37
40
|
sandbox?: boolean;
|
|
41
|
+
widget_key?: string;
|
|
38
42
|
external_terms?: ExternalBootpayWidgetTermsModel[];
|
|
39
43
|
widget_extra?: WidgetExtraModel;
|
|
40
44
|
}
|
package/package.json
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@bootpay/client-js",
|
|
3
|
-
"version": "5.0.0-
|
|
3
|
+
"version": "5.0.0-rc.1",
|
|
4
4
|
"main": "dist/index.es.js",
|
|
5
5
|
"types": "dist/src/index.d.ts",
|
|
6
|
+
"styles": "dist/index.css",
|
|
6
7
|
"scripts": {
|
|
7
8
|
"test": "echo \"Error: no test specified\" && exit 1",
|
|
8
9
|
"build": "rm -rf ./dist && vite build",
|
|
@@ -38,7 +39,8 @@
|
|
|
38
39
|
"style-loader": "^3.3.3",
|
|
39
40
|
"vite": "^5.0.10",
|
|
40
41
|
"vite-plugin-dts": "^3.6.4",
|
|
41
|
-
"vite-plugin-tsconfig": "^1.0.4"
|
|
42
|
+
"vite-plugin-tsconfig": "^1.0.4",
|
|
43
|
+
"vite-plugin-css-injected-by-js": "^3.3.0"
|
|
42
44
|
},
|
|
43
45
|
"resolutions": {
|
|
44
46
|
"@webpack-cli/serve": "^1.3.1"
|
package/vite.config.ts
CHANGED
|
@@ -1,23 +1,27 @@
|
|
|
1
1
|
import { defineConfig } from 'vite'
|
|
2
2
|
import dts from 'vite-plugin-dts'
|
|
3
|
+
import cssInjectedByJsPlugin from 'vite-plugin-css-injected-by-js'
|
|
3
4
|
|
|
4
5
|
const path = require('path')
|
|
5
6
|
|
|
6
7
|
export default defineConfig({
|
|
7
|
-
build:
|
|
8
|
-
target: '
|
|
8
|
+
build: {
|
|
9
|
+
target: 'es6',
|
|
9
10
|
minify: 'terser',
|
|
10
11
|
lib: {
|
|
11
12
|
entry: path.resolve(__dirname, 'src/index.ts'),
|
|
12
13
|
name: 'Bootpay',
|
|
13
14
|
fileName: (format) => `index.${ format }.js`
|
|
14
|
-
}
|
|
15
|
+
}
|
|
15
16
|
},
|
|
16
|
-
base:
|
|
17
|
-
|
|
18
|
-
|
|
17
|
+
base: './',
|
|
18
|
+
root: './',
|
|
19
|
+
plugins: [
|
|
20
|
+
dts(),
|
|
21
|
+
cssInjectedByJsPlugin()
|
|
19
22
|
],
|
|
20
|
-
|
|
23
|
+
publicDir: '_public',
|
|
24
|
+
resolve: {
|
|
21
25
|
extensions: ['.css', '.sass', '.scss', '.ts', '.js']
|
|
22
26
|
}
|
|
23
27
|
})
|
package/dist/style.css
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
.bootpay-progress-background{position:fixed;display:block;background-color:transparent;inset:0;text-align:center;z-index:200000;white-space:nowrap}.bootpay-progress-background.blur-off{background-color:transparent}.bootpay-progress-background:before{display:inline-block;height:100%;content:" ";vertical-align:middle}.bootpay-progress-background .progress-message-window{display:inline-block;text-align:center;max-width:600px;border-radius:3px;width:100%;background-color:transparent;padding:0;vertical-align:middle}@media (min-width: 600px){.bootpay-progress-background .progress-message-window{padding:1rem}}.bootpay-progress-background .progress-message-window .bootpay-spinner{display:inline-block;width:50px;height:50px;border-radius:50%;border-top:2px solid rgba(255,255,255,.2);border-right:2px solid rgba(255,255,255,.2);border-bottom:2px solid rgba(255,255,255,.2);border-left:2px solid #ffffff;animation:spin 1s infinite linear}.bootpay-progress-background .progress-message-window .alfred-text{margin-top:1rem}.bootpay-progress-background .progress-message-window .alfred-text span.alfred-inner-text{font-weight:400;color:#eee}@keyframes spin{0%{transform:rotate(0);border-left:2px solid #ffffff;border-top:2px solid rgba(255,255,255,.2);border-right:2px solid rgba(255,255,255,.2);border-bottom:2px solid rgba(255,255,255,.2)}50%{transform:rotate(180deg);border-left:3px solid #ffffff;border-top:2px solid rgba(255,255,255,.4);border-right:2px solid rgba(255,255,255,.4);border-bottom:2px solid rgba(255,255,255,.4)}to{transform:rotate(360deg);border-left:2px solid #ffffff;border-top:2px solid rgba(255,255,255,.2);border-right:2px solid rgba(255,255,255,.2);border-bottom:2px solid rgba(255,255,255,.2)}}body.bootpay-open{position:fixed!important;inset:0;padding:0;margin:0;height:100vh!important;overflow:hidden!important;-webkit-overflow-scrolling:auto!important}body.bootpay-open .bootpay-payment-background{position:fixed;inset:0;display:block;text-align:center;background-color:#000000b3;z-index:9999}body.bootpay-open .bootpay-payment-background:before{display:inline-block;vertical-align:middle;height:100%;content:" "}body.bootpay-open .bootpay-payment-background>.bootpay-payment-window{position:relative;display:inline-block;vertical-align:middle}body.bootpay-open .bootpay-payment-background>.bootpay-payment-window.__mobile{max-width:470px;height:90%}@media (max-width: 768px){body.bootpay-open .bootpay-payment-background>.bootpay-payment-window{position:absolute;inset:0;border-radius:0!important}body.bootpay-open .bootpay-payment-background>.bootpay-payment-window.__mobile{position:absolute;max-width:inherit;inset:0;height:100%}body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>iframe{width:100%!important;height:100%!important;border-radius:0}}body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>button.bootpay-payment-close{position:absolute;display:none;top:-32px;right:4px;color:#fff;font-size:32px;text-decoration:none;outline:none;box-shadow:none;border:0;background-color:transparent}body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>button.bootpay-payment-close:before,body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>button.bootpay-payment-close:after{width:2px!important;background-color:#fff!important}@media (max-width: 768px){body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>button.bootpay-payment-close{top:1rem;right:16px;color:#000;padding:0}body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>button.bootpay-payment-close:before,body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>button.bootpay-payment-close:after{width:2px!important;background-color:#000!important}}body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>.bootpay-popup-window{position:relative;width:400px;height:600px;display:none;background-color:#fff;border-radius:5px;overflow:hidden}@media (max-width: 768px){body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>.bootpay-popup-window{position:absolute;inset:0;width:100%;height:100%;border-radius:0}}body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>.bootpay-popup-window>.header{position:absolute;left:0;right:0;top:0;height:50px;color:#333;background-color:#fff;text-align:left}body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>.bootpay-popup-window>.body{position:absolute;inset:50px 0 72px;padding:1rem;text-align:left;font-size:14px}body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>.bootpay-popup-window>.body>#bootpay-item-name-id{font-size:16px;color:#888;font-weight:400!important;text-align:center}body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>.bootpay-popup-window>.body>#bootpay-price-id{font-size:36px;color:#333;font-weight:700;text-align:center}body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>.bootpay-popup-window>.body>.agree-text{position:absolute;bottom:1rem;left:0;right:0;color:#888;font-size:14px;text-align:center}body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>.bootpay-popup-window>.footer{position:absolute;left:0;right:0;bottom:0;height:72px;padding:0 1rem;margin:0}body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>.bootpay-popup-window>.footer>button.bootpay-button{display:block;width:100%;padding:1rem;outline:none;border:none;background-color:#507cf3;border-radius:5px;color:#fff;font-size:16px}body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>.bootpay-popup-window>.footer>button.bootpay-button:hover,body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>.bootpay-popup-window>.footer>button.bootpay-button:active{outline:none;box-shadow:none}body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>iframe{width:100%;height:100%;display:none;border:0!important;outline:0!important;border-radius:0;box-shadow:none}@media (min-width: 600px){body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>iframe{width:0;height:0;border:0;outline:0;border-radius:0!important;box-shadow:none!important}}body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>iframe.rounded-iframe{border-radius:20px}@media (min-width: 600px){body.bootpay-open .bootpay-payment-background>.bootpay-payment-window>iframe.rounded-iframe{width:0;height:0;border:0;outline:0;border-radius:20px!important;box-shadow:none!important}}body.bootpay-open .bootpay-payment-background>.bootpay-confirm-window>iframe{display:none;width:1px;height:1px;background:transparent;border:0!important;outline:0!important}.bootpay-close-btn{position:absolute;box-shadow:none;background-color:#fff;outline:0;z-index:10001;right:8px;top:8px;height:21px;width:21px;border:2px solid #333}@media (min-width: 600px){.bootpay-close-btn{right:4px;top:-32px;width:25px;height:25px;border:0;background:transparent}}.bootpay-close-btn.active,.bootpay-close-btn:focus{border:0;outline:0}.bootpay-close-btn:before,.bootpay-close-btn:after{position:absolute;left:8px;top:2px;content:" ";height:15px;width:1px;background-color:#333}@media (min-width: 600px){.bootpay-close-btn:before,.bootpay-close-btn:after{height:23px;top:0;width:2px;background-color:#fff}}.bootpay-close-btn:before{transform:rotate(45deg)}.bootpay-close-btn:after{transform:rotate(-45deg)}
|
|
@@ -1,52 +0,0 @@
|
|
|
1
|
-
html {
|
|
2
|
-
margin: 0;
|
|
3
|
-
padding: 0;
|
|
4
|
-
}
|
|
5
|
-
|
|
6
|
-
body {
|
|
7
|
-
margin: 0;
|
|
8
|
-
padding: 0;
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
.container {
|
|
12
|
-
max-width: 600px;
|
|
13
|
-
margin: 0 auto;
|
|
14
|
-
width: 100%;
|
|
15
|
-
padding: 1rem;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
.widget-background {
|
|
19
|
-
background-color: #e2e8f0;
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
@media (max-width: 500px) {
|
|
23
|
-
|
|
24
|
-
.flex-container {
|
|
25
|
-
display: block;
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
.widget-left, .widget-right {
|
|
29
|
-
flex: 0;
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
.widget-left .widget-container {
|
|
33
|
-
border-radius: 10px;
|
|
34
|
-
overflow: hidden;
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
@media (min-width: 500px) {
|
|
39
|
-
.flex-container {
|
|
40
|
-
display: flex;
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
.widget-left {
|
|
44
|
-
flex: 1;
|
|
45
|
-
padding: 1rem;
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
.widget-right {
|
|
49
|
-
flex: 0 500px;
|
|
50
|
-
padding: 1rem;
|
|
51
|
-
}
|
|
52
|
-
}
|
|
@@ -1,92 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html>
|
|
3
|
-
<head>
|
|
4
|
-
<title>결제 테스트 페이지 (개발서버)</title>
|
|
5
|
-
<meta charset="utf-8"/>
|
|
6
|
-
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"/>
|
|
7
|
-
<meta name="apple-mobile-web-app-capable" content="yes"/>
|
|
8
|
-
<meta name="apple-mobile-web-app-status-bar-style" content="none"/>
|
|
9
|
-
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
|
|
10
|
-
integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
|
|
11
|
-
<link rel="stylesheet" media="all" href="./css/style.css"/>
|
|
12
|
-
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
|
|
13
|
-
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
|
|
14
|
-
integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
|
|
15
|
-
crossorigin="anonymous"></script>
|
|
16
|
-
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"
|
|
17
|
-
integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6"
|
|
18
|
-
crossorigin="anonymous"></script>
|
|
19
|
-
<script src="../../bootpay-latest.js" type="application/javascript"></script>
|
|
20
|
-
<script src="./js/development-ehowlsla.js" type="application/javascript"></script>
|
|
21
|
-
<meta content="width=device-width, initial-scale=1, user-scalable=no" name="viewport">
|
|
22
|
-
</head>
|
|
23
|
-
<body>
|
|
24
|
-
<div class="container">
|
|
25
|
-
<div class="card">
|
|
26
|
-
<div class="card-header">
|
|
27
|
-
<h5 class="card-title">테스트 결제 페이지입니다</h5>
|
|
28
|
-
<h6 class="card-subtitle mb-2 text-muted">테스트 서버로 결제 요청을 할 수 있습니다.</h6>
|
|
29
|
-
</div>
|
|
30
|
-
<div class="card-body">
|
|
31
|
-
<div class="form-group">
|
|
32
|
-
<label>결제할 금액</label>
|
|
33
|
-
<input class="form-control" value="100" name="amount"/>
|
|
34
|
-
</div>
|
|
35
|
-
<div class="form-group">
|
|
36
|
-
<label>면세로 설정할 금액</label>
|
|
37
|
-
<input class="form-control" value="0" name="taxFreeAmount"/>
|
|
38
|
-
</div>
|
|
39
|
-
<div class="form-group">
|
|
40
|
-
<label>PG</label>
|
|
41
|
-
<select class="form-control" name="pg">
|
|
42
|
-
<option value="이니시스">이니시스</option>
|
|
43
|
-
<option value="다날">다날</option>
|
|
44
|
-
<option value="케이씨피">KCP</option>
|
|
45
|
-
<option value="나이스페이">나이스페이</option>
|
|
46
|
-
<option value="토스">토스</option>
|
|
47
|
-
<option value="스트라이프">스트라이프</option>
|
|
48
|
-
<option value="페이팔">페이팔</option>
|
|
49
|
-
<option value="페이레터">페이레터</option>
|
|
50
|
-
<option value="페이앱">페이앱</option>
|
|
51
|
-
<option value="이지페이">이지페이</option>
|
|
52
|
-
<option value="유디페이">유디페이</option>
|
|
53
|
-
<option value="페이코">페이코</option>
|
|
54
|
-
<option value="카카오">카카오</option>
|
|
55
|
-
<option value="세틀뱅크">세틀뱅크</option>
|
|
56
|
-
<option value="티페이">티페이</option>
|
|
57
|
-
<option value="웰컴페이먼츠">웰컴페이먼츠</option>
|
|
58
|
-
<option value="스마트로">스마트로</option>
|
|
59
|
-
</select>
|
|
60
|
-
</div>
|
|
61
|
-
<div class="form-group">
|
|
62
|
-
<label>결제수단</label>
|
|
63
|
-
<select class="form-control" name="method">
|
|
64
|
-
<option value="카드">카드결제</option>
|
|
65
|
-
<option value="휴대폰">휴대폰</option>
|
|
66
|
-
<option value="계좌이체">계좌이체</option>
|
|
67
|
-
<option value="가상계좌">가상계좌</option>
|
|
68
|
-
<option value="카카오페이">카카오페이</option>
|
|
69
|
-
<option value="네이버페이">네이버페이</option>
|
|
70
|
-
<option value="페이코">페이코</option>
|
|
71
|
-
<option value="간편결제">간편결제</option>
|
|
72
|
-
<option value="카드정기결제">카드정기결제(창결제)</option>
|
|
73
|
-
<option value="정기결제">간편정기결제(창결제)</option>
|
|
74
|
-
<option value="디지털카드">디지털카드</option>
|
|
75
|
-
<option value="디지털정기결제">디지털정기결제</option>
|
|
76
|
-
<option value="본인인증">본인인증</option>
|
|
77
|
-
<option value="카드수기">카드수기결제</option>
|
|
78
|
-
</select>
|
|
79
|
-
</div>
|
|
80
|
-
<div class="group text-center mt-3">
|
|
81
|
-
<button class="btn btn-primary" onclick="requestMethod()">
|
|
82
|
-
선택된 결제하기
|
|
83
|
-
</button>
|
|
84
|
-
<button class="btn btn-warning ml-2" onClick="requestTotalPayment()">
|
|
85
|
-
통합결제창
|
|
86
|
-
</button>
|
|
87
|
-
</div>
|
|
88
|
-
</div>
|
|
89
|
-
</div>
|
|
90
|
-
</div>
|
|
91
|
-
</body>
|
|
92
|
-
</html>
|
|
@@ -1,71 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html>
|
|
3
|
-
<head>
|
|
4
|
-
<title>결제 테스트 페이지 (개발서버)</title>
|
|
5
|
-
<meta charset="utf-8"/>
|
|
6
|
-
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"/>
|
|
7
|
-
<meta name="apple-mobile-web-app-capable" content="yes"/>
|
|
8
|
-
<meta name="apple-mobile-web-app-status-bar-style" content="none"/>
|
|
9
|
-
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
|
|
10
|
-
integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
|
|
11
|
-
<link rel="stylesheet" media="all" href="./css/style.css"/>
|
|
12
|
-
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
|
|
13
|
-
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
|
|
14
|
-
integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
|
|
15
|
-
crossorigin="anonymous"></script>
|
|
16
|
-
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"
|
|
17
|
-
integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6"
|
|
18
|
-
crossorigin="anonymous"></script>
|
|
19
|
-
<meta content="width=device-width, initial-scale=1, user-scalable=no" name="viewport">
|
|
20
|
-
<!-- Google Tag Manager -->
|
|
21
|
-
<script>(function (w, d, s, l, i) {
|
|
22
|
-
w[l] = w[l] || [];
|
|
23
|
-
w[l].push({
|
|
24
|
-
'gtm.start':
|
|
25
|
-
new Date().getTime(), event: 'gtm.js'
|
|
26
|
-
});
|
|
27
|
-
var f = d.getElementsByTagName(s)[0],
|
|
28
|
-
j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : '';
|
|
29
|
-
j.async = true;
|
|
30
|
-
j.src =
|
|
31
|
-
'https://www.googletagmanager.com/gtm.js?id=' + i + dl;
|
|
32
|
-
f.parentNode.insertBefore(j, f);
|
|
33
|
-
})(window, document, 'script', 'dataLayer', 'GTM-NQKMWJD');</script>
|
|
34
|
-
<!-- End Google Tag Manager -->
|
|
35
|
-
<script>
|
|
36
|
-
function popupOpen() {
|
|
37
|
-
window.open('https://l.bootpay.co.kr/l/Fh90Qy')
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
window.addEventListener('message', (e) => {
|
|
41
|
-
if (e.data !== undefined) {
|
|
42
|
-
let eventData = undefined
|
|
43
|
-
try {
|
|
44
|
-
eventData = JSON.parse(e.data)
|
|
45
|
-
} catch (e) {
|
|
46
|
-
console.log('event data json parse failed.')
|
|
47
|
-
return true
|
|
48
|
-
}
|
|
49
|
-
// 부트페이 이벤트에 해당되는 경우
|
|
50
|
-
if(eventData.bootpay_event) {
|
|
51
|
-
console.log(eventData)
|
|
52
|
-
// 오류인 경우
|
|
53
|
-
// event: error, cancel
|
|
54
|
-
// error_code: 부트페이 오류코드
|
|
55
|
-
// message: 오류 내용
|
|
56
|
-
// pg_error_code: PG 오류코드
|
|
57
|
-
|
|
58
|
-
// 결제 승인된 경우
|
|
59
|
-
// event: done
|
|
60
|
-
// data: { // 리턴되는 데이터
|
|
61
|
-
//
|
|
62
|
-
// }
|
|
63
|
-
}
|
|
64
|
-
}
|
|
65
|
-
})
|
|
66
|
-
</script>
|
|
67
|
-
</head>
|
|
68
|
-
<body>
|
|
69
|
-
<button onClick="popupOpen()">팝업으로 진행하기</button>
|
|
70
|
-
<iframe style="width:100%;height: 100vh; border: 0;" src="https://l.bootpay.co.kr/l/Fh90Qy"></iframe>
|
|
71
|
-
</body>
|