我正在尝试使用官方的 mollie api。当我在 React JS 中本地运行代码时,我收到以下错误: 然后我将代码上传到 firebase 托管。在那里我收到以下错误:
环境可以通过这个链接查看:https ://picoo-hire-b2c.web.app/ 如果你然后点击页面底部的'test transactie',错误将出现在console.log中。
我的代码如下所示:
import React, { Component } from 'react';
import logo from '../logo.svg';
import createMollieClient from '@mollie/api-client';
class formHandeling extends React.Component {
constructor(props) {
super(props);
this.state = {
name: 'Picoo',
email: '',
firstname: '',
lastname: '',
address: '',
postal: '',
city: '',
recommended: '',
errorMessage: '',
agreement: false,
contact: false,
newsletter: false
};
}
onChangeCaptacha(value) {
console.log("Captcha value:", value);
}
testPayment(){
createMollieClient({ apiKey: 'test_7K9sDETkbB7ctsJ2TqwyUnkAMf56ur' }).payments.create({
amount: {
value: '10.00',
currency: 'EUR'
},
description: 'Test of picoo mollie',
redirectUrl: 'https://yourwebshop.example.org/order/123456',
webhookUrl: 'https://yourwebshop.example.org/webhook'
})
.then(payment => {
// Forward the customer to the payment.getCheckoutUrl()
console.log("payment:"+payment);
})
.catch(error => {
// Handle the error
});
}
render() {
return (
<div className="container form-labels">
<label>
Email:<br />
<input type="text" value={this.state.email} onChange={event => this.setState({ email: event.target.email, errorMessage: '' })} />
</label>
<br />
<br />
<label>Voornaam:<br />
<input type="text" value={this.state.firstname} onChange={event => this.setState({ firstname: event.target.firstname, errorMessage: '' })} />
</label>
<br />
<br />
<label>
Achternaam:<br />
<input type="text" value={this.state.lastname} onChange={event => this.setState({ lastname: event.target.lastname, errorMessage: '' })} />
</label>
<br />
<br />
<label>
Adres:<br />
<input type="text" value={this.state.address} onChange={event => this.setState({ address: event.target.address, errorMessage: '' })} />
</label>
<br />
<br />
<label>
Postcode:<br />
<input type="text" value={this.state.postal} onChange={event => this.setState({ postal: event.target.postal, errorMessage: '' })} />
</label>
<br />
<br />
<label>
Plaats: <br />
<input type="text" value={this.state.city} onChange={event => this.setState({ city: event.target.city, errorMessage: '' })} />
</label>
<br />
<br />
<label>
Ja, ik ga akkoord met de huurvoorwaarden*
<input type="checkbox" checked={this.state.agreement} onChange={event => this.setState({ agreement: event.target.checked, errorMessage: '' })} />
</label>
<p>
Picoo is toegewijd aan het beschermen en respecteren van je privacy, en we zullen je persoonlijke informatie alleen gebruiken om de producten en diensten te leveren waar je ons om hebt gevraagd.
</p>
<label>
Ja, ik ben akkoord dat Picoo contact met mij opneemt.*
<input type="checkbox" checked={this.state.contact} onChange={event => this.setState({ contact: event.target.checked, errorMessage: '' })} />
</label>
<br />
<br />
<label>
Schrijf mij ook in voor de Picoo nieuwsbrief (niet verplicht)
<input type="checkbox" checked={this.state.newsletter} onChange={event => this.setState({ newsletter: event.target.checked, errorMessage: '' })} />
</label>
<p>
Bekijk ons privacybeleid voor meer informatie.
<br/><br/>
Door hieronder op verzenden te klikken, geef je toestemming aan picoo om de hierboven ingediende persoonlijke informatie op te slaan en te verwerken om je van de gevraagde inhoud te voorzien.
</p>
<button onClick={() => this.testPayment()}>Test transactie</button>
</div>
);
}
};
export default formHandeling;
有谁知道从哪里开始寻找?