有一个页面,该页面带有已实现的付款请求api,具有Applepay按钮,一切正常。但是,一旦将页面嵌入到iframe中,就会发生SecurityError错误:试图从安全性与其顶层框架不同的文档中启动Apple Pay会话。
属性allowpaymentrequest ='true'
HTMLIFrameElement接口的allowPaymentRequest属性返回一个布尔值,该布尔值指示是否可以在跨域iframe上调用Payment Request API。
两个页面均为https。
example.com:
const applePayMethod = {
supportedMethods: "https://apple.com/apple-pay",
data: {
version: 3,
merchantIdentifier: "somemerchantid",
merchantCapabilities: ["supports3DS",],
supportedNetworks: ["masterCard", "visa"],
countryCode: "US",
},
};
const paymentDetails = {
total: {
label: "My Merchant",
amount: { value: "27.50", currency: "USD" },
},
}
try {
const request = new PaymentRequest([applePayMethod], paymentDetails, {});
const response = await request.show();
const status = processResponse(response);
response.complete(status);
} catch (e) {
console.log(e)
}
code-with-iframe.com
<iframe allowpaymentrequest='true' src="https://example.com/" frameborder="0"></iframe>