Dev setup for Authorize.NET AcceptJS

Question

I'm trying to setup a dev environment for React version of Authorize.NET AcceptJS.

I have my API server running on localhost:8080 and my react project running on localhost:4200. Everything works fine up to the point I submit credit card data to the Authorize.NET sandbox. I get an error "HTTPS connection required."

In the staging environment, on Azure, everything works, so I know the basic logic is right.

I just need to get the setup working in development. I'm not trying to debug the credit card logic, but I can't get to the logic I'm trying to debug because the card card stuff is failing. I could put in a bunch of code to bypass the credit card logic when NODE_ENV="development" but I really don't want to do that. The code is ugly enough as it is.

So how do I do this?

Answer 1

With the limited information provided, it sounds like you are trying to access their resources from your dev environment which is not running under https. You can create a certificate so that you can do your https://localhost rather than http://localhost and that will probably resolve your issue.

Answer 2

This turned out to be really easy. I modified my react startup to be...

set PORT=4200 && set HTTPS=true&&react-scripts start

Note that there is no space between the end of "true" and "&&". This is absolutely critical.

So now I can charge credit cards in the Authorize.NET sandbox. I do get the annoying Chrome warnings that the certificate I am using is untrusted, but Authorize.NET does not seem to care. There is a way to get Chrome to trust the localhost certificate but I am happy just ignoring all the warnings.