Redirector

Table of Contents

• Redirector
  • Table of Contents
  • About
  • Prerequisites
  • Install
  • Building
  • Running the Server
  • Testing
  • Deploy to Heroku

This repo is a server that redirects a user to a password protected web page, and then automatically logs the user into the web page. The application is written entirely in TypeScript and features Apollo Server built atop Express that exposes a GraphQL API. The GraphQL Schema in this repo follows the code-first philosopy, and uses GraphQL Nexus to produce said schema. Databasing for the application is done through Prisma, which allows you to change whichever database you use on the fly. For our purposes, we chose a MySQL database as we get a speical deal on them from a particular provider. The repo implements testing via Jest and is facilitated by the use of Puppeteer.

About

The need for this project was born because we had a company web site that was protected by a password. The inteded users of the website, however, would not and do not know the password. So we needed a way to log users into the website automatically, but only if those users came from a particular origin. Thus, this proxy server was born.

When you navigate to this server, it automatically redirects you to the company web page in question, but it adds a query string containg a code (i.e. http:www.companywebsite.com/landingpage?code=the_validating_code_here). The company web page's landing page features a frontend script that is itself hosted on this server. The script fires off a GraphQL query that essetially asks the server if the code in the query string is valid. If the server returns a valid response (that the code is in fact valid), then the script fills out the password on the landing page and submits the form, logging the user into the website.

Building this repo produces the following bundle:

dist
├── client
│   └── redirector.js
└── server
    └── bundle.js

The file dist/client/redirector.js is the frontend script which is intended to be included on the landing page of the company website

The file dist/server/bundle.js is the server, which exposes the GraphQL API and also hosts the frontend script from above

Prerequisites

1. You must create an .env file based on the .env.example file with all the appropriate values
2. You must make sure your database is running (i.e. docker compose up -d in development)
   • Install Docker if you need to
3. You must install the depedencies (i.e pnpm install)
   • Install Node if you need to, version >=18.16.1 and npm version >=9.7.2
   • Install pnpm if you need to, version >=8.6.3

Install

In order to install the depedencies, run...

pnpm install

Building

In order to build the repo for development, run...

pnpm run build:dev

In order to build the repo for production (intended for Heroku), run...

pnpm run build:prod

Running the Server

In order to run the server, run...

pnpm run start

Testing

In order to run the Unit Tests, run...

pnpm run test:unit

In order to run the integration test, run...

pnpm run test:integration

Deploy to Heroku

1. You must publish your repo to github
2. You must connect your the github repo to the application in the Heroku as explained here
3. You must set the appropriate environment variables in Heroku as explained here
   • NODE_ENV (should be production)
   • SERVER__GRAPHQL_PATHNAME (should be /graphql)
   • SERVER__HOSTNAME (should be localhost)
   • DATABASE__DB_URL (should be your Database URL, check out JawsDB Maria for a free DB)
   • PORTAL__REDIRECT_URL (your web portal url)
   • PORTAL__PASSWORD (your web portal password)
   • SERVER__PRODUCTION_URL (your heroku app url, WITHOUT a / at the end)
4. You must set the appropriate buildpack, heroku-buildpack-pnpm
5. You must deploy the "main" branch as explained here
6. The Procfile will take care of starting the app and migrating the database