Krbsn.xyz
Le but de ce site est un réducteur d'URL, il permet de réduire une URL en une URL plus courte. Il permet également de voir les statistiques de l'URL raccourcie.
Frontend
Le site est basée sur le framework SSR Nuxt.js. Qui permet de gérer le SEO et le rendu côté serveur. J'ai également utilisé la librairie Nuxt UI pour les composants.
Backend
Le backend est lui aussi en NuXt.js, il permet de gérer les différentes requêtes de l'utilisateur. J'ai également utilisé la librairie Prisma pour gérer la base de données.
Pour gérer les utilisateurs qui cliquent sur les liens, j'ai utilisé les middlewares cotés serveur qui me permettent récupérer les informations de l'utilisateur et de les stocker dans la base de données en temps réel.
Code permettant de récupérer les informations de l'utilisateur et de les stocker dans la base de données :
import {getLinkBySlug} from "~/server/routes/models/links";
import {createVisit} from "~/server/routes/models/visits";
import geoip from 'geoip-lite';
export default defineEventHandler(async (event) => {
const ip = getHeader(event, 'x-real-ip') || getRequestIP(event, { xForwardedFor: true })
// const referer = getHeader(event, 'referer') || 'Unknown'
// console.log(referer)
const body = await readBody(event)
let referer;
const {browser, os, device, model, timezone, country, language, refer, plugins, screenSizes, screenOrientation} = body
if(!refer) {
referer = 'Unknown'
} else {
referer = refer
}
let city;
let cookieId;
if(!browser || !os || !device || !model || !timezone || !country || !language || !plugins || !screenSizes || !screenOrientation) {
throw createError({
statusCode: 400,
message: "Missing required fields"
})
}
const {linkSlug} = event.context.params
const link = await getLinkBySlug(linkSlug)
if(!link) {
throw createError({
statusCode: 404,
message: "No link found"
})
}
const getLink = await getLinkBySlug(linkSlug)
if(!getLink) {
throw createError({
statusCode: 404,
message: "No link found"
})
}
if(ip === '127.0.0.1') {
city = 'Unknown';
} else {
let geo = geoip.lookup(ip);
if(!geo.city) {
city = 'Unknown';
}
city = geo.city + ' (' + geo.country + ')';
}
cookieId = getCookie(event, 'cookieId')
if(!cookieId) {
cookieId = Math.random().toString(36).substring(7);
setCookie(event, 'cookieId', cookieId)
}
const addVisit = await createVisit({browser, os, device, timezone, country, city, model, ip, cookieId, urlId: parseInt(link.id), language, referer, plugins, screenSizes, screenOrientation})
if(!addVisit) {
throw createError({
statusCode: 400,
message: "Failed to add visit"
})
}
return {
url: getLink.url
}
})