MERN: 'Invalid API Key' Heroku Deployment? - javascript

How do I get Firebase Auth to work on Heroku Deployment?
Auth works in MERN app's local development without any issues. All private information is stored in an .env file and then called in my react app with process.env.VARIABLE_NAME.
However, when I deploy to Heroku production and add the env files as shown here, I get the error: "Your API key is invalid, please check you have copied it correctly"
This is my deployed Heroku app: https://evening-fortress-01391.herokuapp.com/login
REACT_APP_FIREBASE_API_KEY=XXXXXXXX
REACT_APP_FIREBASE_AUTH_DOMAIN=XXXXXXXX
REACT_APP_FIREBASE_PROJECT_ID=XXXXXXXX
REACT_APP_FIREBASE_STORAGE_BUCKET=XXXXXXXX
REACT_APP_FIREBASE_MESSAGING_SENDER_ID=XXXXXXXX
REACT_APP_FIREBASE_APP_ID=XXXXXXXX
Also, running the command heroku config displays the inputted env variables in the terminal.
Any idea why Auth works locally but not in deployment? Thank you!

Answer because too long for a comment.
Sounds super hard to debug - also your app just shows a login and not the API key error =) To me it sounds like either just like it says, an incorrect API key or a formatting issue.
I would make a test config variable using the same characters as your API key like REACT_APP_FIREBASE_POTATO=p07470-test-example-foooobar and then in your frontend app just console.log("TEST" + process.env.REACT_APP_FIREBASE_POTATO);. Then publish that and check it in production.
This tests are the environment variables working at all and are there some character encoding issues (do you see the exact characters in the console as you should)

Related

Netlify throws 404 error with /graphql only when deployed

I have an app which I had pushed to heroku a few days ago, where it works fine, but when deploying the app to Netlify, the app deploys but the graphQL connection throws a 404 error. Here are some images.
Here is the code I use in App.js
Is there anyone that knows how I can fix this? Much appreciated
Netlify doesn't run a app server like Heroku, it only runs a static file server. From your code, it appears that you're trying to serve a app that you could connect to and provide yourself with GraphQL access. This is not possible on Netlify, at least not directly.
The only server-like solution that Netlify currently provides in Netlify Functions. However, those are limited to 10 sec by default and provide, one-time data connection - not something that you could keep on using for GraphQL.
So if your requirement is to keep the GraphQL server running (for example like what Gatsby does during gatsby develop), Netlify is not the solution for you. If you wish to send the data one-time and add some server-side processing, you can take a look at Netlify Functions.

Prism V2 access denied to postgres database

I have created a brand new nodejs project with Prism2 and Postgres 13
Postgres is on a windows VM in the same network. Im testing Prism for the first time and cannot get it to deploy the database schema at all. I cant find anything that tells me how to fix this problem.
When i run npx prisma migrate dev all i get is Error: P1010: User 'johndoe' was denied access on the database 'db.public'. Ive searched for this error message and cant find any resolution, what is the issue here?
Actually the problem was resolved with some changes to the Postgres config files. By default its only listening to the local IP address of the machine that its installed on. With help from this post i was able to resolve the issue.
Made sure that the postgresql.conf listen_addresses was set to '*'. This was correct by default.
Made sure the pg_hba.conf IPv4 host was set within the range of my network. This was changed from host all all 127.0.0.1/32 to host all all 192.168.1.1/24
Restart the postgres service and now everything works as expected.
It's a bug in prisma library itself, has been reported and acknowledged. You can checkout the exact issue here

Firebase AppCheck - web app not working in debug mode

I have setup Firebase AppCheck for my Web App and everything seemed to work fine. Now I would like to enable the debug mode when developing my app.
I followed the instructions in the official documentation but I keep getting random errors from the AppCheck module, and these prevent my app from accessing Firebase Storage:
...at Backend FirebaseError: AppCheck: Fetch server returned an HTTP
error status. HTTP status: 429. (appCheck/fetch-status-error).
Following the doc, this is the way I set AppCheck in debug mode - this is ran before everything else:
if(window.location.hostname == "localhost")
self.FIREBASE_APPCHECK_DEBUG_TOKEN = true;
Again, when my app is not in debug mode it works just fine.
Note 1: that I am not enforcing AppCheck via the console, and that 100% of the requests are displayed as "Verified"
Note 2: googling for "Firebase error 429" shows many results referring to some quota being exceeded, something hardly possible for my dev environment (we are 2 devs and definitely not putting in any sort of load on the app)
Its a bug with the js library
https://github.com/firebase/firebase-js-sdk/issues/5052
You should be using environment variables to detect debugging mode or not.
Depending on your framework and setup, this could be a command that you set up in your serve/build commands or a local env file that contains a specific debug key.
There is another issue if your reCaptcha is set to use localhost as the documentation states:
Warning: Do not try to enable localhost debugging by adding localhost to reCAPTCHA’s allowed domains. Doing so would allow anyone to run your app from their local machines!

Build succeeded for heroku app but running into "Application Error"

When I checked the Heroku build logs, it showed this:
The requested API endpoint was not found. Are you using the right HTTP verb (i.e. GET vs. POST), and did you specify your intended version with the Accept header?
My app runs on React framework for front end, and I use the Firebase realtime database for my backend. The app runs fine on my local server but when I try to deploy on to Heroku I run into this error.
My guess is that you didn't set the environment variables, thus the base url for your request might be invalid. You can set them in Settings tab of your heroku application, under the Config Vars section.

What is causing my "illegal character in input string" exception with Facebook PHP SDK when deploying to Heroku?

"facebook/php-sdk-v4" : "4.0.*" - resolves to 4.0.15
Javascript SDK v2.2
I'm having an issue when deploying my laravel app to Heroku using the latest JS SDK and PHP SDK.
It works perfectly locally (nginx) but when deployed to Heroku (Apache) it fails here:
$helper = new FacebookJavaScriptLoginHelper();
with exception -
iconv_strlen(): Detected an illegal character in input string
Logs with both local and remote cookies look the same (structurally), so it's not that:
[fbsr_75710##########] => dJPP8B2GrKYHLmM8826lLXsjclHexnHv4V-dooUISI0.eyJhbGdvcml0aG0iOiJITUFDLVNIQTI...........
I ran into the same issue. If you look at the full stack trace you will see that mb_strlen is used before iconv and returns a bad result; turns out that on Heroku, the mbstring extension is not enabled by default. You need to manually request it in your composer.json, in the "require": bit:
"ext-mbstring": "*"
Update, push and it should work for you. Bit of a late answer but hopefully this will be helpful for anyone running into the same issue.

Categories