не применяются стили к ejs странице ошибка в консоле:
в консоле браузера
sign_in:1 Refused to apply style from 'http://localhost:3000/desing/sign_in.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
в разделе Network Request URL: http://localhost:3000/desing/sign_in.css Request Method: GET Status Code: 404 Not Found Referrer Policy: strict-origin-when-cross-origin
Расположение файлов:
Network>
public>
desing>
sign_in.css
site>
server>
server.js
str>
sign_in.ejs
код server.js
const ejs = require("ejs")
const express = require('express')
const session = require('express-session')
const bc = require('bcrypt')
const app = express()
const sql = require('sqlite3')
const crypto = require('crypto')
const parser = require('body-parser');
const path = require("path")
const { log } = require("console")
app.use(express.static('public', {extensions: ['css'],
setHeaders: (res, path) => {
if (path.endsWith('.css')){
res.setHeader('Content-Type', 'text/css');
}
}
}));
const db = new sql.Database('./auth/auth.qlite3', (err)=>{
if (err){
console.log('Errpor' + err)
}else{
console.log('Databes Connected!')
return;
}
}
)
db.run(`CREATE TABLE IF NOT EXISTS users (
id INTEGER PRIMARY KEY AUTOINCREMENT,
login TEXT UNIQUE NOT NULL,
password TEXT NOT NULL)`)
app.use(parser.urlencoded({extended: false}))
app.use(parser.json())
//register
app.post('/sign_up', (req, res)=>{
let login_u = req.body.login_u;
let password_u = req.body.password_u;
bc.genSalt(10, (err, salt) => {
if (err){
console.log('Ошибка:' + err)
return;
}
bc.hash(password_u, salt, (err, hash) => {
if (err){
console.log('Ошибка при Hash' + err.message)
return;
}
db.get(`SELECT * FROM users WHERE login=?`, [login_u],(err, row)=>{
if (err){
console.log('Error:' + err)
res.status(500).json({error:'Ошибка при получении данных!'})
return;
}
if(row){
res.status(400).json({error:`Пользователь с логином ${login_u} - уже существует!`})
console.log(`Пользователь с логином ${login_u} - уже существует!`)
}
})
db.run(`INSERT INTO users (login, password) VALUES (?, ?)`, [login_u, hash],
(err)=> {
if (err){
console.log('Ошибка:' + err)
res.status(500, 'Ошибка при добавлении пользователя')
return;
}
res.send(`User ${login_u} is add`)
}
)
})
})
})
app.use(session({
secret: crypto.randomBytes(32).toString('hex'),
resave: false,
saveUninitialized: false,
cookie:{maxAge: 1000 * 60 * 60 * 24}
}))
app.post('/sign_in', (req, res) => {
const login = req.body.login;
const password = req.body.password;
console.log(login)
console.log(password)
db.get(`SELECT * FROM users WHERE login = ?`, [login], (err, row) => {
if (err) {
console.error(err);
res.status(500).send('Ошибка при получении данных');
return;
}
if (row) {
// Сравниваем пароли
bc.compare(password, row.password, (err, match) => {
if (err) {
console.log('Ошибка при проверке пароля:', err);
res.status(500).send('Ошибка при проверке пароля');
return;
}
// Проверяем результат сравнения
if (match) {
req.session.loggedIn = true;
req.session.userId = row.id;
req.session.username = row.login;
res.status(200).send('Авторизация прошла успешно!');
} else {
res.status(400).send('Неверный пароль!');
}
});
} else {
res.status(404).send('Пользователь не найден');
}
});
});
app.get('/profile', (req, res)=>{
if (req.session.loggedIn) {
res.send('Авторизован!')
console.log('+')
}else{
res.redirect('/sign_in')
}
})
app.set('view engine', 'ejs')
app.set('views', __dirname)
app.get('/sign_up', (req, res) => {
res.render('./str/sign_up.ejs')
})
app.get('/logout', (req, res)=>{
req.session.destroy((err) =>{
if (err){
console.error('Ошибка при уничтожении сессии' + err);
res.status(500).send('Ошибка при уничтожении сессии')
return;
}
res.redirect('/sign_in')
})
})
app.get('/sign_in', (req, res) => {
res.render('./str/sign_in.ejs')
})
app.listen(3000, ()=>{
console.log('Сервер работает!')
})код sign_in.ejs
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Sign in</title>
<link rel="stylesheet" href="/desing/sign_in.css">
</head>
<body>
<header>
<div class="txt1_net">Network</div>
<div class="txt2_net">Welcome to Network</div>
<div class="txt3_sign_up">создать акаунт</div>
</header>
<header>
<input class="int1_log" id="int1_log" type="text" placeholder="Login" min="3">
<input class="int2_pass" type="password" placeholder="password" min="5">
</header>
<header>
<a class="lnk1_pass">Забыл пароль?</a>
<a class="lnk2_sign_up">sign up</a>
<button class="btn1_sign_in" id="btn1_sign_in">sign in</button>
</header>
<script>
document.querySelector('.btn1_sign_in').addEventListener('click', function(){
let login = document.querySelector('.int1_log').value;
let password = document.querySelector('.int2_pass').value;
login = encodeURIComponent(login)
password = encodeURIComponent(password)
fetch('/sign_in', {
method : 'POST',
headers : {
'Content-Type':'application/x-www-form-urlencoded'
},
body : new URLSearchParams({login, password}).toString()
}) // Добавлены скобки после body
.then(response => {
if (response.ok){
console.log(`Проверка...`)
}else {
response.text().then(text =>{
console.error(`Ошибка при проверке:${text}`);
throw new Error(text);
})
}
})
.catch(error =>{
console.log('Ошибка при отправке запроса:', error)
console.status(500, error)
});
});
</script>
</body>
</html>