Skip to content

Commit d3b6b57

Browse files
vncloudscovncloudsco
committed
init
1 parent bd8721b commit d3b6b57

29 files changed

Lines changed: 7986 additions & 2 deletions

‎.eslintrc.json‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"extends": "next/core-web-vitals"
3+
}

‎.github/DEPLOY_GUIDE.md‎

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
# 🚀 Quick Deploy Guide
2+
3+
## Bước 1: Push lên GitHub
4+
5+
```bash
6+
git init
7+
git add .
8+
git commit -m "Initial commit"
9+
git branch -M main
10+
git remote add origin https://github.com/YOUR_USERNAME/YOUR_REPO.git
11+
git push -u origin main
12+
```
13+
14+
## Bước 2: Cấu hình GitHub Pages
15+
16+
1. Vào repository trên GitHub
17+
2. Click **Settings** (⚙️)
18+
3. Click **Pages** (bên trái)
19+
4. Trong **Source**, chọn **GitHub Actions**
20+
5. Xong! 🎉
21+
22+
## Bước 3: Deploy
23+
24+
### Tự động (Recommended)
25+
Mỗi khi push lên `main`, website tự động deploy:
26+
```bash
27+
git add .
28+
git commit -m "Update"
29+
git push
30+
```
31+
32+
### Thủ công
33+
1. Vào tab **Actions**
34+
2. Click **Deploy to GitHub Pages**
35+
3. Click **Run workflow**
36+
37+
## URL của bạn
38+
39+
- Nếu repo tên là `username.github.io`:
40+
- URL: `https://username.github.io`
41+
42+
- Nếu repo tên khác (ví dụ: `modsec`):
43+
- URL: `https://username.github.io/modsec`
44+
- Cần set `NEXT_PUBLIC_BASE_PATH=/modsec` trong GitHub Secrets
45+
46+
## Kiểm tra
47+
48+
1. Vào tab **Actions**
49+
2. Đợi workflow chạy xong (✅)
50+
3. Mở URL của bạn
51+
52+
## Lỗi thường gặp
53+
54+
### ❌ Permission denied
55+
**Fix**: Settings > Actions > General > Workflow permissions > chọn "Read and write"
56+
57+
### ❌ 404 Not Found
58+
**Fix**: Kiểm tra `NEXT_PUBLIC_BASE_PATH` trong Settings > Secrets
59+
60+
### ❌ Build failed
61+
**Fix**: Xem logs trong Actions, thường do lỗi code
62+
63+
## Cần trợ giúp?
64+
65+
Xem [DEPLOYMENT.md](../DEPLOYMENT.md) để biết chi tiết đầy đủ.

‎.github/workflows/deploy.yml‎

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
name: Deploy to GitHub Pages
2+
3+
on:
4+
push:
5+
branches:
6+
- main
7+
workflow_dispatch:
8+
9+
permissions:
10+
contents: read
11+
pages: write
12+
id-token: write
13+
14+
concurrency:
15+
group: "pages"
16+
cancel-in-progress: false
17+
18+
jobs:
19+
build:
20+
runs-on: ubuntu-latest
21+
steps:
22+
- name: Checkout
23+
uses: actions/checkout@v4
24+
25+
- name: Setup Node.js
26+
uses: actions/setup-node@v4
27+
with:
28+
node-version: '20'
29+
cache: 'npm'
30+
31+
- name: Install dependencies
32+
run: npm ci
33+
34+
- name: Build with Next.js
35+
run: npm run build
36+
37+
- name: Upload artifact
38+
uses: actions/upload-pages-artifact@v3
39+
with:
40+
path: ./out
41+
42+
deploy:
43+
environment:
44+
name: github-pages
45+
url: ${{ steps.deployment.outputs.page_url }}
46+
runs-on: ubuntu-latest
47+
needs: build
48+
steps:
49+
- name: Deploy to GitHub Pages
50+
id: deployment
51+
uses: actions/deploy-pages@v4

‎.gitignore‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.js
7+
8+
# testing
9+
/coverage
10+
11+
# next.js
12+
/.next/
13+
/out/
14+
15+
# production
16+
/build
17+
18+
# misc
19+
.DS_Store
20+
*.pem
21+
22+
# debug
23+
npm-debug.log*
24+
yarn-debug.log*
25+
yarn-error.log*
26+
27+
# local env files
28+
.env*.local
29+
30+
# vercel
31+
.vercel
32+
33+
# typescript
34+
*.tsbuildinfo
35+
next-env.d.ts

‎LICENSE‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
MIT License
22

3-
Copyright (c) 2025 Tiny Active
3+
Copyright (c) 2025 Vi Mạnh Tường
44

55
Permission is hereby granted, free of charge, to any person obtaining a copy
66
of this software and associated documentation files (the "Software"), to deal

‎README.md‎

Lines changed: 109 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,109 @@
1-
# ModSecurity-Whitelist-Generator
1+
# ModSecurity Whitelist Generator
2+
3+
Ứng dụng web Next.js giúp tạo whitelist rules cho ModSecurity từ raw logs một cách dễ dàng và trực quan.
4+
5+
## ✨ Tính năng
6+
7+
- 📝 **Nhập Raw Log**: Paste ModSecurity error log trực tiếp vào giao diện
8+
- 🔍 **Phân Tích Log**: Tự động phân tích và trích xuất thông tin quan trọng
9+
- 🛡️ **Tạo Whitelist Rules**: Sinh ra nhiều mức độ whitelist rules khác nhau:
10+
- Global (disable toàn bộ rule)
11+
- Hostname-based (theo tên miền)
12+
- URI-based (theo đường dẫn)
13+
- Method-based (theo HTTP method)
14+
- IP-based (theo địa chỉ IP)
15+
- Combined rules (kết hợp nhiều điều kiện)
16+
- 📋 **Copy Rule**: Copy rule với một click
17+
- 🌐 **Song ngữ**: Hỗ trợ tiếng Việt và tiếng Anh
18+
- 🎨 **Giao diện đẹp**: Sử dụng shadcn/ui components với Tailwind CSS
19+
- ⚡ **Client-side Processing**: Tất cả xử lý diễn ra trên client, không cần server
20+
- 🚀 **GitHub Pages Ready**: Tự động deploy với GitHub Actions
21+
22+
## 🚀 Cài đặt
23+
24+
```bash
25+
# Clone repository
26+
git clone <repository-url>
27+
cd modsec
28+
29+
# Cài đặt dependencies
30+
npm install
31+
32+
# Chạy development server
33+
npm run dev
34+
```
35+
36+
Mở [http://localhost:3000](http://localhost:3000) để xem ứng dụng.
37+
38+
## 📖 Hướng dẫn sử dụng
39+
40+
1. **Nhập Log**: Paste raw log từ ModSecurity error log vào textarea hoặc sử dụng demo log
41+
2. **Phân Tích**: Click "Phân Tích Log" để xem thông tin chi tiết
42+
3. **Xem Rules**: Chuyển sang tab "Whitelist Rules" để xem các rule được tạo
43+
4. **Copy Rule**: Click nút "Copy" để copy rule cần thiết
44+
5. **Áp dụng**: Paste rule vào file cấu hình ModSecurity của bạn
45+
46+
### 🔢 Rule ID Range
47+
Các whitelist rules được tạo ra sẽ có ID trong khoảng **88,000,000 - 89,999,999**. Khoảng ID này được chọn để:
48+
- ✅ Tránh xung đột với OWASP CRS rules (900,000 - 999,999)
49+
- ✅ Tránh xung đột với custom rules thông thường (< 1,000,000)
50+
- ✅ Dễ nhận biết và quản lý whitelist rules
51+
- ✅ Đủ lớn để chứa ~2 triệu rules khác nhau
52+
53+
## 🛠️ Tech Stack
54+
55+
- **Framework**: Next.js 14 (App Router)
56+
- **Language**: TypeScript
57+
- **Styling**: Tailwind CSS
58+
- **UI Components**: shadcn/ui
59+
- **Icons**: Lucide React
60+
61+
## 📝 Ví dụ Log
62+
63+
```
64+
2025/10/30 10:22:36 [error] 36552#36552: *121 [client 206.189.2.13] ModSecurity: Access denied with code 403 (phase 2). Matched "Operator Ge' with parameter 5' against variable TX:BLOCKING_INBOUND_ANOMALY_SCORE' (Value: 5' ) [file "/etc/nginx/modsec/coreruleset/rules/REQUEST-949-BLOCKING-EVALUATION.conf"] [line "222"] [id "949110"] [rev ""] [msg "Inbound Anomaly Score Exceeded (Total Score: 5)"] [data ""] [severity "0"] [ver "OWASP_CRS/4.20.0-dev"] [maturity "0"] [accuracy "0"] [tag "anomaly-evaluation"] [tag "OWASP_CRS"] [hostname "dev.nginxwaf.me"] [uri "/config.json"] [unique_id "176181975684.311840"] [ref ""], client: 206.189.2.13, server: dev.nginxwaf.me, request: "GET /config.json HTTP/1.1", host: "dev.nginxwaf.me"
65+
```
66+
67+
## 🔧 Build & Deploy
68+
69+
### Local Development
70+
```bash
71+
# Build cho production
72+
npm run build
73+
74+
# Chạy production server
75+
npm start
76+
```
77+
78+
### Deploy lên GitHub Pages
79+
80+
Ứng dụng này được cấu hình sẵn để deploy tự động lên GitHub Pages bằng GitHub Actions.
81+
82+
#### Quick Start:
83+
1. Push code lên GitHub repository
84+
2. Vào **Settings** > **Pages** > chọn **Source: GitHub Actions**
85+
3. Push code lên branch `main` - website sẽ tự động deploy!
86+
87+
#### Chi tiết:
88+
Xem file [DEPLOYMENT.md](./DEPLOYMENT.md) để biết hướng dẫn chi tiết về:
89+
- Cấu hình GitHub Pages
90+
- Deploy tự động với GitHub Actions
91+
- Cấu hình custom domain
92+
- Troubleshooting
93+
94+
### Deploy lên Vercel/Netlify
95+
```bash
96+
# Vercel
97+
npx vercel
98+
99+
# Netlify
100+
npx netlify deploy
101+
```
102+
103+
## 📄 License
104+
105+
MIT
106+
107+
## 🤝 Contributing
108+
109+
Contributions, issues và feature requests đều được chào đón!

‎app/globals.css‎

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
@tailwind base;
2+
@tailwind components;
3+
@tailwind utilities;
4+
5+
@layer base {
6+
:root {
7+
--background: 0 0% 100%;
8+
--foreground: 222.2 84% 4.9%;
9+
--card: 0 0% 100%;
10+
--card-foreground: 222.2 84% 4.9%;
11+
--popover: 0 0% 100%;
12+
--popover-foreground: 222.2 84% 4.9%;
13+
--primary: 221.2 83.2% 53.3%;
14+
--primary-foreground: 210 40% 98%;
15+
--secondary: 210 40% 96.1%;
16+
--secondary-foreground: 222.2 47.4% 11.2%;
17+
--muted: 210 40% 96.1%;
18+
--muted-foreground: 215.4 16.3% 46.9%;
19+
--accent: 210 40% 96.1%;
20+
--accent-foreground: 222.2 47.4% 11.2%;
21+
--destructive: 0 84.2% 60.2%;
22+
--destructive-foreground: 210 40% 98%;
23+
--border: 214.3 31.8% 91.4%;
24+
--input: 214.3 31.8% 91.4%;
25+
--ring: 221.2 83.2% 53.3%;
26+
--radius: 0.5rem;
27+
}
28+
29+
.dark {
30+
--background: 222.2 84% 4.9%;
31+
--foreground: 210 40% 98%;
32+
--card: 222.2 84% 4.9%;
33+
--card-foreground: 210 40% 98%;
34+
--popover: 222.2 84% 4.9%;
35+
--popover-foreground: 210 40% 98%;
36+
--primary: 217.2 91.2% 59.8%;
37+
--primary-foreground: 222.2 47.4% 11.2%;
38+
--secondary: 217.2 32.6% 17.5%;
39+
--secondary-foreground: 210 40% 98%;
40+
--muted: 217.2 32.6% 17.5%;
41+
--muted-foreground: 215 20.2% 65.1%;
42+
--accent: 217.2 32.6% 17.5%;
43+
--accent-foreground: 210 40% 98%;
44+
--destructive: 0 62.8% 30.6%;
45+
--destructive-foreground: 210 40% 98%;
46+
--border: 217.2 32.6% 17.5%;
47+
--input: 217.2 32.6% 17.5%;
48+
--ring: 224.3 76.3% 48%;
49+
}
50+
}
51+
52+
@layer base {
53+
* {
54+
@apply border-border;
55+
}
56+
body {
57+
@apply bg-background text-foreground;
58+
}
59+
}

‎app/layout.tsx‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
import type { Metadata } from "next"
2+
import { Inter } from "next/font/google"
3+
import "./globals.css"
4+
import { LanguageProvider } from "@/contexts/LanguageContext"
5+
6+
const inter = Inter({ subsets: ["latin"] })
7+
8+
export const metadata: Metadata = {
9+
title: "ModSecurity Whitelist Generator",
10+
description: "Generate ModSecurity whitelist rules from raw logs",
11+
}
12+
13+
export default function RootLayout({
14+
children,
15+
}: {
16+
children: React.ReactNode
17+
}) {
18+
return (
19+
<html lang="en">
20+
<body className={inter.className}>
21+
<LanguageProvider>
22+
{children}
23+
</LanguageProvider>
24+
</body>
25+
</html>
26+
)
27+
}

0 commit comments

Comments
 (0)