Client <----> CloudFlare <----> VPS

SHA1, SHA256 and SHA512 Implementation in JavaScript

Docs: MDN SubtleCrypto.digest()

Style Related

Add Style to the Chosen Router Link

The chosen router link has a class .router-link-exact-active

Vue Router Related

Navigation Guard

Docs: Navigation Guards

As the name suggests, the navigation guards provided by Vue router are primarily used to guard navigations either by redirecting it or canceling it.

To …

Just follow the docs. That's it. However, I do find a few things wrong in the docs when I followed it. I rewrite those parts and add some comments.

Some notes about this tutorial

Note

This is a tutorial. It is not intended to provide a reference guide, never mind …

Backend (Django) Part

Docs: django-cors-headers, django core settings

According to django-cors-headers, use:

python -m pip install django-cors-headers

to install django-cors-headers and add it to installed apps in settings.py

INSTALLED_APPS = [
    ...,
    "corsheaders",
    ...,
]

Add a middleware class to listen in on responses. The order of middlewares is important:

CorsMiddleware should be placed …