Estoy siguiendo los pasos de la documentación de MP pero al hacer click en el boton de Comprar, se abre el Modal de MP y dice "Oh, no, algo anduvo mal.", y en la consola recibo el siguiente error:
[Report Only] Refused to frame 'https://www.mercadopago.com.ar/' because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'self' *.mercadolibre.com".
El codigo que tengo hasta ahora es el siguiente, en React:
const mercadopago = require ('mercadopago');mercadopago.configure({ sandbox: true, access_token: 'TEST-1912802638413668-013002-510a91a112b7222641c5ca8914999ea6-123456789'});let preference = { items: [ { title: 'Mi producto', unit_price: 100, quantity: 1, } ]};mercadopago.preferences.create(preference) .then(function(mpResponse){ console.log(mpResponse); }) .catch(function(mpError){ console.log(mpError) });
y en HTML (esto muestra el boton de Comprar):
<form action="/procesar-pago" method="POST"><script src="https://www.mercadopago.com.ar/integrations/v1/web-payment-checkout.js" data-preference-id="$$id$$"></script></form>
La documentación que estoy siguiendo es esta: https://www.mercadopago.com.ar/developers/es/guides/payments/web-payment-checkout/integration/#editor_1589404763
Edit: hice un codesandbox para que sea mas facil de trabajar y ver:https://codesandbox.io/s/integracion-medios-de-pago-niuw3?file=/src/MercadoPago.js
Desde ya muchas gracias