我正在尝试使用Adyen的安全字段来加密购物者的敏感数据
https://docs.adyen.com/developers/checkout/api-integration
输入应该在页面上呈现为iframe，但是出现以下错误。
iframe error
Libray嵌入到<head>
<script type="text/javascript" src="https://checkoutshopper-test.adyen.com/checkoutshopper/assets/js/sdk/checkoutSecuredFields.1.3.3.min.js"></script>
形成
<form class="flex-center position-ref h-100" action="{{ route('pay.credit') }}" method="post" id="adyen-encrypted-form">
@csrf()
@method('POST')
<div class="cards-div">
<div class="js-chckt-pm__pm-holder">
<input type="hidden" name="txvariant" value="card" />
{{--<div class="form-group">--}}
{{--<div class="form-control">--}}
<label>
<span class="input-field" data-cse="encryptedCardNumber"></span>
</label>
{{--</div>--}}
{{--</div>--}}
<div class="form-group">
<div class="form-control">
<label>
<span class="input-field" data-cse="encryptedExpiryMonth"></span>
</label>
</div>
</div>
<div class="form-group">
<div class="form-control">
<label>
<span class="input-field" data-cse="encryptedExpiryYear"></span>
</label>
</div>
</div>
<div class="form-group">
<div class="form-control">
<label>
<span class="input-field" data-cse="encryptedSecurityCode"></span>
</label>
</div>
</div>
<div id="pmHolder" class="js-chckt-pm__pm-holder">
<input type="hidden" name="txvariant" value="card">
<input type="hidden" name="encryptedCardNumber" id="card-encrypted-card" value="">
<input type="hidden" name="encryptedExpiryMonth" id="card-encrypted-month" value="">
<input type="hidden" name="encryptedExpiryYear" id="card-encrypted-year" value="">
<input type="hidden" name="encryptedSecurityCode" id="card-encrypted-code" value="">
</div>
<button type="submit" class="btn btn-success btn-lg btn-block">Pagar</button>
</div>
</div>
</form>
<body>底部的原始密钥<script type="text/javascript">
var csfSetupObj = {
rootNode: '.cards-div',
configObject : {
originKey : "pub.v2.8015418815230181.aHR0cDovL2FkeWVuLmJldGE.KfETYJbalDv9FEZ04R8azVjBqUreC611yhD-ZFMwZKI0"
}
};
var securedFields = csf(csfSetupObj);
</script>
最佳答案
只是因为我们也一直在碰这个问题，
确保在生成originKey时输入的域上正在测试adyens脚本。
那些必须匹配的脚本才能正常工作。如果要先在本地测试，请在Adyen面板中仅为localhost：8080生成第二个originKey，就像建议的luke_b一样。
如果domain和domain不匹配，则iframe将呈现，但不会显示（显示为disply：none样式）