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 security_vulnerability_examples_next_js_postgres;

CREATE USER security_vulnerability_examples_next_js_postgres
WITH
  ENCRYPTED PASSWORD 'security_vulnerability_examples_next_js_postgres';

GRANT ALL PRIVILEGES ON DATABASE security_vulnerability_examples_next_js_postgres TO security_vulnerability_examples_next_js_postgres;

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 security_vulnerability_examples_next_js_postgres

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

Windows and macOS:

psql -U security_vulnerability_examples_next_js_postgres security_vulnerability_examples_next_js_postgres

Linux:

sudo -u security_vulnerability_examples_next_js_postgres psql -U security_vulnerability_examples_next_js_postgres security_vulnerability_examples_next_js_postgres

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