Проблема с функцией персонализации на сайте аренды автомобилей ⇐ Python

[Anonymous]

В настоящее время я работаю на веб -сайте аренды автомобилей для школьного проекта, используя Angular для Frontend и Python (колба) для бэкэнда. Я сталкиваюсь с проблемами реализации функции персонализации, в которой пользователи должны видеть бронирования, которые принадлежат им, а не кому -то другому при регистрации. Перейдите на страницу бронирования, приложение должно отображать только их бронирование. Тем не менее, я сталкиваюсь с трудностями с процессом поиска идентификатора пользователя и избрания данных. Угловая) и бэкэнд (колба). Я использую SQLite для базы данных. Конечные точки резервации.
Хранение идентификатора пользователя в сеансе после входа в систему.
Froderend Code: < /p>
Угловые услуги для бронирования и авторизации.
Компоненты для бронирования и бронирования и Отображение бронирования пользователей.
Реактивные формы для входа. < /p>
Бэкэнд: < /p>
from flask import Flask, request, jsonify, session
from flask_cors import CORS
import hashlib
import sqlite3

app = Flask(__name__)
CORS(app)

# Set the secret key
app.config['SECRET_KEY'] = 'secret password'

def hash_password(password):
return hashlib.sha256(password.encode()).hexdigest()

def create_users_table():
with sqlite3.connect('rental-users.db') as conn:
cursor = conn.cursor()
cursor.execute('''
CREATE TABLE IF NOT EXISTS users (
id INTEGER PRIMARY KEY AUTOINCREMENT,
firstname TEXT NOT NULL,
lastname TEXT NOT NULL,
email TEXT UNIQUE NOT NULL,
mobile TEXT NOT NULL,
gender TEXT NOT NULL,
hashed_password TEXT NOT NULL,
reservations TEXT DEFAULT '[]'
)
''')
conn.commit()

def create_reservations_table():
with sqlite3.connect('rental-users.db') as conn:
cursor = conn.cursor()
cursor.execute('''
CREATE TABLE IF NOT EXISTS reservations (
id INTEGER PRIMARY KEY AUTOINCREMENT,
user_id INTEGER,
brand TEXT NOT NULL,
from_location TEXT NOT NULL,
to_location TEXT NOT NULL,
FOREIGN KEY (user_id) REFERENCES users (id)
)
''')
conn.commit()

create_users_table()
create_reservations_table()

@app.route('/register', methods=['POST'])
def register_user():
data = request.json

# Validate required fields
required_fields = ['firstname', 'lastname', 'email', 'mobile', 'gender', 'pwd']

for field in required_fields:
if field not in data:
return jsonify({'error': f'Missing required field: {field}'}), 400

# Validate email uniqueness
with sqlite3.connect('rental-users.db') as conn:
cursor = conn.cursor()
cursor.execute('SELECT * FROM users WHERE email = ?', (data['email'],))
existing_user = cursor.fetchone()

if existing_user:
return jsonify({'error': 'Email is already registered'}), 400

# Hash the password before storing it
hashed_password = hash_password(data['pwd'])

# Create a user object and add it to the users table
with sqlite3.connect('rental-users.db') as conn:
cursor = conn.cursor()
cursor.execute('''
INSERT INTO users (firstname, lastname, email, mobile, gender, hashed_password)
VALUES (?, ?, ?, ?, ?, ?)
''', (data['firstname'], data['lastname'], data['email'], data['mobile'], data['gender'], hashed_password))
conn.commit()

return jsonify({'message': 'Registration successful'})

@app.route('/login', methods=['POST'])
def login_user():
data = request.json

# Validate required fields
required_fields = ['email', 'pwd']
for field in required_fields:
if field not in data:
return jsonify({'error': f'Missing required field: {field}'}), 400

# Check if the user exists
with sqlite3.connect('rental-users.db') as conn:
cursor = conn.cursor()
cursor.execute('SELECT * FROM users WHERE email = ?', (data['email'],))
user = cursor.fetchone()

if user:
# Check if the provided password matches the hashed password in the database
hashed_password = hash_password(data['pwd'])
if hashed_password == user[6]: # Assuming hashed_password is at index 6
# Store user ID in session
session['user_id'] = user[0]
return jsonify({'message': 'Login successful'})
else:
return jsonify({'error': 'Invalid password'}), 401
else:
return jsonify({'error': 'User not found'}), 404

@app.route('/logout', methods=['POST'])
def logout_user():
# Clear the user ID from the session
session.pop('user_id', None)
return jsonify({'message': 'Logout successful'})

@app.route('/make-reservation/', methods=['POST'])
def make_reservation(user_id):
data = request.json

# Print the received data
print('Received Data:', data)

with sqlite3.connect('rental-users.db') as conn:
cursor = conn.cursor()
cursor.execute('''
INSERT INTO reservations (user_id, brand, from_location, to_location)
VALUES (?, ?, ?, ?)
''', (user_id, data.get('brand'), data.get('from_location'), data.get('to_location')))
conn.commit()

return jsonify({'message': 'Reservation successful'})

@app.route('/user-reservations/', methods=['GET'])
def get_user_reservations(user_id):
with sqlite3.connect('rental-users.db') as conn:
cursor = conn.cursor()
cursor.execute('SELECT * FROM reservations WHERE user_id = ?', (user_id,))
reservations = [
{'id': row[0], 'user_id': row[1], 'brand': row[2], 'from_location': row[3], 'to_location': row[4]}
for row in cursor.fetchall()
]
print(reservations)
return jsonify(reservations)

if __name__ == '__main__':
app.run(debug=True)
< /code>
frontend:
Authorizationservice < /p>
import { Injectable } from '@angular/core';
import { Router } from '@angular/router';
import { HttpClient } from '@angular/common/http';
import { Observable, throwError } from 'rxjs';
import { catchError, tap } from 'rxjs/operators';

@Injectable({
providedIn: 'root'
})
export class AuthorizationService {
private apiUrl = 'http://localhost:5000';
private user: any = { id: null, firstname: '', lastname: '', email: '' };
private logged = false;
private signedUp = false;

get isLoggedIn(): boolean {
return this.logged;
}

hasSignedUp(): boolean {
return this.signedUp;
}

loginUser(loginData: any): Observable {
const url = `${this.apiUrl}/login`;
return this.http.post(url, loginData).pipe(
tap((user) => {
this.user = user;
this.logged = true;
}),
catchError((error) => {
this.logged = false;
return throwError(error);
})
);
}

logout(): Observable {
const url = `${this.apiUrl}/logout`;
return this.http.post(url, {}).pipe(
tap(() => {
this.user = { id: null, firstname: '', lastname: '', email: '' };
this.logged = false;
this.router.navigate(['/login']);
})
);
}

registerUser(formData: any): Observable {
const url = `${this.apiUrl}/register`;
return this.http.post(url, formData).pipe(
tap((user) => {
this.user = user;
this.signedUp = true;
}),
catchError((error) => {
this.signedUp = false;
return throwError(error);
})
);
}

getUserId(): number | null {
return this.user.id ?? null;
}

constructor(private router: Router, private http: HttpClient) {}
}

< /code>
Reservationservice < /p>
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';

@Injectable({
providedIn: 'root',
})
export class ReservationService {
private apiUrl = 'http://localhost:5000';

constructor(private http: HttpClient) {}

makeReservation(userId: number, selectedCar: string, fromLocation: string, toLocation: string): Observable {
const url = `${this.apiUrl}/make-reservation/${userId}`;
const reservationData = {
brand: selectedCar,
from_location: fromLocation,
to_location: toLocation,
};
return this.http.post(url, reservationData);
}

getUserReservations(userId: number): Observable {
const url = `${this.apiUrl}/user-reservations/${userId}`;
return this.http.get(url);
}

}

< /code>
myreservationscomponent < /p>
import { Component, OnInit } from '@angular/core';
import { AuthorizationService } from '../authorization.service';
import { ReservationService } from '../reservation.service';
import { ToastrService } from 'ngx-toastr';
import { AvailableCarsService } from '../available-cars.service';

@Component({
selector: 'app-my-reservations',
templateUrl: './my-reservations.component.html',
styleUrls: ['./my-reservations.component.css'],
})
export class MyReservationsComponent implements OnInit {
reservationData = {
brand: '',
from_location: '',
to_location: '',
};

reservations: any[] = [];
availableCars: any[] = [];

constructor(
private reservationService: ReservationService,
private authService: AuthorizationService,
private toastr: ToastrService,
private availableCarsService: AvailableCarsService
) {}

ngOnInit() {
this.loadReservationHistory();
this.loadAvailableCars();
}

makeReservation() {
const userId = this.authService.getUserId();

console.log('Reservation Payload:', {
userId: userId ?? 0,
brand: this.reservationData.brand,
from_location: this.reservationData.from_location,
to_location: this.reservationData.to_location,
});

this.reservationService
.makeReservation(
userId ?? 0,
this.reservationData.brand,
this.reservationData.from_location,
this.reservationData.to_location
)
.subscribe(
(res) => {
console.log(res);
this.toastr.success('Reservation successful!', 'Success');
this.loadReservationHistory();
},
(err) => {
console.error(err);
this.toastr.error('Error making reservation', 'Error');
}
);
}

loadReservationHistory() {
const userId = this.authService.getUserId();

this.reservationService.getUserReservations(userId ?? 0).subscribe(
(res) => {
console.log(res);
this.reservations = res;
},
(err) => {
console.error(err);
}
);
}
}

< /code>
logincomponent < /p>
import { Component, OnInit } from '@angular/core';
import { AuthorizationService } from '../authorization.service';
import { FormControl, FormGroup, Validators } from '@angular/forms';
import { Router } from '@angular/router';
import { ToastrService } from 'ngx-toastr'

@Component({
selector: 'app-login',
templateUrl: './login.component.html',
styleUrls: ['./login.component.css']
})
export class LoginComponent {
constructor(private authService: AuthorizationService, private router: Router, private toastr: ToastrService) {}

loginForm = new FormGroup({
email: new FormControl("", [Validators.required, Validators.email]),
pwd: new FormControl("", [Validators.required, Validators.minLength(6), Validators.maxLength(15)])
});

loginSubmitted() {
this.authService.loginUser(this.loginForm.value).subscribe(
res => {
console.log(res);
this.router.navigate(['/home']);
},
err => {
console.error(err);
}
);
}
get Email(): FormControl {
return this.loginForm.get('email') as FormControl;
}

get PWD(): FormControl {
return this.loginForm.get('pwd') as FormControl;
}

ngOnInit(): void {}

showToasterSuccess(){
this.toastr.success("Logged in successfully !!", "Enjoy!!",{
easing:"ease-in",
easeTime: 1000
});
}

}

< /code>
appmodule.ts
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import {HttpClientModule} from '@angular/common/http';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { ToastrModule } from 'ngx-toastr';
import { ToastModule } from 'primeng/toast';

import { AppComponent } from './app.component';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { HeaderComponent } from './header/header.component';
import { RouterModule } from '@angular/router';
import { HomeComponent } from './home/home.component';
import {FormsModule, ReactiveFormsModule} from '@angular/forms';
import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap';
import { MyAvailableCarsComponent } from './my-available-cars/my-available-cars.component';
import { MyReservationsComponent } from './my-reservations/my-reservations.component';
import { AboutUsComponent } from './about-us/about-us.component';
import { LoginComponent } from './login/login.component';
import { SignUpComponent } from './sign-up/sign-up.component';
import { CarInfoComponent } from './car-info/car-info.component';
import { ContactsComponent } from './contacts/contacts.component';

@NgModule({
declarations: [
AppComponent,
HeaderComponent,
HomeComponent,
MyAvailableCarsComponent,
MyReservationsComponent,
AboutUsComponent,
LoginComponent,
SignUpComponent,
CarInfoComponent,
ContactsComponent
],
imports: [
BrowserModule,
NgbDropdownModule,
RouterModule.forRoot([
{ path: 'my-reservations', component: MyReservationsComponent},
{ path: 'my-available-cars', component: MyAvailableCarsComponent},
{ path: 'about-us', component: AboutUsComponent},
{ path: 'sign-up', component: SignUpComponent},
{ path: 'login', component: LoginComponent},
{ path: 'home', component: HomeComponent},
{ path: 'contact', component: ContactsComponent},
{ path: '*', redirectTo:'/home' ,pathMatch : 'full'},
]),
NgbModule,
FormsModule,
HttpClientModule,
BrowserAnimationsModule,
ToastrModule.forRoot({
positionClass: "toast-top-right",
preventDuplicates: true,
timeOut: 2000,
}),
ToastModule,
ReactiveFormsModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
< /code>
myreservationshtml < /p>

Make a Reservation



Car Brand


From Location


To Location


Make Reservation




Your Reservations





#
Car
From
To




{{ i + 1 }}
{{ reservation.brand }}
{{ reservation.from_location }}
{{ reservation.to_location }}



No reservations found.






Подробнее здесь: https://stackoverflow.com/questions/777 ... al-website