1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
|
<h1>This iframe calls shows() via postMessage()</h1>
<script>
"use strict";
const defaultMethods = Object.freeze([
{ supportedMethods: "basic-card" },
{
supportedMethods: "https://apple.com/apple-pay",
data: {
version: 3,
merchantIdentifier: "merchant.com.example",
countryCode: "US",
merchantCapabilities: ["supports3DS"],
supportedNetworks: ["visa"],
}
},
]);
const defaultDetails = Object.freeze({
id: "fail",
total: {
label: "Total",
amount: {
currency: "USD",
value: "1.00",
},
},
});
// We are going to use the id to prove that this works
// which we will pass back to the caller
window.onmessage = async event => {
const { source, data: { id, request } } = event;
switch (request) {
case "show-payment-request": {
const details = Object.assign({}, defaultDetails, { id });
const request = new PaymentRequest(defaultMethods, details);
try {
const response = await request.show();
source.postMessage(response.toJSON(), window.location.origin);
await response.complete();
} catch (err) {
source.postMessage({ requestId: "fail" }, window.location.origin);
await request.abort();
}
}
}
};
</script>
|