CSP Quiz Review Ticket

Review Ticket

Review Ticket

Database with Schema Changes

class User(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    username = db.Column(db.String(128), unique=True, nullable=False)
    password = db.Column(db.String(128), nullable=False)
    what_grade = db.Column(db.String(50))  # New column for "what grade"
    email = db.Column(db.String(128))  # New column for "email"
    date_of_birth = db.Column(db.String(10))  # New column for "date of birth"
    gender = db.Column(db.String(10))  # New column for "gender"
    ip_address = db.Column(db.String(15))  # New column for IP address

    def serialize(self):
        return {
            "id": self.id,
            "username": self.username,
            "password": self.password,
            "what_grade": self.what_grade,
            "email": self.email,
            "date_of_birth": self.date_of_birth,
            "gender": self.gender,
            "ip_address": self.ip_address
        }

Initialization Code

from flask import Flask, jsonify, request
from flask_sqlalchemy import SQLAlchemy
from flask_restful import Resource, Api
from flask_cors import CORS

app = Flask(__name__)
CORS(app, resources={ r"/users/*": {"origins": ["http://127.0.0.1:4100", "https://srivaidyas.github.io"]},
    r"/login/*": {"origins": ["http://127.0.0.1:4100", "https://srivaidyas.github.io"]},
    r"/users": {"origins": ["http://127.0.0.1:4100", "https://srivaidyas.github.io"]}})
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///users.db'  # SQLite database file named users.db
db = SQLAlchemy(app)
api = Api(app)

Demonstrations

Demo delete and adding the database
Postman checks
Login fucntion
Register user function

Calling functions

Registering users

function registerUser() {
      const newUsername = document.getElementById("newUsernameInput").value;
      const newPassword = document.getElementById("newPasswordInput").value;

      // Make a POST request to register a new user
      fetch('http://127.0.0.1:5000/users', {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json',
        },
        body: JSON.stringify({
          username: newUsername,
          password: newPassword,
        }),
      })
      .then(response => response.json())
      .then(data => {
        console.log('User registration successful:', data);
        alert('Registration successful!');
        // Optionally, you can show a success message or redirect the user
      })
      .catch(error => {
        console.error('Error registering user:', error);
        alert('Registration failed. Please try again.');
        // Handle error, show error message, etc.
      });
    }

Verfying Users

    function loginUser() {
      const username = document.getElementById("usernameInput").value;
      const password = document.getElementById("passwordInput").value;

      // Make a POST request to check login credentials
      fetch('http://127.0.0.1:5000/login', {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json',
        },
        body: JSON.stringify({
          username: username,
          password: password,
        }),
      })
      .then(response => {
        if (response.ok) {
          console.log('Login successful');
          alert('Login succesful, redirecting you to the main page');
          // Optionally, you can redirect the user to another link
          window.location.href = 'https://srivaidyas.github.io/student2.0/AD_compsci.html';
        } else {
          console.log('Login failed');
          alert('Login failed, please check you credentials');
          // Optionally, you can show an error message
        }
      })
      .catch(error => {
        console.error('Error:', error);
        // Handle error, show error message, etc.
      });
    }

Image Screen shots