123 lines
5.6 KiB
TypeScript
123 lines
5.6 KiB
TypeScript
import nodemailer from 'nodemailer'
|
|
import { z } from 'zod'
|
|
|
|
const contactSchema = z.object({
|
|
name: z.string().min(2).max(100),
|
|
email: z.string().email().max(200),
|
|
message: z.string().min(10).max(5000),
|
|
})
|
|
|
|
const htmlEscapes: Record<string, string> = {
|
|
'&': '&',
|
|
'<': '<',
|
|
'>': '>',
|
|
'"': '"',
|
|
"'": ''',
|
|
}
|
|
|
|
function escapeHtml(value: string): string {
|
|
return value.replace(/[&<>"']/g, (c) => htmlEscapes[c] ?? c)
|
|
}
|
|
|
|
export default defineEventHandler(async (event) => {
|
|
const body = await readBody(event)
|
|
const parsed = contactSchema.safeParse(body)
|
|
if (!parsed.success) {
|
|
throw createError({ statusCode: 400, message: 'Invalid payload' })
|
|
}
|
|
const { name, email, message } = parsed.data
|
|
const config = useRuntimeConfig(event)
|
|
|
|
const transporter = nodemailer.createTransport({
|
|
host: config.smtpHost,
|
|
port: 465,
|
|
secure: true,
|
|
auth: {
|
|
user: config.smtpUser,
|
|
pass: config.smtpPass,
|
|
},
|
|
})
|
|
|
|
const escapedName = escapeHtml(name)
|
|
const escapedEmail = escapeHtml(email)
|
|
const escapedMessage = escapeHtml(message)
|
|
|
|
const dateStr = new Date().toLocaleString('fr-FR', {
|
|
day: 'numeric', month: 'long', year: 'numeric', hour: '2-digit', minute: '2-digit',
|
|
timeZone: 'Europe/Paris',
|
|
})
|
|
|
|
const html = `<!DOCTYPE html>
|
|
<html lang="fr">
|
|
<head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1.0"></head>
|
|
<body style="margin:0;padding:0;background-color:#030712;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;">
|
|
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="background-color:#030712;padding:40px 16px;">
|
|
<tr><td align="center">
|
|
<table role="presentation" width="600" cellpadding="0" cellspacing="0" style="max-width:600px;width:100%;">
|
|
<tr><td style="padding:32px 40px 24px;background-color:#0a0f1a;border-radius:16px 16px 0 0;border-bottom:1px solid #1f2937;">
|
|
<table role="presentation" width="100%" cellpadding="0" cellspacing="0">
|
|
<tr>
|
|
<td><span style="font-size:18px;font-weight:700;color:#ffffff;letter-spacing:-0.025em;">Killian' DAL-CIN</span></td>
|
|
<td align="right">
|
|
<span style="display:inline-block;width:8px;height:8px;border-radius:50%;background-color:#85cb85;margin-right:6px;vertical-align:middle;"></span>
|
|
<span style="font-size:12px;font-family:'Courier New',monospace;color:#85cb85;letter-spacing:0.05em;text-transform:uppercase;">New Message</span>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</td></tr>
|
|
<tr><td style="padding:0;background-color:#0a0f1a;">
|
|
<table role="presentation" width="100%" cellpadding="0" cellspacing="0">
|
|
<tr><td style="padding:28px 40px 20px;">
|
|
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="background-color:#111827;border-radius:12px;border:1px solid #1f2937;">
|
|
<tr><td style="padding:10px 16px;border-bottom:1px solid #1f2937;">
|
|
<span style="display:inline-block;width:10px;height:10px;border-radius:50%;background:#ef4444;margin-right:6px;opacity:0.7;"></span>
|
|
<span style="display:inline-block;width:10px;height:10px;border-radius:50%;background:#eab308;margin-right:6px;opacity:0.7;"></span>
|
|
<span style="display:inline-block;width:10px;height:10px;border-radius:50%;background:#22c55e;opacity:0.7;"></span>
|
|
<span style="font-family:'Courier New',monospace;font-size:11px;color:#6b7280;margin-left:12px;">contact@portfolio</span>
|
|
</td></tr>
|
|
<tr><td style="padding:20px;">
|
|
<div style="font-family:'Courier New',monospace;font-size:13px;line-height:2;color:#9ca3af;">
|
|
<span style="color:#85cb85;">$</span> <span style="color:#6b7280;">from:</span> <span style="color:#ffffff;font-weight:600;">${escapedName}</span><br>
|
|
<span style="color:#85cb85;">$</span> <span style="color:#6b7280;">email:</span> <a href="mailto:${escapedEmail}" style="color:#85cb85;text-decoration:none;">${escapedEmail}</a><br>
|
|
<span style="color:#85cb85;">$</span> <span style="color:#6b7280;">date:</span> <span style="color:#d1d5db;">${dateStr}</span>
|
|
</div>
|
|
</td></tr>
|
|
</table>
|
|
</td></tr>
|
|
</table>
|
|
<table role="presentation" width="100%" cellpadding="0" cellspacing="0">
|
|
<tr><td style="padding:0 40px;"><div style="height:1px;background:linear-gradient(to right,transparent,#1f2937,#3f8c3f,#1f2937,transparent);"></div></td></tr>
|
|
</table>
|
|
<table role="presentation" width="100%" cellpadding="0" cellspacing="0">
|
|
<tr><td style="padding:28px 40px 36px;">
|
|
<p style="margin:0 0 12px;font-family:'Courier New',monospace;font-size:11px;color:#6b7280;text-transform:uppercase;letter-spacing:0.1em;">Message</p>
|
|
<div style="font-size:15px;line-height:1.7;color:#e5e7eb;">${escapedMessage.replace(/\n/g, '<br>')}</div>
|
|
</td></tr>
|
|
</table>
|
|
</td></tr>
|
|
<tr><td style="padding:20px 40px 28px;background-color:#0a0f1a;border-radius:0 0 16px 16px;border-top:1px solid #1f2937;">
|
|
<table role="presentation" width="100%" cellpadding="0" cellspacing="0">
|
|
<tr>
|
|
<td><span style="font-size:12px;color:#4b5563;">killiandalcin.fr</span></td>
|
|
<td align="right"><span style="font-size:11px;font-family:'Courier New',monospace;color:#374151;">Built with Nuxt</span></td>
|
|
</tr>
|
|
</table>
|
|
</td></tr>
|
|
</table>
|
|
</td></tr>
|
|
</table>
|
|
</body>
|
|
</html>`
|
|
|
|
await transporter.sendMail({
|
|
from: `"Portfolio Killian'" <${config.smtpUser}>`,
|
|
to: config.smtpTo,
|
|
replyTo: email,
|
|
subject: `Nouveau message — ${name}`,
|
|
text: `De: ${name} <${email}>\n\n${message}`,
|
|
html,
|
|
})
|
|
|
|
return { success: true }
|
|
})
|