Skip to content

Instantly share code, notes, and snippets.

@0xh7ml

0xh7ml/reqbin.html

Created August 20, 2025 06:38
Show Gist options
  • Save 0xh7ml/21a8d2c39c1263848e80491b14198a38 to your computer and use it in GitHub Desktop.
Save 0xh7ml/21a8d2c39c1263848e80491b14198a38 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
reqbin.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ReqBin UI</title>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body class="bg-light">
<div class="container py-4">
<div class="col-md-8 offset-md-2">
<h2 class="mb-4 text-center">ReqBin UI</h2>
<!-- URL -->
<div class="mb-3">
<label for="url" class="form-label">Request URL</label>
<input type="text" id="url" class="form-control" value="http://192.168.3.205/automation/b58f89c230c11a7fe242cd8665bc086e/index.php/Crud/DETAIL_PREUPD" placeholder="Enter URL">
</div>
<!-- Date -->
<div class="mb-3">
<label class="form-label">Select Date</label>
<input type="date" id="date" class="form-control">
</div>
<!-- Time Slab -->
<div class="mb-3">
<label class="form-label">Select Class Time</label>
<select id="time_slab" class="form-select">
<option value="">-- Select --</option>
<option>08:30am 09:30am</option>
<option>09:35am 10:35am</option>
<option>10:40am 11:40am</option>
<option>11:45am 12:45pm</option>
<option>01:10pm 02:10pm</option>
<option>02:15pm 03:15pm</option>
<option>03:20pm 04:20pm</option>
<option>04:25pm 05:25pm</option>
</select>
</div>
<!-- Headers -->
<div class="mb-3">
<label class="form-label">Headers (one per line: key:value)</label>
<textarea id="headers" class="form-control"
rows="4">
Content-Type: application/x-www-form-urlencoded
Cookie: ci_session=1b2c3d4e5f6g7h8i9j0k
</textarea>
</div>
<!-- Body -->
<div class="mb-3">
<label class="form-label">Request Body (x-www-form-urlencoded)</label>
<textarea id="body" class="form-control"
rows="5">
Pre_btnSubmit=Present&studentidno=252&lsem=252&slab=&table=CSC%20000_A_DAY
</textarea>
</div>
<!-- Send Button -->
<button id="sendBtn" class="btn btn-primary w-100 mb-3">Send Request</button>
<!-- Response -->
<div>
<label class="form-label">Response</label>
<pre id="response" class="bg-dark text-light p-3 rounded"
style="max-height: 400px; overflow-y: auto;"></pre>
</div>
</div>
</div>
<script>
// Autofill today’s date
document.getElementById("date").value = new Date().toISOString().split("T")[0];
document.getElementById("sendBtn").addEventListener("click", async () => {
const url = document.getElementById("url").value;
const date = document.getElementById("date").value;
const time_slab = document.getElementById("time_slab").value;
const responseBox = document.getElementById("response");
responseBox.textContent = "Loading...";
try {
// Process headers
const headers = {};
document.getElementById("headers").value.split("\n").forEach(line => {
const [key, ...rest] = line.split(":");
if (key && rest.length) headers[key.trim()] = rest.join(":").trim();
});
// Process body
let bodyStr = document.getElementById("body").value.trim();
if (bodyStr.length > 0 && !bodyStr.endsWith("&")) bodyStr += "&";
// Add date & time_slab
bodyStr += `date=${encodeURIComponent(date)}&time_slab=${encodeURIComponent(time_slab)}`;
const options = {
method: "POST",
headers,
body: bodyStr
};
const res = await fetch(url, options);
const text = await res.text();
try {
responseBox.textContent = JSON.stringify(JSON.parse(text), null, 2);
} catch {
responseBox.textContent = text;
}
} catch (err) {
responseBox.textContent = "Error: " + err.message;
}
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment