Home > database >  I tried to deploy my Express.js app on Heroku so many times and I get "Application error"
I tried to deploy my Express.js app on Heroku so many times and I get "Application error"

Time:12-27

I wanna deploy my Expree.js "Blogging-website" project on Heroku, But after trying soo many times I'm getting "Application error" that your app has been crashed "H10". This is package.json file. I followed all the steps , please let me know if I've missed anything :

{
  "name": "ejs-challenge",
  "version": "1.0.0",
  "description": "",
  "main": "app.js",
  "scripts": {
    "start": "node app.js"
 },
  "repository": {
    "type": "git",
    "url": "[email protected]:soniiya/Blogging-final.git"
  },
  "author": "",
  "license": "ISC",
  "engines": {
    "node": "14.17.6"
  },

And also added this in my app.js file:

app.listen(process.env.PORT || 3000, function () {
  console.log("Server started on port 3000");
});

I've created Procfile too "web: node app.js". Actually when I deployed the same app without User Authentication feature, it deployed successfully but when added authentication it's crashing now. I used MongoDB for database, If you have any suggestions then please let me know. What can cause "App crashed" on heroku?

This is the "heroku logs":

$ heroku logs --app agile-journey-27742
 »   Warning: heroku update available from 7.53.0 to
 »   7.59.2.
2021-12-25T15:01:48.138120 00:00 app[api]: Release v4 created by user [email protected]
2021-12-25T15:01:48.138120 00:00 app[api]: Set DB_PATH config vars by user [email protected]
2021-12-25T15:01:48.343377 00:00 heroku[web.1]: State changed from crashed to starting
2021-12-25T15:01:51.169675 00:00 heroku[web.1]: Starting process with command `node app.js`
2021-12-25T15:01:52.431858 00:00 app[web.1]: Sat, 25 Dec 2021 15:01:52 GMT express-session deprecated req.secret; provide secret option at app.js:50:9
2021-12-25T15:01:52.432471 00:00 app[web.1]: Warning: connect.session() MemoryStore is not
2021-12-25T15:01:52.432472 00:00 app[web.1]: designed for a production environment, as it will leak
2021-12-25T15:01:52.432472 00:00 app[web.1]: memory, and will not scale past a single process.
2021-12-25T15:01:52.442695 00:00 app[web.1]: /app/node_modules/passport-oauth2/lib/strategy.js:87
2021-12-25T15:01:52.442712 00:00 app[web.1]: if (!options.clientID) { throw new TypeError('OAuth2Strategy requires a clientID option'); }
2021-12-25T15:01:52.442713 00:00 app[web.1]: ^
2021-12-25T15:01:52.442713 00:00 app[web.1]:
2021-12-25T15:01:52.442713 00:00 app[web.1]: TypeError: OAuth2Strategy requires a clientID option
2021-12-25T15:01:52.442714 00:00 app[web.1]: at Strategy.OAuth2Strategy (/app/node_modules/passport-oauth2/lib/strategy.js:87:34)
2021-12-25T15:01:52.442714 00:00 app[web.1]: at new Strategy (/app/node_modules/passport-google-oauth20/lib/strategy.js:52:18)
2021-12-25T15:01:52.442714 00:00 app[web.1]: at Object.<anonymous> (/app/app.js:97:14)
2021-12-25T15:01:52.442714 00:00 app[web.1]: at Module._compile (internal/modules/cjs/loader.js:1072:14)
2021-12-25T15:01:52.442718 00:00 app[web.1]: at Object.Module._extensions..js (internal/modules/cjs/loader.js:1101:10)
2021-12-25T15:01:52.442718 00:00 app[web.1]: at Module.load (internal/modules/cjs/loader.js:937:32)
2021-12-25T15:01:52.442719 00:00 app[web.1]: at Function.Module._load (internal/modules/cjs/loader.js:778:12)
2021-12-25T15:01:52.442719 00:00 app[web.1]: at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:76:12)
2021-12-25T15:01:52.442719 00:00 app[web.1]: at internal/main/run_main_module.js:17:47
2021-12-25T15:01:52.585001 00:00 heroku[web.1]: Process exited with status 1
2021-12-25T15:01:52.686499 00:00 heroku[web.1]: State changed from starting to crashed
2021-12-25T15:02:05.594774 00:00 app[api]: Set DB_ADMIN config vars by user [email protected]
2021-12-25T15:02:05.594774 00:00 app[api]: Release v5 created by user [email protected]
2021-12-25T15:02:06.819898 00:00 heroku[web.1]: State changed from crashed to starting
2021-12-25T15:02:09.868314 00:00 heroku[web.1]: Starting process with command `node app.js`
2021-12-25T15:02:11.032225 00:00 app[web.1]: Sat, 25 Dec 2021 15:02:11 GMT express-session deprecated req.secret; provide secret option at app.js:50:9        
2021-12-25T15:02:11.032895 00:00 app[web.1]: Warning: connect.session() MemoryStore is not
2021-12-25T15:02:11.032896 00:00 app[web.1]: designed for a production environment, as it will leak
2021-12-25T15:02:11.032896 00:00 app[web.1]: memory, and will not scale past a single process.
2021-12-25T15:02:11.042607 00:00 app[web.1]: /app/node_modules/passport-oauth2/lib/strategy.js:87
2021-12-25T15:02:11.042608 00:00 app[web.1]: if (!options.clientID) { throw new TypeError('OAuth2Strategy requires a clientID option'); }
2021-12-25T15:02:11.042609 00:00 app[web.1]: ^
2021-12-25T15:02:11.042609 00:00 app[web.1]:
2021-12-25T15:02:11.042610 00:00 app[web.1]: TypeError: OAuth2Strategy requires a clientID option
2021-12-25T15:02:11.042610 00:00 app[web.1]: at Strategy.OAuth2Strategy (/app/node_modules/passport-oauth2/lib/strategy.js:87:34)
2021-12-25T15:02:11.042610 00:00 app[web.1]: at new Strategy (/app/node_modules/passport-google-oauth20/lib/strategy.js:52:18)
2021-12-25T15:02:11.042611 00:00 app[web.1]: at Object.<anonymous> (/app/app.js:97:14)
2021-12-25T15:02:11.042611 00:00 app[web.1]: at Module._compile (internal/modules/cjs/loader.js:1072:14)
2021-12-25T15:02:11.042611 00:00 app[web.1]: at Object.Module._extensions..js (internal/modules/cjs/loader.js:1101:10)
2021-12-25T15:02:11.042612 00:00 app[web.1]: at Module.load (internal/modules/cjs/loader.js:937:32)
2021-12-25T15:02:11.042612 00:00 app[web.1]: at Function.Module._load (internal/modules/cjs/loader.js:778:12)
2021-12-25T15:02:11.042612 00:00 app[web.1]: at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:76:12)
2021-12-25T15:02:11.042613 00:00 app[web.1]: at internal/main/run_main_module.js:17:47
2021-12-25T15:02:11.173932 00:00 heroku[web.1]: Process exited with status 1
2021-12-25T15:02:11.236915 00:00 heroku[web.1]: State changed from starting to crashed
2021-12-25T15:02:18.714430 00:00 app[api]: Set DB_PASS config vars by user [email protected]
2021-12-25T15:02:18.714430 00:00 app[api]: Release v6 created by user [email protected]
2021-12-25T15:02:18.957618 00:00 heroku[web.1]: State changed from crashed to starting
2021-12-25T15:02:21.915023 00:00 heroku[web.1]: Starting process with command `node app.js`
2021-12-25T15:02:23.655207 00:00 app[web.1]: Sat, 25 Dec 2021 15:02:23 GMT express-session deprecated req.secret; provide secret option at app.js:50:9        
2021-12-25T15:02:23.656076 00:00 app[web.1]: Warning: connect.session() MemoryStore is not
2021-12-25T15:02:23.656077 00:00 app[web.1]: designed for a production environment, as it will leak
2021-12-25T15:02:23.656077 00:00 app[web.1]: memory, and will not scale past a single process.
2021-12-25T15:02:23.667352 00:00 app[web.1]: /app/node_modules/passport-oauth2/lib/strategy.js:87
2021-12-25T15:02:23.667354 00:00 app[web.1]: if (!options.clientID) { throw new TypeError('OAuth2Strategy requires a clientID option'); }
2021-12-25T15:02:23.667355 00:00 app[web.1]: ^
2021-12-25T15:02:23.667355 00:00 app[web.1]:
2021-12-25T15:02:23.667355 00:00 app[web.1]: TypeError: OAuth2Strategy requires a clientID option
2021-12-25T15:02:23.667356 00:00 app[web.1]: at Strategy.OAuth2Strategy (/app/node_modules/passport-oauth2/lib/strategy.js:87:34)
2021-12-25T15:02:23.667356 00:00 app[web.1]: at new Strategy (/app/node_modules/passport-google-oauth20/lib/strategy.js:52:18)
2021-12-25T15:02:23.667356 00:00 app[web.1]: at Object.<anonymous> (/app/app.js:97:14)
2021-12-25T15:02:23.667357 00:00 app[web.1]: at Module._compile (internal/modules/cjs/loader.js:1072:14)
2021-12-25T15:02:23.667357 00:00 app[web.1]: at Object.Module._extensions..js (internal/modules/cjs/loader.js:1101:10)
2021-12-25T15:02:23.667358 00:00 app[web.1]: at Module.load (internal/modules/cjs/loader.js:937:32)
2021-12-25T15:02:23.667358 00:00 app[web.1]: at Function.Module._load (internal/modules/cjs/loader.js:778:12)
2021-12-25T15:02:23.667358 00:00 app[web.1]: at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:76:12)
2021-12-25T15:02:23.667359 00:00 app[web.1]: at internal/main/run_main_module.js:17:47
2021-12-25T15:02:24.059553 00:00 heroku[web.1]: Process exited with status 1
2021-12-25T15:02:24.113339 00:00 heroku[web.1]: State changed from starting to crashed
2021-12-25T15:04:27.000000 00:00 app[api]: Build started by user [email protected]
2021-12-25T15:04:55.732410 00:00 app[api]: Release v7 created by user [email protected]
2021-12-25T15:04:55.732410 00:00 app[api]: Deploy 28c347cb by user [email protected]
2021-12-25T15:04:55.964469 00:00 heroku[web.1]: State changed from crashed to starting
2021-12-25T15:04:58.000000 00:00 app[api]: Build succeeded
2021-12-25T15:04:58.661868 00:00 heroku[web.1]: Starting process with command `node app.js`
2021-12-25T15:04:59.859458 00:00 app[web.1]: Sat, 25 Dec 2021 15:04:59 GMT express-session deprecated req.secret; provide secret option at app.js:27:9        
2021-12-25T15:04:59.860069 00:00 app[web.1]: Warning: connect.session() MemoryStore is not
2021-12-25T15:04:59.860070 00:00 app[web.1]: designed for a production environment, as it will leak
2021-12-25T15:04:59.860070 00:00 app[web.1]: memory, and will not scale past a single process.
2021-12-25T15:04:59.869458 00:00 app[web.1]: /app/node_modules/passport-oauth2/lib/strategy.js:87
2021-12-25T15:04:59.869466 00:00 app[web.1]: if (!options.clientID) { throw new TypeError('OAuth2Strategy requires a clientID option'); }
2021-12-25T15:04:59.869466 00:00 app[web.1]: ^
2021-12-25T15:04:59.869467 00:00 app[web.1]:
2021-12-25T15:04:59.869467 00:00 app[web.1]: TypeError: OAuth2Strategy requires a clientID option
2021-12-25T15:04:59.869467 00:00 app[web.1]: at Strategy.OAuth2Strategy (/app/node_modules/passport-oauth2/lib/strategy.js:87:34)
2021-12-25T15:04:59.869467 00:00 app[web.1]: at new Strategy (/app/node_modules/passport-google-oauth20/lib/strategy.js:52:18)
2021-12-25T15:04:59.869468 00:00 app[web.1]: at Object.<anonymous> (/app/app.js:66:14)
rror code=H10 desc="App crashed" method=GET path="/" host=agile-journey-27742.herokuapp.com request_id=aa9d093d-d785-4933-9c55-b9ce42ed5075 fwd="110.227.56.110" dyno= connect= service= status=503 bytes= protocol=https
2021-12-25T15:05:06.063156 00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=agile-journey-27742.herokuapp.com request_id=231a0059-325c-4e81-b20d-20c70a8065d3 fwd="110.227.56.110" dyno= connect= service= status=503 bytes= protocol=https

CodePudding user response:

1. Try to set up this type of directory Structure

|__client/  THIS IS EVERYTHING FROM THE REACT SIDE 
    |__ node_modules/
        |__ tons of stuff...
    |__ public/
        |__ index.html
        |__ favicon.ico
        |__ etc.
    |__ src/
        |__ index.js
        |__ main/
            |__ App.js
            |__ etc.
|__ models/
    |__ user.js
    |__ todo.js
    |__ etc.
|__ node_modules/
    |__ stuff...
|__ routes
    |__ userRoutes.js
    |__ todoRoutes.js
    |__ etc.
|__ .gitignore
|__ package.json
|__ server.js
|__ etc.

2. Please Add this Middleware

// ... Other imports
const path = require("path");

// Other app.use middleware
app.use(express.static(path.join(__dirname, "client", "build")));

// Right before your app.listen(), add this:
app.get("*", (req, res) => {
  res.sendFile(path.join(__dirname, "client", "build", "index.html"));
});

app.listen(...);

3. Add a proxy to the client's package.json based on your deploy server

"proxy": "http://localhost:8000"

So, your package.json file looks like...

{
    "name": "client",
    "version": "0.1.0",
    "private": true,
    "dependencies": {
        "axios": "^0.17.1",
        "react": "^16.2.0",
        "react-dom": "^16.2.0",
        "react-scripts": "1.0.17"
    },
    "scripts": {
        "start": "react-scripts start",
        "build": "react-scripts build",
        "test": "react-scripts test --env=jsdom",
        "eject": "react-scripts eject"
    },
    "proxy": "http://localhost:8000"
}

4. Setting environment variables on the website:

A. Open your app in Heroku
B. Go to "Settings"
C. Click "Reveal Config Vars"
D. Add a new variable and click "Add". Done!
E. Your port has to look like:- process.env.PORT || 8000

Your Port looks like this:-

const port = process.env.PORT || 8000;
.
.
.
app.listen(port);

5. Set up MongoDB Atlas IP access control

Next, you'll need to whitelist your IP address so that you can access your cluster. Go to Network Access on the navigation menu, and Add IP Address. You can either Add Your Current IP Address or Allow Access from Anywhere. Confirm your choice.

For any projects deployed through Heroku, you'll have to select Allow Access from Anywhere. This is because Heroku uses Dynamic IPs. While this isn't the most secure option, it is fine for now.

6. Add this scripts start heroku-postbuild and engines

After all this, your server's package.json should look something like this: In the terminal, type node -v. It should spit out the version of Node.js you're using. add this version in the "engines": "14.17.5"

{
    "name": "mern-to-heroku",
    "version": "1.0.0",
    "main": "server.js",
    "license": "MIT",
    "dependencies": {
        "body-parser": "^1.18.2",
        "express": "^4.16.2",
        "mongoose": "^4.13.6",
        "morgan": "^1.9.0"
    },
    "scripts": {
        "start": "node server.js",
        "heroku-postbuild": "cd client && npm install --only=dev && npm install && npm run build"
    },
    "engines": {
        "node": "14.17.5"
    }
}

You should now be all set up to deploy your site through Heroku!

CodePudding user response:

The issue is your app can't find the Google Client ID.

It seems like you haven't configured your .env variables properly in Heroku. The solution is really simple.

DOTENV Approach If you've defined your .env in this manner,

MONGO_URL="xxx.....xxx"
GOOGLE_CLIENT_ID="xx......xxx"
GOOGLE_CLIENT_SECRET="xxx.....xxx"

and in your passport-setup and db-setup you are using dotenv as,

require('dotenv').config();
.
.
.
passport.use(
  new GoogleStrategy
  (
    {
      clientID : process.env.GOOGLE_CLIENT_ID,
      clientSecret : process.env.GOOGLE_CLIENT_SECRET,
      callbackURL : '/auth/google/callback'
    },
.
.
.

then, you must have declared a .env file in your project's root directory on your computer.

Your .gitignore file might have .env mentioned, as this is the standard way of doing it (You don't push env variables to public/team repositories).

The reason it works on your computer is that the app has the context of the environment variables. In Heroku since the .env file isn't present, the app doesn't know where to find them.

All you have to do is add your environment variables to Heroku. Just go to settings in Heroku Dashboard, go to the Config variables menu.

Add your env variables in the format

Restart the dyno.

This would solve your issue.

  • Related