Compare commits

...

3 Commits

Author SHA1 Message Date
Joe Fleming
abf8f0ef74 docs: add a readme 2021-07-23 16:07:23 -07:00
Joe Fleming
7b7eb4db7f feat: server html form 2021-07-23 16:05:33 -07:00
Joe Fleming
e0d1f50710 feat: verbose request output 2021-07-23 16:03:23 -07:00
3 changed files with 89 additions and 6 deletions

12
README.md Normal file
View File

@@ -0,0 +1,12 @@
# express-verbose-requests
Simple node [express](expressjs.com/) server that logs and returns details about requests.
Also serves up a simple HTML form when you hit `GET /form`.
## Usage
```sh
yarn
node .
```

52
public/index.html Normal file
View File

@@ -0,0 +1,52 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link
rel="stylesheet"
href="https://raw.githubusercontent.com/jgthms/minireset.css/master/minireset.min.css"
/>
<title>Request Demo</title>
</head>
<body>
<h1>Request Demo</h1>
<h2>Basic POST Form</h2>
<form id="post-form" method="POST" target="/">
<input name="field" />
<button type="submit">Submit</button>
</form>
<h2>Basic AJAX Form</h2>
<form id="ajax-form" method="POST" target="/">
<input name="field" />
<button type="submit">Submit</button>
</form>
<script>
async function submitForm(evt) {
// stop default form behavior
evt.preventDefault();
const target = evt.target;
const input = target.querySelector("input").value;
await fetch("/form", {
method: "POST",
body: JSON.stringify({ input }),
headers: {
"Content-Type": "application/json",
},
});
alert("Submitted!")
}
const form = document
.querySelector("#ajax-form")
.addEventListener("submit", submitForm, false);
</script>
</body>
</html>

View File

@@ -1,18 +1,37 @@
const express = require('express');
const cors = require('cors');
const fs = require('fs/promises');
const PORT = process.env.PORT || 8080;
const app = express();
app.use(cors());
app.use(express.urlencoded({ extended: false }));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.get('/form', async (req, res) => {
const html = await fs.readFile('public/index.html');
res.setHeader('Content-Type', 'text/html');
res.send(html);
res.end();
});
app.use(function (req, res) {
res.setHeader('Content-Type', 'text/plain');
res.write('you posted:\n');
res.end(JSON.stringify(req.body, null, 2));
const info = {
method: req.method,
url: req.url,
headers: req.headers,
body: req.body,
};
console.log(info);
res.setHeader('Content-Type', 'application/plain');
res.write(JSON.stringify(info, null, 2));
res.end();
});
app.listen(80, function () {
console.log('CORS-enabled web server listening on port 80');
app.listen(PORT, function () {
console.log(`CORS-enabled web server listening on port ${PORT}`);
});