Bajo condiciones normales, un formulario HTML solo permite el uso de los métodos GET y POST para recuperar y enviar información, respectivamente. Sin embargo, hay casos en los que es necesario enviar otros métodos como PUT, PATCH y DELETE; por ejemplo, cuando nos estamos comunicando con una API RESTful para realizar las operaciones CRUD en recursos.

Recordemos la función de los métodos HTTP que se suelen usar en un CRUD.

  • GET: acceder al recurso (no manipula).
  • POST: manipular el recurso.
  • PUT: actualizar completamente el recurso.
  • PATCH: actualizar parcialmente el recurso.
  • DELETE: eliminar el recurso.

Las API RESTful suelen seguir las convenciones HTTP para controlar el acceso a los recursos, pero un formulario básico HTML sólo permite GET y POST. Si necesitáramos eliminar un recurso usando una API RESTful, no podríamos directamente indicar el método DELETE en nuestro formulario.

<form action="/process" method="DELETE"> <!-- ERROR -->
    ...
    <button type="submit">Send</button>
</form>

Existen tecnologías en el frontend que soportan las funciones de una API RESTful; sin embargo, para hacerlo en un formulario HTML directo, tenemos que sobreescribir el método mediante el encabezado especial X-HTTP-Method-Override.

Para hacer esto en una aplicación Nodejs/Express, podemos usar el middleware method-override.

npm i method-override

Lo incluimos en nuestro entry point.

// otros módulos

const methodOverride = require("method-override")

// otro middleware

app.use(methodOverride('_method'));

// rutas

Con methodOverride('_method') estamos diciendo a nuestra app que cuando detecte una consulta tipo /ruta/del/recurso?_method=VALUE, el valor pasado a _method será el método a sobreescribir en la petición actual.

Entonces, el formulario quedaría de la siguiente forma.

<form action="/process?_method=DELETE" method="POST">
    ...
    <button type="submit">Send</button>
</form>

Y con esto, nuestro backend procesará el formulario anterior en una ruta DELETE /process.

NOTA: es importante que el método original del formulario HTML sea POST, ya que si usamos GET, el middleware no realizará la sobreescritura.