the back end of the call Mollie API client request payment page written in express is localhost:8000
enter URLlocalhost:8000/api?issuer=ideal_ABNANL2A to jump directly to the payment page using the selected bank.
Front end is localhost:3000 package.json existing proxy
request for backend / api with axios get has no response. Why can I enter URL directly with backend?
the backend code is as follows
app.get("/api", (req, res) => {
console.log(req.query.issuer)
let selectedIssuer =req.query.issuer;
if (!selectedIssuer) {
console.log("No selected bank Issuer")
return
}
const orderId = new Date().getTime();
// After which you can create an iDEAL payment with the selected issuer.
mollieClient.payments
.create({
amount: { value: "10.00", currency: "EUR" },
description: "Test payment",
redirectUrl: `https://example.org/redirect?orderId=${orderId}`,
webhookUrl: `http://example.org/webhook?orderId=${orderId}`,
metadata: { orderId },
method: "ideal",
issuer: selectedIssuer,
})
.then(payment => {
// Redirect the consumer to complete the payment using `payment.getPaymentUrl()`.
res.redirect(payment.getPaymentUrl());
})
.catch(error => {
// Do some proper error handling.
res.send(error);
});
});
the front-end code is as follows
class App extends Component {
handleSend=()=>{
const obj=document.getElementById("issuer");
const index=obj.selectedIndex; //
const val = obj.options[index].text;
axios.get("/api",{
params:{
issuer:val }
}
)
}
render() {
return (
<div>
Hallo world
<form >
<select
id= "issuer"
name = "issuer">
<option value="ideal_ABNANL2A">ABN AMRO</option>
<option value="ideal_ASNBNL21">ASN Bank</option>
<option value="ideal_BUNQNL2A">bunq</option>
<option value="ideal_INGBNL2A">ING</option>
<option value="ideal_KNABNL2H">Knab</option>
<option value="ideal_MOYONL21">Moneyou</option>
<option value="ideal_RABONL2U">Rabobank</option>
<option value="ideal_RBRBNL21">RegioBank</option>
</select>
<button onClick={this.handleSend}>Select issuer</button>
</form>
</div>
);
}
}