@paydock/client-sdk 1.122.3-beta → 1.123.2-beta
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 +161 -5
- package/bundles/index.cjs +2472 -1735
- package/bundles/index.cjs.d.ts +314 -25
- package/bundles/index.mjs +2471 -1736
- package/bundles/index.mjs.d.ts +314 -25
- package/bundles/types/api/api-base.d.ts +1 -1
- package/bundles/types/api/api-base.d.ts.map +1 -1
- package/bundles/types/checkout/helpers/instruction-module.d.ts +1 -1
- package/bundles/types/checkout/helpers/instruction-module.d.ts.map +1 -1
- package/bundles/types/checkout/instructions/v1/index.d.ts.map +1 -1
- package/bundles/types/checkout/instructions/v1/instruction.fraud_service.show.d.ts +21 -0
- package/bundles/types/checkout/instructions/v1/instruction.fraud_service.show.d.ts.map +1 -0
- package/bundles/types/checkout/instructions/v1/instruction.payment_methods.show.d.ts.map +1 -1
- package/bundles/types/checkout/layout-widgets/additionals.d.ts +1 -1
- package/bundles/types/checkout/layout-widgets/payment-methods.d.ts +6 -4
- package/bundles/types/checkout/layout-widgets/payment-methods.d.ts.map +1 -1
- package/bundles/types/configs/env/environment.cba.d.ts +8 -7
- package/bundles/types/configs/env/environment.cba.d.ts.map +1 -1
- package/bundles/types/configs/env/environment.interface.d.ts +6 -6
- package/bundles/types/configs/env/environment.interface.d.ts.map +1 -1
- package/bundles/types/configs/env/environment.paydock.d.ts +8 -7
- package/bundles/types/configs/env/environment.paydock.d.ts.map +1 -1
- package/bundles/types/fraud-prevention/fraud-prevention.constants.d.ts +9 -0
- package/bundles/types/fraud-prevention/fraud-prevention.constants.d.ts.map +1 -0
- package/bundles/types/fraud-prevention/fraud-prevention.events.d.ts +42 -0
- package/bundles/types/fraud-prevention/fraud-prevention.events.d.ts.map +1 -0
- package/bundles/types/fraud-prevention/fraud-prevention.service.d.ts +163 -0
- package/bundles/types/fraud-prevention/fraud-prevention.service.d.ts.map +1 -0
- package/bundles/types/fraud-prevention/index.d.ts +3 -0
- package/bundles/types/fraud-prevention/index.d.ts.map +1 -0
- package/bundles/types/fraud-prevention/providers/forter/forter-device-agent.service.d.ts +79 -0
- package/bundles/types/fraud-prevention/providers/forter/forter-device-agent.service.d.ts.map +1 -0
- package/bundles/types/fraud-prevention/providers/forter/templates/forter-snippet-2025-02-06t14:19:34z.template.d.ts +2 -0
- package/bundles/types/fraud-prevention/providers/forter/templates/forter-snippet-2025-02-06t14:19:34z.template.d.ts.map +1 -0
- package/bundles/types/fraud-prevention/resources/find-service-config.repository.d.ts +20 -0
- package/bundles/types/fraud-prevention/resources/find-service-config.repository.d.ts.map +1 -0
- package/bundles/types/helper/access-token.d.ts +1 -0
- package/bundles/types/helper/access-token.d.ts.map +1 -1
- package/bundles/types/helper/browser.d.ts.map +1 -1
- package/bundles/types/helper/deep-clone.d.ts +13 -0
- package/bundles/types/helper/deep-clone.d.ts.map +1 -0
- package/bundles/types/index-cba.d.ts +1 -0
- package/bundles/types/index-cba.d.ts.map +1 -1
- package/bundles/types/index.d.ts +2 -1
- package/bundles/types/index.d.ts.map +1 -1
- package/bundles/types/secure-remote-commerce/click-to-pay-secure-remote-commerce.d.ts +1 -1
- package/bundles/types/secure-remote-commerce/click-to-pay-secure-remote-commerce.d.ts.map +1 -1
- package/bundles/types/shared/device/device-info.service.d.ts +13 -0
- package/bundles/types/shared/device/device-info.service.d.ts.map +1 -0
- package/bundles/types/shared/http/authorization-strategy.d.ts +41 -0
- package/bundles/types/shared/http/authorization-strategy.d.ts.map +1 -0
- package/bundles/types/shared/http/http-fetcher.d.ts +29 -0
- package/bundles/types/shared/http/http-fetcher.d.ts.map +1 -0
- package/bundles/types/shared/http/http-fetcher.factory.d.ts +17 -0
- package/bundles/types/shared/http/http-fetcher.factory.d.ts.map +1 -0
- package/bundles/types/shared/http/http-request.d.ts +1 -1
- package/bundles/types/shared/http/http-request.d.ts.map +1 -1
- package/bundles/types/shared/http/http-response.dto.d.ts +19 -0
- package/bundles/types/shared/http/http-response.dto.d.ts.map +1 -0
- package/bundles/types/shared/services/instrumentation/instrumentation.types.d.ts +1 -1
- package/bundles/types/shared/services/instrumentation/instrumentation.types.d.ts.map +1 -1
- package/bundles/types/shared/services/instrumentation/repositories/action.repository.d.ts.map +1 -1
- package/bundles/types/shared/services/instrumentation/repositories/error.repository.d.ts.map +1 -1
- package/bundles/types/shared/services/instrumentation/repositories/event.repository.d.ts.map +1 -1
- package/bundles/types/shared/shared.constants.d.ts +6 -0
- package/bundles/types/shared/shared.constants.d.ts.map +1 -0
- package/bundles/types/widget/configuration.d.ts +1 -1
- package/bundles/types/widget/configuration.d.ts.map +1 -1
- package/bundles/types/widget/html-widget.d.ts +14 -14
- package/bundles/types/widget/html-widget.d.ts.map +1 -1
- package/bundles/widget.umd.js +2472 -1735
- package/bundles/widget.umd.js.d.ts +314 -25
- package/bundles/widget.umd.js.min.d.ts +314 -25
- package/bundles/widget.umd.min.js +1 -1
- package/docs/api-widget.md +4 -4
- package/docs/fraud-prevention-examples.md +154 -0
- package/docs/fraud-prevention.md +0 -0
- package/docs/install/npm.example.md +1 -1
- package/package.json +17 -9
- package/slate.md +156 -1
- package/bundles/types/shared/http/index.d.ts +0 -2
- package/bundles/types/shared/http/index.d.ts.map +0 -1
package/docs/api-widget.md
CHANGED
|
@@ -567,10 +567,10 @@ The method to set meta information for the checkout page
|
|
|
567
567
|
|
|
568
568
|
```javascript
|
|
569
569
|
config.setMeta({
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
570
|
+
brand_name: 'paydock',
|
|
571
|
+
reference: '15',
|
|
572
|
+
email: 'wault@paydock.com'
|
|
573
|
+
});
|
|
574
574
|
```
|
|
575
575
|
<a name="w_HtmlMultiWidget+load" id="w_HtmlMultiWidget+load" href="#user-content-w_HtmlMultiWidget+load"> </a>
|
|
576
576
|
|
|
@@ -0,0 +1,154 @@
|
|
|
1
|
+
# Fraud prevention
|
|
2
|
+
|
|
3
|
+
The Fraud Prevention module allows you to add security layers to your payment workflows
|
|
4
|
+
by integrating with any of our underlying fraud prevention providers.
|
|
5
|
+
|
|
6
|
+
## Real time user behavior analysis
|
|
7
|
+
|
|
8
|
+
### Forter
|
|
9
|
+
|
|
10
|
+
One of Forter's key features is our ability to track the user's real-time behavior on
|
|
11
|
+
the site and use it to separate fraudsters from legitimate buyers. To take advantage
|
|
12
|
+
of Forter's technology, a JavaScript snippet needs to be placed on EVERY page
|
|
13
|
+
of your commerce site beginning with the homepage and up to and including the final
|
|
14
|
+
"Thank you for your purchase" page.
|
|
15
|
+
|
|
16
|
+
The integration is simple and straightforward - you only need to configure event
|
|
17
|
+
listeners and then instantiate a FraudPreventionService with your site configuration.
|
|
18
|
+
|
|
19
|
+
Additional setup is required in case your website uses Content Security Policies (CSP)
|
|
20
|
+
|
|
21
|
+
#### Forter: Code snippet
|
|
22
|
+
|
|
23
|
+
```html
|
|
24
|
+
<!doctype html>
|
|
25
|
+
<html lang="en">
|
|
26
|
+
|
|
27
|
+
<head>
|
|
28
|
+
<meta charset="utf-8">
|
|
29
|
+
<title>Real time user behaviour anaylsis - Forter example</title>
|
|
30
|
+
<base href="/">
|
|
31
|
+
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
32
|
+
<link rel="icon" type="image/x-icon" href="favicon.ico">
|
|
33
|
+
<script src="https://widget.paydock.com/sdk/latest/widget.umd.js" ></script>
|
|
34
|
+
</head>
|
|
35
|
+
|
|
36
|
+
<body>
|
|
37
|
+
<main>
|
|
38
|
+
<h1>Real time user behaviour anaylsis - Forter example</h1>
|
|
39
|
+
<div class="forter-test">
|
|
40
|
+
<h2>Forter Integration</h2>
|
|
41
|
+
|
|
42
|
+
<div class="status-card">
|
|
43
|
+
<p>
|
|
44
|
+
<strong>Integration Status:</strong>
|
|
45
|
+
<span data-fraud-prevention="status-indicator" class="status pending">
|
|
46
|
+
Pending
|
|
47
|
+
</span>
|
|
48
|
+
</p>
|
|
49
|
+
<p>
|
|
50
|
+
<strong>Token Value:</strong>
|
|
51
|
+
<code data-fraud-prevention="forter-token">Not available</code>
|
|
52
|
+
</p>
|
|
53
|
+
<p data-fraud-prevention="error-container" style="display: none;">
|
|
54
|
+
<strong>Error Code:</strong>
|
|
55
|
+
<span data-fraud-prevention="error-code" class="error"></span>
|
|
56
|
+
</p>
|
|
57
|
+
</div>
|
|
58
|
+
</div>
|
|
59
|
+
</main>
|
|
60
|
+
<script>
|
|
61
|
+
const { FRAUD_PREVENTION_EVENTS, FraudPreventionService } = window.paydock
|
|
62
|
+
|
|
63
|
+
let token = '';
|
|
64
|
+
let errorCode = '';
|
|
65
|
+
|
|
66
|
+
const render = () => {
|
|
67
|
+
const statusIndicator = document.querySelector('[data-fraud-prevention="status-indicator"]');
|
|
68
|
+
const tokenValue = document.querySelector('[data-fraud-prevention="forter-token"]');
|
|
69
|
+
const errorContainer = document.querySelector('[data-fraud-prevention="error-container"]');
|
|
70
|
+
const errorCodeElement = document.querySelector('[data-fraud-prevention="error-code"]');
|
|
71
|
+
|
|
72
|
+
if (token) {
|
|
73
|
+
statusIndicator.className = 'status success';
|
|
74
|
+
statusIndicator.textContent = 'Active';
|
|
75
|
+
tokenValue.textContent = token;
|
|
76
|
+
} else {
|
|
77
|
+
statusIndicator.className = 'status pending';
|
|
78
|
+
statusIndicator.textContent = 'Pending';
|
|
79
|
+
tokenValue.textContent = 'Not available';
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
if (errorCode) {
|
|
83
|
+
errorCodeElement.textContent = errorCode;
|
|
84
|
+
errorContainer.style.display = 'block';
|
|
85
|
+
} else {
|
|
86
|
+
errorContainer.style.display = 'none';
|
|
87
|
+
}
|
|
88
|
+
};
|
|
89
|
+
|
|
90
|
+
document.addEventListener(FRAUD_PREVENTION_EVENTS.NAMESPACE, (event) => {
|
|
91
|
+
switch (event.detail.type) {
|
|
92
|
+
case FRAUD_PREVENTION_EVENTS.TYPES.FINTERPRINT_TOKEN_READY: {
|
|
93
|
+
token = event.detail.payload.token;
|
|
94
|
+
break;
|
|
95
|
+
}
|
|
96
|
+
case FRAUD_PREVENTION_EVENTS.TYPES.FINGERPRINT_TOKEN_ERROR: {
|
|
97
|
+
errorCode = event.detail.payload.code;
|
|
98
|
+
break;
|
|
99
|
+
}
|
|
100
|
+
default: {
|
|
101
|
+
throw new Error(
|
|
102
|
+
`${FRAUD_PREVENTION_EVENTS.NAMESPACE} emitted an unsupported event: ${JSON.stringify(event.detail)}.`,
|
|
103
|
+
);
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
render();
|
|
108
|
+
});
|
|
109
|
+
|
|
110
|
+
const fraudPreventionServiceConfig = {
|
|
111
|
+
environmentId: 'sandbox',
|
|
112
|
+
mode: 'test'
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
// Set "csp" to true if your website uses Content Security Policies
|
|
116
|
+
const csp = false;
|
|
117
|
+
|
|
118
|
+
new FraudPreventionService(fraudPreventionServiceConfig)
|
|
119
|
+
.withForter({
|
|
120
|
+
siteId: 'example_site_id_or_subsite_id',
|
|
121
|
+
csp,
|
|
122
|
+
});
|
|
123
|
+
|
|
124
|
+
// new FraudPreventionService(fraudPreventionServiceConfig)
|
|
125
|
+
// .withAccessTokenStrategy("eyJhb_access_token_example_...")
|
|
126
|
+
// .withForter({
|
|
127
|
+
// providerId: environment.forter.serviceId,
|
|
128
|
+
// csp,
|
|
129
|
+
// });
|
|
130
|
+
|
|
131
|
+
// new FraudPreventionService(fraudPreventionServiceConfig)
|
|
132
|
+
// .withPublicKeyStrategy("pk_example_...")
|
|
133
|
+
// .withForter({
|
|
134
|
+
// providerId: environment.forter.serviceId,
|
|
135
|
+
// csp,
|
|
136
|
+
// });
|
|
137
|
+
</script>
|
|
138
|
+
</body>
|
|
139
|
+
|
|
140
|
+
</html>
|
|
141
|
+
```
|
|
142
|
+
|
|
143
|
+
#### Forter: Content Security Policies
|
|
144
|
+
|
|
145
|
+
If your site enforces Content Security Policies (CSP), make sure to:
|
|
146
|
+
|
|
147
|
+
1. Set the `csp` option to `true` when invoking `withForter` on your `FraudPreventionService` instance.
|
|
148
|
+
2. Allowlist Forter's domains on `connect-src`, `script-src` and `worker-src` as shown below.
|
|
149
|
+
|
|
150
|
+
```bash
|
|
151
|
+
connect-src https://*.forter.com wss://cdn0.forter.com https://d2o5idwacg3gyw.cloudfront.net https://dz8rit8v72mig.cloudfront.net https://db7q4jg5rkhk8.cloudfront.net https://1.1.1.1 https://d94qwxh6czci4.cloudfront.net https://dr6vcclmzwk74.cloudfront.net https://d6rak4b14t5gp.cloudfront.net https://d3k4bt74u9esq1.cloudfront.net https://d1ezzflfzltk6e.cloudfront.net https://d3nocrch4qti4v.cloudfront.net https://duuytoqss3gu4.cloudfront.net https://df45ay5pw60dy.cloudfront.net
|
|
152
|
+
script-src https://*.forter.com https://dlthst9q2beh8.cloudfront.net https://d2nww8zpyj5pk0.cloudfront.net https://d2w2nqfk3z9hdt.cloudfront.net
|
|
153
|
+
worker-src blob:
|
|
154
|
+
```
|
|
File without changes
|
|
@@ -17,7 +17,7 @@ const widget = new Paydock.HtmlWidget('#selector', 'publicKey', 'gatewayId');
|
|
|
17
17
|
```
|
|
18
18
|
|
|
19
19
|
```js
|
|
20
|
-
// default import -
|
|
20
|
+
// default import - Not officially supported . They are handled differently by different tools / settings!
|
|
21
21
|
❌
|
|
22
22
|
import paydock from '@paydock/client-sdk'
|
|
23
23
|
>>> "Uncaught SyntaxError: The requested module does not provide an export named 'default'"
|
package/package.json
CHANGED
|
@@ -104,7 +104,7 @@
|
|
|
104
104
|
}
|
|
105
105
|
},
|
|
106
106
|
"name": "@paydock/client-sdk",
|
|
107
|
-
"version": "1.
|
|
107
|
+
"version": "1.123.2-beta",
|
|
108
108
|
"scripts": {
|
|
109
109
|
"build:doc": "node docs/html/marked.js",
|
|
110
110
|
"build:js": "rollup --config rollup.config.ts --configPlugin @rollup/plugin-typescript",
|
|
@@ -119,20 +119,21 @@
|
|
|
119
119
|
"compute:sha:bundles": "npm run compute:checksums:bundles | sha256sum",
|
|
120
120
|
"doc:cba": "run-s clean:lib tsc:cba markdown:cba",
|
|
121
121
|
"doc:paydock": "run-s clean:lib tsc:paydock markdown:paydock",
|
|
122
|
-
"lint": "tslint -c tslint.json 'src/**/*.ts{,x}'",
|
|
123
|
-
"lint:fix": "tslint -c tslint.json 'src/**/*.ts{,x}' --fix",
|
|
124
122
|
"markdown:cba": "grunt cba_docs",
|
|
125
123
|
"markdown:paydock": "grunt docs",
|
|
126
124
|
"publish:local": "./publish-to-local-registry.sh",
|
|
127
125
|
"replace:hosts": "grunt replace_hosts",
|
|
128
|
-
"test:browsers": "karma start --browsers Chrome,Firefox,ChromeHeadlessNoSandbox --single-run",
|
|
129
|
-
"test:chromium": "karma start --browsers ChromeHeadlessNoSandbox --single-run",
|
|
130
|
-
"test": "run
|
|
126
|
+
"test:mocha:browsers": "karma start --browsers Chrome,Firefox,ChromeHeadlessNoSandbox --single-run",
|
|
127
|
+
"test:mocha:chromium": "karma start --browsers ChromeHeadlessNoSandbox --single-run",
|
|
128
|
+
"test:vitest:coverage": "vitest run --coverage",
|
|
129
|
+
"test:vitest:watch": "vitest",
|
|
130
|
+
"test:vitest": "vitest run",
|
|
131
|
+
"test": "run-s test:mocha:chromium test:vitest",
|
|
131
132
|
"tsc:cba": "tsc --project tsconfig.cba.json",
|
|
132
133
|
"tsc:paydock": "tsc --project tsconfig.paydock.json",
|
|
133
134
|
"tidy:ci": "biome ci --no-errors-on-unmatched .",
|
|
134
|
-
"tidy:precommit": "biome
|
|
135
|
-
"tidy": "biome check --
|
|
135
|
+
"tidy:precommit": "biome check --no-errors-on-unmatched --staged --write .",
|
|
136
|
+
"tidy": "biome check --write --no-errors-on-unmatched --changed .",
|
|
136
137
|
"typecheck": "tsc --project tsconfig.json --noEmit"
|
|
137
138
|
},
|
|
138
139
|
"dependencies": {
|
|
@@ -152,6 +153,9 @@
|
|
|
152
153
|
"@babel/runtime": "7.24.5",
|
|
153
154
|
"@babel/runtime-corejs2": "7.24.5",
|
|
154
155
|
"@biomejs/biome": "1.9.4",
|
|
156
|
+
"@commitlint/cli": "19.5.0",
|
|
157
|
+
"@commitlint/config-conventional": "19.5.0",
|
|
158
|
+
"@golevelup/ts-vitest": "0.5.2",
|
|
155
159
|
"@rollup/plugin-babel": "6.0.4",
|
|
156
160
|
"@rollup/plugin-commonjs": "25.0.7",
|
|
157
161
|
"@rollup/plugin-json": "6.1.0",
|
|
@@ -172,6 +176,7 @@
|
|
|
172
176
|
"browserify": "17.0.0",
|
|
173
177
|
"browserify-istanbul": "2.0.0",
|
|
174
178
|
"buffer": "5.7.1",
|
|
179
|
+
"cross-fetch": "4.1.0",
|
|
175
180
|
"dotenv": "16.4.5",
|
|
176
181
|
"fs": "0.0.2",
|
|
177
182
|
"grunt": "1.6.1",
|
|
@@ -179,6 +184,7 @@
|
|
|
179
184
|
"grunt-jsdoc-to-markdown": "6.0.0",
|
|
180
185
|
"grunt-replace": "2.0.2",
|
|
181
186
|
"grunt-template-render": "0.0.1",
|
|
187
|
+
"happy-dom": "17.1.8",
|
|
182
188
|
"highlight.js": "11.9.0",
|
|
183
189
|
"ieee754": "1.2.1",
|
|
184
190
|
"include-all": "4.0.3",
|
|
@@ -194,7 +200,9 @@
|
|
|
194
200
|
"karma-jasmine": "1.1.2",
|
|
195
201
|
"karma-jasmine-ajax": "0.1.13",
|
|
196
202
|
"karma-mocha-reporter": "2.2.5",
|
|
203
|
+
"lefthook": "^1.10.10",
|
|
197
204
|
"marked": "4.3.0",
|
|
205
|
+
"msw": "2.7.3",
|
|
198
206
|
"npm-run-all2": "6.2.0",
|
|
199
207
|
"process": "0.11.10",
|
|
200
208
|
"rimraf": "5.0.7",
|
|
@@ -203,8 +211,8 @@
|
|
|
203
211
|
"rxjs": "7.8.1",
|
|
204
212
|
"tsify": "3.0.4",
|
|
205
213
|
"tslib": "2.6.2",
|
|
206
|
-
"tslint": "5.20.1",
|
|
207
214
|
"typescript": "5.4.5",
|
|
215
|
+
"vitest": "3.0.5",
|
|
208
216
|
"zod": "3.23.8"
|
|
209
217
|
},
|
|
210
218
|
"engines": {
|
package/slate.md
CHANGED
|
@@ -73,7 +73,7 @@ const widget = new Paydock.HtmlWidget('#selector', 'publicKey', 'gatewayId');
|
|
|
73
73
|
```
|
|
74
74
|
|
|
75
75
|
```js
|
|
76
|
-
// default import -
|
|
76
|
+
// default import - Not officially supported . They are handled differently by different tools / settings!
|
|
77
77
|
❌
|
|
78
78
|
import paydock from '@paydock/client-sdk'
|
|
79
79
|
>>> "Uncaught SyntaxError: The requested module does not provide an export named 'default'"
|
|
@@ -2061,3 +2061,158 @@ src.setStyles({
|
|
|
2061
2061
|
font_family: 'Arial',
|
|
2062
2062
|
});
|
|
2063
2063
|
```
|
|
2064
|
+
|
|
2065
|
+
# Fraud prevention
|
|
2066
|
+
|
|
2067
|
+
The Fraud Prevention module allows you to add security layers to your payment workflows
|
|
2068
|
+
by integrating with any of our underlying fraud prevention providers.
|
|
2069
|
+
|
|
2070
|
+
## Real time user behavior analysis
|
|
2071
|
+
|
|
2072
|
+
### Forter
|
|
2073
|
+
|
|
2074
|
+
One of Forter's key features is our ability to track the user's real-time behavior on
|
|
2075
|
+
the site and use it to separate fraudsters from legitimate buyers. To take advantage
|
|
2076
|
+
of Forter's technology, a JavaScript snippet needs to be placed on EVERY page
|
|
2077
|
+
of your commerce site beginning with the homepage and up to and including the final
|
|
2078
|
+
"Thank you for your purchase" page.
|
|
2079
|
+
|
|
2080
|
+
The integration is simple and straightforward - you only need to configure event
|
|
2081
|
+
listeners and then instantiate a FraudPreventionService with your site configuration.
|
|
2082
|
+
|
|
2083
|
+
Additional setup is required in case your website uses Content Security Policies (CSP)
|
|
2084
|
+
|
|
2085
|
+
#### Forter: Code snippet
|
|
2086
|
+
|
|
2087
|
+
```html
|
|
2088
|
+
<!doctype html>
|
|
2089
|
+
<html lang="en">
|
|
2090
|
+
|
|
2091
|
+
<head>
|
|
2092
|
+
<meta charset="utf-8">
|
|
2093
|
+
<title>Real time user behaviour anaylsis - Forter example</title>
|
|
2094
|
+
<base href="/">
|
|
2095
|
+
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
2096
|
+
<link rel="icon" type="image/x-icon" href="favicon.ico">
|
|
2097
|
+
<script src="https://widget.paydock.com/sdk/latest/widget.umd.js" ></script>
|
|
2098
|
+
</head>
|
|
2099
|
+
|
|
2100
|
+
<body>
|
|
2101
|
+
<main>
|
|
2102
|
+
<h1>Real time user behaviour anaylsis - Forter example</h1>
|
|
2103
|
+
<div class="forter-test">
|
|
2104
|
+
<h2>Forter Integration</h2>
|
|
2105
|
+
|
|
2106
|
+
<div class="status-card">
|
|
2107
|
+
<p>
|
|
2108
|
+
<strong>Integration Status:</strong>
|
|
2109
|
+
<span data-fraud-prevention="status-indicator" class="status pending">
|
|
2110
|
+
Pending
|
|
2111
|
+
</span>
|
|
2112
|
+
</p>
|
|
2113
|
+
<p>
|
|
2114
|
+
<strong>Token Value:</strong>
|
|
2115
|
+
<code data-fraud-prevention="forter-token">Not available</code>
|
|
2116
|
+
</p>
|
|
2117
|
+
<p data-fraud-prevention="error-container" style="display: none;">
|
|
2118
|
+
<strong>Error Code:</strong>
|
|
2119
|
+
<span data-fraud-prevention="error-code" class="error"></span>
|
|
2120
|
+
</p>
|
|
2121
|
+
</div>
|
|
2122
|
+
</div>
|
|
2123
|
+
</main>
|
|
2124
|
+
<script>
|
|
2125
|
+
const { FRAUD_PREVENTION_EVENTS, FraudPreventionService } = window.paydock
|
|
2126
|
+
|
|
2127
|
+
let token = '';
|
|
2128
|
+
let errorCode = '';
|
|
2129
|
+
|
|
2130
|
+
const render = () => {
|
|
2131
|
+
const statusIndicator = document.querySelector('[data-fraud-prevention="status-indicator"]');
|
|
2132
|
+
const tokenValue = document.querySelector('[data-fraud-prevention="forter-token"]');
|
|
2133
|
+
const errorContainer = document.querySelector('[data-fraud-prevention="error-container"]');
|
|
2134
|
+
const errorCodeElement = document.querySelector('[data-fraud-prevention="error-code"]');
|
|
2135
|
+
|
|
2136
|
+
if (token) {
|
|
2137
|
+
statusIndicator.className = 'status success';
|
|
2138
|
+
statusIndicator.textContent = 'Active';
|
|
2139
|
+
tokenValue.textContent = token;
|
|
2140
|
+
} else {
|
|
2141
|
+
statusIndicator.className = 'status pending';
|
|
2142
|
+
statusIndicator.textContent = 'Pending';
|
|
2143
|
+
tokenValue.textContent = 'Not available';
|
|
2144
|
+
}
|
|
2145
|
+
|
|
2146
|
+
if (errorCode) {
|
|
2147
|
+
errorCodeElement.textContent = errorCode;
|
|
2148
|
+
errorContainer.style.display = 'block';
|
|
2149
|
+
} else {
|
|
2150
|
+
errorContainer.style.display = 'none';
|
|
2151
|
+
}
|
|
2152
|
+
};
|
|
2153
|
+
|
|
2154
|
+
document.addEventListener(FRAUD_PREVENTION_EVENTS.NAMESPACE, (event) => {
|
|
2155
|
+
switch (event.detail.type) {
|
|
2156
|
+
case FRAUD_PREVENTION_EVENTS.TYPES.FINTERPRINT_TOKEN_READY: {
|
|
2157
|
+
token = event.detail.payload.token;
|
|
2158
|
+
break;
|
|
2159
|
+
}
|
|
2160
|
+
case FRAUD_PREVENTION_EVENTS.TYPES.FINGERPRINT_TOKEN_ERROR: {
|
|
2161
|
+
errorCode = event.detail.payload.code;
|
|
2162
|
+
break;
|
|
2163
|
+
}
|
|
2164
|
+
default: {
|
|
2165
|
+
throw new Error(
|
|
2166
|
+
`${FRAUD_PREVENTION_EVENTS.NAMESPACE} emitted an unsupported event: ${JSON.stringify(event.detail)}.`,
|
|
2167
|
+
);
|
|
2168
|
+
}
|
|
2169
|
+
}
|
|
2170
|
+
|
|
2171
|
+
render();
|
|
2172
|
+
});
|
|
2173
|
+
|
|
2174
|
+
const fraudPreventionServiceConfig = {
|
|
2175
|
+
environmentId: 'sandbox',
|
|
2176
|
+
mode: 'test'
|
|
2177
|
+
}
|
|
2178
|
+
|
|
2179
|
+
// Set "csp" to true if your website uses Content Security Policies
|
|
2180
|
+
const csp = false;
|
|
2181
|
+
|
|
2182
|
+
new FraudPreventionService(fraudPreventionServiceConfig)
|
|
2183
|
+
.withForter({
|
|
2184
|
+
siteId: 'example_site_id_or_subsite_id',
|
|
2185
|
+
csp,
|
|
2186
|
+
});
|
|
2187
|
+
|
|
2188
|
+
// new FraudPreventionService(fraudPreventionServiceConfig)
|
|
2189
|
+
// .withAccessTokenStrategy("eyJhb_access_token_example_...")
|
|
2190
|
+
// .withForter({
|
|
2191
|
+
// providerId: environment.forter.serviceId,
|
|
2192
|
+
// csp,
|
|
2193
|
+
// });
|
|
2194
|
+
|
|
2195
|
+
// new FraudPreventionService(fraudPreventionServiceConfig)
|
|
2196
|
+
// .withPublicKeyStrategy("pk_example_...")
|
|
2197
|
+
// .withForter({
|
|
2198
|
+
// providerId: environment.forter.serviceId,
|
|
2199
|
+
// csp,
|
|
2200
|
+
// });
|
|
2201
|
+
</script>
|
|
2202
|
+
</body>
|
|
2203
|
+
|
|
2204
|
+
</html>
|
|
2205
|
+
```
|
|
2206
|
+
|
|
2207
|
+
#### Forter: Content Security Policies
|
|
2208
|
+
|
|
2209
|
+
If your site enforces Content Security Policies (CSP), make sure to:
|
|
2210
|
+
|
|
2211
|
+
1. Set the `csp` option to `true` when invoking `withForter` on your `FraudPreventionService` instance.
|
|
2212
|
+
2. Allowlist Forter's domains on `connect-src`, `script-src` and `worker-src` as shown below.
|
|
2213
|
+
|
|
2214
|
+
```bash
|
|
2215
|
+
connect-src https://*.forter.com wss://cdn0.forter.com https://d2o5idwacg3gyw.cloudfront.net https://dz8rit8v72mig.cloudfront.net https://db7q4jg5rkhk8.cloudfront.net https://1.1.1.1 https://d94qwxh6czci4.cloudfront.net https://dr6vcclmzwk74.cloudfront.net https://d6rak4b14t5gp.cloudfront.net https://d3k4bt74u9esq1.cloudfront.net https://d1ezzflfzltk6e.cloudfront.net https://d3nocrch4qti4v.cloudfront.net https://duuytoqss3gu4.cloudfront.net https://df45ay5pw60dy.cloudfront.net
|
|
2216
|
+
script-src https://*.forter.com https://dlthst9q2beh8.cloudfront.net https://d2nww8zpyj5pk0.cloudfront.net https://d2w2nqfk3z9hdt.cloudfront.net
|
|
2217
|
+
worker-src blob:
|
|
2218
|
+
```
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/shared/http/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAA"}
|