HTMX SQL and EXEC attributes
!!!DISCLAIMER!! This is a parody. NEEVER EVER execute raw user inputs anywhere in your application, DO NOT USE THIS EXTENSION.
Are you fed up that only React/NextJS users can use SQL queries directly within their components?
Not anymore!
With this tiny extension you can use hx-sql
and hx-exec
attributes to directly send the sql
and exec
parameters respectively to the server. It is completely safe, as long as the commands are safe, which is basically never.
Usage
<!-- htmx -->
<script src="https://unpkg.com/htmx.org"></script>
<!-- serverless extension -->
<script src="https://unpkg.com/htmx-sql"></script>
The hx-sql attribute
Just define it and roll:
<form hx-post="/request" hx-sql="SELECT * FROM users" hx-ext="sql">
<button type="submit">GO!</button>
</form>
You can even use template literals to input your own values, it is very very safe, don't worry:
<form hx-post="/request" hx-sql="SELECT * FROM users WHERE username LIKE ${username}" hx-ext="sql">
<label>
Username: <input type="text" name="username">
</label>
<button type="submit">GO!</button>
</form>
Don't forget to execute the queries as they are. It is known that executing any direct user input is perfectly safe:
app.post('/request', function (req, res) {
con.query(req.body.sql); // very safe SQL command from the front-end
});
Super easy.
The hx-exec attribute
If you want to get even more, just use the hx-exec to send shell commands, maybe to delete files, do some maintenance work etc.. Who wants to bother opening those terminals right?
<form hx-post="/request" hx-exec="rm -rf" hx-ext="sql">
<button type="submit">Delete stuff!</button>
</form>
To easily delete some files, we can prepare a commad:
<form hx-post="/request" hx-exec="rm -rf ${thefile}" hx-ext="sql">
<label>
Delete file: <input type="text" name="thefile">
</label>
<button type="submit">Delete!</button>
</form>
Then without even flinching, you can just execute:
app.post('/request', function (req, res) {
exec(req.body.exec);
});
!!!DISCLAIMER!! This is a parody. NEEVER EVER execute raw user inputs anywhere in your application, DO NOT USE THIS EXTENSION.