mhenke / security-vulnerability-examples-next-js-postgres

Examples of Broken Security with Next.js + Postgres.js

Examples of common security mistakes causing broken authentication, broken authorization, secrets exposure, cross-site scripting and more.

Screenshot of the missing authentication example, where blog post content is incorrectly being shown to a user who is not logged in (all blog post content should be only visible to logged-in users)

Screenshot of the missing authorization example, where unpublished, private blog post content is incorrectly being exposed in the HTML to a user who is not the owner

Screenshot of the secrets exposure example, showing an API key being exposed

Screenshot of cross-site scripting example, showing an alert() triggered from an image with a broken src and an onerror attribute

Setup

Clone the repo and install the dependencies using pnpm:

pnpm install

If you are on Windows, you may receive an error about libpg-query not being able to be installed. In this case, edit your package.json file to remove the 2 lines starting with "@ts-safeql/eslint-plugin" and "libpg-query" and retry the installation using the command above.

Database Setup

Copy the .env.example file to a new file called .env (ignored from Git) and fill in the necessary information.

To install PostgreSQL on your computer, follow the instructions from the PostgreSQL step in UpLeveled's System Setup Instructions.

Then, connect to the built-in postgres database as administrator in order to create the database:

Windows

If it asks for a password, use postgres.

psql -U postgres

macOS

psql postgres

Linux

sudo -u postgres psql

Once you have connected, run the following to create the database:

CREATE DATABASE <database name>;
CREATE USER <user name> WITH ENCRYPTED PASSWORD '<user password>';
GRANT ALL PRIVILEGES ON DATABASE <database name> TO <user name>;

Quit psql using the following command:

\q

On Linux, you will also need to create a Linux system user with a name matching the user name you used in the database. It will prompt you to create a password for the user - choose the same password as for the database above.

sudo adduser <user name>

Once you're ready to use the new user, reconnect using the following command.

Windows and macOS:

psql -U <user name> <database name>

Linux:

sudo -u <user name> psql -U <user name> <database name>

Running Migrations

To set up the structure and the content of the database, run the migrations using Ley:

pnpm migrate up

To reverse the last single migration, run:

pnpm migrate down

Run Dev Server

Run the Next.js dev server with:

pnpm dev