Add nodejs-file-upload sample #259
Conversation
lionello
temporarily deployed
to
deploy-changed-samples
GitHub Actions
Inactive
![github-advanced-security[bot]](https://avatars.githubusercontent.com/in/57789?s=60&v=4){kind=small}
| app.get('/', (req, res) => { | ||
| fs.readdir('uploads', (err, files) => { | ||
| if (err) { | ||
| return res.status(500).send('Unable to scan files!'); | ||
| } | ||
| let fileList = files.map(file => `<li><a href="/${file}">${file}</a></li>`).join(''); | ||
| res.send(` | ||
| <h1>File Upload</h1> | ||
| <form ref='uploadForm' | ||
| id='uploadForm' | ||
| action='/' | ||
| method='post' | ||
| encType="multipart/form-data"> | ||
| <input type="file" name="file" /> | ||
| <input type='submit' value='Upload!' /> | ||
| </form> | ||
| <h2>Uploaded Files</h2> | ||
| <ul>${fileList}</ul> | ||
| `); | ||
| }); | ||
| }); |
Check failure
Code scanning / CodeQL
Missing rate limiting High
Show autofix suggestion
Hide autofix suggestion
Copilot Autofix AI about 2 months ago
To fix the problem, we need to introduce rate limiting to the Express application. The best way to do this is by using the express-rate-limit package, which allows us to set a maximum number of requests that can be made to the server within a specified time window. This will help prevent denial-of-service attacks by limiting the rate at which requests are accepted.
We will:
- Install the
express-rate-limitpackage. - Import the
express-rate-limitpackage in the code. - Set up a rate limiter with appropriate configuration.
- Apply the rate limiter to all routes in the application.
| @@ -4,2 +4,3 @@ | ||
| const path = require('path'); | ||
| const RateLimit = require('express-rate-limit'); | ||
|
|
||
| @@ -8,2 +9,8 @@ | ||
|
|
||
| const limiter = RateLimit({ | ||
| windowMs: 15 * 60 * 1000, // 15 minutes | ||
| max: 100, // max 100 requests per windowMs | ||
| }); | ||
|
|
||
| app.use(limiter); | ||
| app.use(express.static('uploads')); |
| @@ -10,3 +10,4 @@ | ||
| "express": "^4.17.1", | ||
| "multer": "^1.4.4" | ||
| "multer": "^1.4.4", | ||
| "express-rate-limit": "^7.4.1" | ||
| } |
| Package | Version | Security advisories |
| express-rate-limit (npm) | 7.4.1 | None |
| res.send(` | ||
| <h1>File Upload</h1> | ||
| <form ref='uploadForm' | ||
| id='uploadForm' | ||
| action='/' | ||
| method='post' | ||
| encType="multipart/form-data"> | ||
| <input type="file" name="file" /> | ||
| <input type='submit' value='Upload!' /> | ||
| </form> | ||
| <h2>Uploaded Files</h2> | ||
| <ul>${fileList}</ul> | ||
| `); |
Check failure
Code scanning / CodeQL
Stored cross-site scripting High
Show autofix suggestion
Hide autofix suggestion
Copilot Autofix AI about 2 months ago
To fix the stored cross-site scripting vulnerability, we need to sanitize the filenames before using them to generate HTML content. The best way to do this is to use a library like escape-html to escape any potentially dangerous characters in the filenames. This will ensure that any HTML tags or scripts in the filenames are rendered harmless.
- Install the
escape-htmllibrary. - Import the
escape-htmllibrary in themain.jsfile. - Use the
escape-htmlfunction to escape the filenames before embedding them in the HTML content.
| @@ -4,2 +4,3 @@ | ||
| const path = require('path'); | ||
| const escapeHtml = require('escape-html'); | ||
|
|
||
| @@ -15,3 +16,3 @@ | ||
| } | ||
| let fileList = files.map(file => `<li><a href="/${file}">${file}</a></li>`).join(''); | ||
| let fileList = files.map(file => `<li><a href="/${escapeHtml(file)}">${escapeHtml(file)}</a></li>`).join(''); | ||
| res.send(` |
| @@ -10,3 +10,4 @@ | ||
| "express": "^4.17.1", | ||
| "multer": "^1.4.4" | ||
| "multer": "^1.4.4", | ||
| "escape-html": "^1.0.3" | ||
| } |
| Package | Version | Security advisories |
| escape-html (npm) | 1.0.3 | None |
|
@lionello personally I think our philosophy around samples should shift to be more like Railway's: it should be about demonstrating specific technologies, rather than techniques. Or maybe it's just about tagging them... i.e. some things are "samples" some things are "demos" and some things are "templates" or something? So maybe "samples" are starting points for using technologies, "demos" demonstrate techniques (i.e. stuff you might find in a tutorial) and "templates" are full-featured starting points for a kind of app or site (blog, crm, etc.)? |
|
@raphaeltm I love those categories! Let's use those going forward. |
Okidoke. I'll add a "Type" in the readme metadata which should be one of those three. |
Samples Checklist