Tengo una aplicación de reacción simple y estoy tratando de solicitar y publicar el método y generar la respuesta dentro de mi div de retorno. Recibo un error 400 en mi herramienta de desarrollo (red). He depurado la aplicación tantas veces. Simplemente no puedo ganar un premio gordo. Si ejecuta los puntos finales en cartero usando el token adjunto, verá la respuesta...
import React from "react"; function Checkout() { const handleSubmit = () => { const token = "TOKEN"; const data = { transactionReference: "string", paymentMethod: "CreditCard", checkoutOrderUrl: "http://www.test.com/", user: { name: "string", msisdn: "+27610983142", email: "test@test.com", }, payementMethodDetail: { RedirectUrl: "http://www.test.com", PurchaseEventWebhookUrl: "http://www.test.com", }, bundle: [ { productCode: "311", amount: 100, currencyCode: "ZAR", quantity: 1, }, ], }; const requestOptions = { method: "POST", headers: { "Content-Type": "application/json", Authorization: `Bearer ${token}`, }, body: data, }; fetch( "--------", requestOptions ) .then((response) => response.json()) .then((res) => console.log(res)); }; return ( <div className="App"> <button type="submit" onClick={handleSubmit}> Post Data </button> </div> ); } export default Checkout;No está serializando su objeto a JSON. En realidad estás enviando [object Object] . Use JSON.stringify para eso:
const requestOptions = { method: "POST", headers: { "Content-Type": "application/json", Authorization: `Bearer ${token}`, }, body: JSON.stringify(data), // <-- here! };Dentro de requestOptions necesita credenciales: 'incluir' , lo más probable es que sea un problema relacionado con CORS.