I've integrated Stripe into my javascript app which works fine in my test environment using ngrok but once I switch to prod, my app is timing out as users attempt to leave the Stripe checkout screen.
The API calls going from my app to stripe work so customer is created and billing is setup. However, the Stripe webhook going from stripe back to my app on Heroku kicks error Timed out connecting to remote host.
This leads me to believe it's some sort of networking issue and not the code... a couple people have suggested updating my allowed domains like the stripe docs suggest but I can't figure out how to do that in Heroku?
For context...
Test environment webhook endpoint
https://6752-136-62-45-90.ngrok.io/users/stripe/webhook
Live endpoint
https://myapp.com/users/stripe/webhook
Am I on the right path and how do I configure Heroku to accept webhook post requests from Stripe?
Related
I've integrated Stripe into my javascript app which works fine in my test environment using ngrok but once I switch to prod, my app is timing out as users attempt to leave the Stripe checkout screen.
The Stripe webhook kicks error Timed out connecting to remote host and I think it's because I have the wrong endpoint.
Testing endpoint
https://6752-136-62-45-90.ngrok.io/users/stripe/webhook
Live endpoint
https://myapp.com/users/stripe/webhook
Everything else in the integration appears to work -- the customer is still created and the billing goes through but I need the endpoint code to run because it builds some critical infrastructure in the user profile.
I also have SSL encryption setup and DNS target on my Heroku application so I'm wondering if I should be using the DNS target or the Heroku app name for the endpoint instead of my domain.
My question
I can't really find any documentation on this but how do I configure my Stripe endpoint with my Heroku-hosted app?
You can test by setting the Heroku app name directly to check if it works to narrow down the issue. If it still doesn't, then most likely it's due to network issue.
Timed out connecting to remote host usually means that the server is not responding. This is likely due to network configuration such as firewall blocking the Stripe IP addresses. I'd recommend checking your network configuration and ensure that Stripe domains/IP addresses are in the allowed list: https://stripe.com/docs/ips
I am using Amplify to host for frontend app(React).
I have some console.log in the application, which is logged in browser inspector.
Are there any amplify functions/aws services which are able to log it somewhere, instead of logging it in browser inspecter?
You can use Amazon's Cloudwatch service to monitor your React application.
Useful readings:
Amplify Monitoring
Amazon Cloudwatch User Guide
Milan Gatyas's response regarding similar problem
In my development local environment, I'm using Firebase emulators for Hosting, Firestore and Functions.
I'm used to share a link with other people during development by using ngrok. I also use it to test on mobile devices during development.
This is the script:
"share": "ngrok http 80 -host-header=\"dev.myproject.com:80\"",
It works fine as far as redirecting to my dev domain host, which is dev.myproject.com.
But the emulators services become unavailable when you are accessing this link through a different device, i.e: a different PC or a mobile device.
Obviously, the firebase package is looking for those localhost emulators, which are only running in my local environment.
What is the workaround in this case? How to share a dev environment with other people / other devices when using firebase emulators? Is there an easy to do this?
Do I have to create an extra Firebase project to deploy the test version and its data and files? How do people usually handle this?
We are currently trying to do this using ngrok as well.
We are barely testing if it works, and so far it is doing so. So I'll share our work around with you.
What we do is
Start emulator firebase emulators:start (--import seedData if using )
Expose your server to the internet using ngrok by first starting it with ./ngrok http http://localhost:5001 (check your firebase.json in order to see what port your emulators.functions are exposed, in my case was port 5001)
This will output two URLs, with the following format https://[TWILIOADRESS].ngrok.io
In order to be able to invoke the implemented https function via its unique URL, append this to the provided ngrok URL: [project-id]/[project-implemented-region]]/[cloud-function-name]
You will end up with an URL that looks like this:
https://92003e41ecb0.ngrok.io/my-project-id/us-central1/cloudFunctionToExecute
Now you can make a request (from postman, in my case) to the exposed function emulator using this URL
If everything went alright, you should see some logs on the terminal where the emulators are running that tell you the function was executed, such as:
functions: Beginning execution of "us-central1-cloudFunctionToExecute
You can also check status and metrics information about connections made over your tunnel from the UI terminal provided when you start ngrok. ngrok provides a real-time web UI where you can introspect all of the HTTP traffic running over your tunnels. After you've started ngrok, just open http://localhost:4040 in a web browser to inspect request details
Background:
I am working on a project where we have a server setup in Java and for front-end we are using ReactJs. Our server ships all logs to Loki endpoint via their push API and all metrics to a prometheus push-gateway. Grafana then pulls those logs and metrics from Loki and push-gateway for display.
Requirement:
I want to persist and place the ReactJs application logs and metrics so they are visible on grafana. This will help us see both frontend and backend application logs & metrics in the same place. Is there a free, opensource Javascript library or framework that can help me with that. The less code I need to write the better.
I was opting for sentry before but it's not completely free anymore. And we cannot use console logging as it disappears on browser refresh and not really helpful in production
So I didn't find a good library at that time but I was eventually able to ship logs to loki push endpoint.
I tried to push logs directly from frontend to loki push endpoint. This gave me a cors error. So I came up with the following steps to get around cors with Loki.
My workaround:
Setup nginx proxy server.
Nginx resolves cors.
Add reverse proxy to nginx. I send request to nginx host and then it forwards that request to loki from within same network so no cors.
I took alot of reading and hit and trys but I got the setup working. We are now using this setup to push frontend logs to grafana
I am trying to build a metro style line of business app using JavaScript. This app is targeted at enterprise users inside my company firewall - no internet connection.
The app itself will run in Kiosk mode, running as a low-privilege account. I have figured out the CredentialPicker for asking the user for credentials. Now I would like to call an existing WebAPI REST service that is secured with Windows Integrated Authentication on a company server.
How can I make the request using the credential I receive from the CredentialPicker?
Thanks for the help!