Accept Hosted Embedded IFrame problems

john-raber — Tue, 24 Jan 2023 21:31:25 GMT

I am trying to use Accept Hosted to display the payment form in an embedded iframe on a django website. I have been able to get a form token back using the following code:

headers = {"Content-Type": "application/json"} return_options = { "settingName": "hostedPaymentReturnOptions", "settingValue": f"{{\"showReceipt\": false, \"url\": \"{order_complete_url}\"}}" } button_options = { "settingName": "hostedPaymentButtonOptions", "settingValue": '{\"text\": \"Pay\"}', } style_options = {"settingName": "hostedPaymentStyleOptions", "settingValue": '{\"bgColor\": \"blue\"}'} payment_options = { "settingName": "hostedPaymentPaymentOptions", "settingValue": "{\"cardCodeRequired\": true, \"showCreditCard\": true, \"showBankAccount\": false}" } billing_options = { "settingName": "hostedPaymentBillingAddressOptions", "settingValue": "{\"show\": true, \"required\": false}" } iframe_communicator_options = { "settingName": "hostedPaymentIFrameCommunicatorUrl", "settingValue": f"{{\"url\": \"{communicator_url}\"}}" } payload = { "getHostedPaymentPageRequest": { "merchantAuthentication": self.merchant_auth, "transactionRequest": { "transactionType": "authCaptureTransaction", "amount": str(order.grand_total), "customer": { "email": order.email_address, }, "billTo": { "firstName": order.billing_fname, "lastName": order.billing_lname, "address": f"{order.billing_address_1}, {order.billing_address_2}", "city": order.billing_city, "state": order.billing_state, "zip": order.billing_zipcode, "country": order.billing_country, }, }, "hostedPaymentSettings": { "setting": [return_options, button_options, style_options, payment_options, billing_options, iframe_communicator_options] } } } json_payload = json.dumps(payload) response = requests.post("https://apitest.authorize.net/xml/v1/request.api", headers=headers, data=json_payload)

I'm passing the form token to the front end from the view and when the page loads I submit this form to send the form token and get the form which is displayed when a credit card option is selected on the page.

The form that gets displayed looks like this:

So it has the order summary, but no actual inputs for credit card or billing information which should be showing up based on the parameters I am sending in the request for the form token. I have tried to set "showBankAccount" to true, but that didn't change the form at all.

Re: Accept Hosted Embedded IFrame problems

john-raber — Mon, 30 Jan 2023 20:39:09 GMT

The issue ended up being that my site was using a different version of bootstrap and jquery than what the examples were using. When I updated my versions to match up with the example app here: https://github.com/AuthorizeNet/webhooks-sample-app the inputs started to work as expected.

topic Accept Hosted Embedded IFrame problems in Integration and Testing

Accept Hosted Embedded IFrame problems

Re: Accept Hosted Embedded IFrame problems