registration and login

This commit is contained in:
Elijah Lucian 2021-04-11 17:43:26 -07:00
parent 46e58722d6
commit b12692dc5f
11 changed files with 108 additions and 31 deletions

3
devops/nginx/Dockerfile Normal file
View File

@ -0,0 +1,3 @@
FROM nginx:1.14.2
COPY nginx.conf /etc/nginx/nginx.conf

View File

@ -0,0 +1,5 @@
#!/bin/sh
cat /nginx.conf > /etc/nginx/nginx.conf
exec "$@"

49
devops/nginx/nginx.conf Normal file
View File

@ -0,0 +1,49 @@
worker_processes 1;
events { worker_connections 1024; }
http {
upstream client {
server frontend:3000;
}
server {
listen 80;
error_log /var/log/nginx/error.log;
access_log /var/log/nginx/access.log;
client_max_body_size 10M;
location / {
proxy_pass http://client;
proxy_set_header Host $host;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header X-Forwarded-Ssl on; # Optional
proxy_set_header X-Forwarded-Port $server_port;
proxy_set_header X-Forwarded-Host $host;
# proxy_set_header X-Forwarded-Host $server_name;
}
location /api {
proxy_pass http://server:8000;
rewrite ^/api(.*)$ $1 break;
}
location /cable {
proxy_pass http://server:8000;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
# rewrite ^/cable(.*)$ $1 break;
}
location /socksjs-node {
proxy_pass http://server:8000;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
# rewrite ^/cable(.*)$ $1 break;
}
}
}

10
devops/var/www/index.html Normal file
View File

@ -0,0 +1,10 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body></body>
</html>

View File

@ -1,6 +1,18 @@
version: "3.8" version: "3.8"
services: services:
nginx:
build:
context: ./devops/nginx
depends_on:
- frontend
- server
volumes:
- ./devops/nginx/nginx.conf:/etc/nginx/nginx.conf
ports:
- 80:80
- 443:443
frontend: frontend:
build: build:
context: ./frontend context: ./frontend
@ -20,4 +32,4 @@ services:
- ./server:/usr/src/server - ./server:/usr/src/server
ports: ports:
- 8000:8000 - 8000:8000
command: ["python", "manage.py", "runserver"] command: ["python", "manage.py", "runserver", "0.0.0.0:8000"]

View File

@ -7,10 +7,10 @@ import { JWT, getJWT, setHeaders, setJWT, wipeJWT } from '../utils/jwt'
const dev = process.env.NODE_ENV === 'development' const dev = process.env.NODE_ENV === 'development'
export const logIn = async (username: string, password: string) => { export const logIn = async (username: string, password: string) => {
if (dev) return mockUser // if (dev) return mockUser
try { try {
const { data: jwt } = await axios.post<JWT>(`/api/login`, { const { data: jwt } = await axios.post<JWT>(`/api/dj-rest-auth/login/`, {
username, username,
password, password,
}) })

View File

@ -1,4 +1,3 @@
import React from 'react'
import { Layout } from 'antd' import { Layout } from 'antd'
import { useUserContext } from '../contexts/UserContext' import { useUserContext } from '../contexts/UserContext'
import { Login } from './pages/Login' import { Login } from './pages/Login'
@ -14,6 +13,7 @@ export const CoreLayout = () => {
const routes: NavRoute[] = [ const routes: NavRoute[] = [
{ exact: true, path: '/', label: 'Dashboard', component: Dashboard }, { exact: true, path: '/', label: 'Dashboard', component: Dashboard },
{ path: '/profile', label: 'Profile', component: Profile }, { path: '/profile', label: 'Profile', component: Profile },
{ path: '/login', label: 'Login', component: Login },
{ path: '/new/user', label: 'New User', component: NewUser }, { path: '/new/user', label: 'New User', component: NewUser },
] ]

View File

@ -2,8 +2,6 @@ import { Button, Form, Input, Layout, message } from 'antd'
import axios from 'axios' import axios from 'axios'
import { User } from '../../types' import { User } from '../../types'
axios.defaults.baseURL = 'http://localhost:8080/'
type NewUserForm = Omit<User, 'id'> & { type NewUserForm = Omit<User, 'id'> & {
password1: string password1: string
password2: string password2: string
@ -19,7 +17,7 @@ export const NewUser = () => {
return return
} }
axios.post(`/dj-rest-auth/registration`, user) axios.post(`/dj-rest-auth/registration/`, user)
} }
console.log('ASDFUASDJF') console.log('ASDFUASDJF')
@ -28,14 +26,14 @@ export const NewUser = () => {
<Layout> <Layout>
<Layout.Content> <Layout.Content>
<Form form={form} onFinish={handleFinish}> <Form form={form} onFinish={handleFinish}>
<Form.Item label="username" name="name"> <Form.Item label="username" name="username">
<Input></Input> <Input></Input>
</Form.Item> </Form.Item>
<Form.Item label="email" name="email"> <Form.Item label="email" name="email">
<Input></Input> <Input type="email"></Input>
</Form.Item> </Form.Item>
<Form.Item label="password" name="password1"> <Form.Item label="password" name="password1">
<Input></Input> <Input minLength={8}></Input>
</Form.Item> </Form.Item>
<Form.Item label="confirm" name="password2"> <Form.Item label="confirm" name="password2">
<Input></Input> <Input></Input>

View File

@ -1,31 +1,32 @@
import { FormEvent, useState } from 'react' import { Button, Form, Input } from 'antd'
import { useForm } from 'antd/lib/form/Form'
import { useUserContext } from '../../contexts/UserContext' import { useUserContext } from '../../contexts/UserContext'
type Credentials = {
username: string
password: string
}
export const Login = () => { export const Login = () => {
const { handleLogin } = useUserContext() const { handleLogin } = useUserContext()
const [username, setUsername] = useState('') const [form] = useForm<Credentials>()
const [password, setPassword] = useState('')
const handleSubmit = (e: FormEvent) => {
e.preventDefault()
const handleSubmit = ({ username, password }: Credentials) => {
handleLogin(username, password) handleLogin(username, password)
} }
return ( return (
<form onSubmit={handleSubmit}> <Form form={form} onFinish={handleSubmit}>
<input <Form.Item label="username" name="username">
onChange={(e) => setUsername(e.target.value)} <Input />
type="text" </Form.Item>
value={username} <Form.Item label="password" name="password">
/> <Input type="password" />
<input </Form.Item>
onChange={(e) => setPassword(e.target.value)} <Button type="primary" htmlType="submit">
type="text" Login!
value={password} </Button>
/> </Form>
<button type="submit">Login!</button>
</form>
) )
} }

View File

@ -12,7 +12,6 @@ import { useHistory } from 'react-router'
import { User } from '../types' import { User } from '../types'
import { getLoggedInUser, logIn, logOut } from '../api' import { getLoggedInUser, logIn, logOut } from '../api'
import axios from 'axios'
type Props = { type Props = {
children: React.ReactNode children: React.ReactNode

View File

@ -25,7 +25,7 @@ SECRET_KEY = 'ayr0nbsni^%h!xbeplx_v#b^cuj^adjg2*z7t@+ht7c=7*1u$e'
# SECURITY WARNING: don't run with debug turned on in production! # SECURITY WARNING: don't run with debug turned on in production!
DEBUG = True DEBUG = True
ALLOWED_HOSTS = [] ALLOWED_HOSTS = ['server']
# Application definition # Application definition