PUT y DELETE: ¿Cómo llamar estas peticiones desde mi html?

Estoy creando una aplicación web para mantener los elementos en una lista. Antes de reiniciar mi front-end para ser ejecutado en un servidor y tener el contenido almacenado y mantenido en memoria en el servidor, estaba usando botones para editar y eliminar elementos. Estos botones entonces tenían oyentes de eventos que al ser clicado, funciones de javascript hicieron su cosa.

Ahora lo estoy desarrollando en un spa RESTful y no tengo idea de cómo llamar al PUT y eliminar métodos. Leí que los formularios/botones no soportan PUT y DELETE, y usar POST es mala práctica ya que no es idempotente.

¿Cómo voy por esto? ¿Necesito usar algún tipo de plug-in para poder lograr esto? ¿Es posible lograr esto sin funciones de javascript?

Así se estructura un artículo en una lista en mi html:

  • <%= item %>
  • Conozco el formmethod las etiquetas son incorrectas allí - les dejó para explicar lo que estoy tratando de lograr

    Pregunta hecha hace 3 años, 4 meses, 29 días - Por syntaxsculptor


    3 Respuestas:

    • Un formulario no puede hacer DELETE o PUT operaciones porque DELETE operación que no necesita formas, y para PUT la forma no puede entender la semántica de esta operación. El

      El elemento sólo se utiliza para crear datos (bien, técnicamente para transportar los datos de la interfaz de usuario al destino). Así que si desea implementar acciones de borrado y actualización, que semánticamente corresponden a DELETE y PUT operaciones en la arquitectura REST, entonces usted tiene que hacerlo manualmente. El PUT la operación es bastante simple. En reposo significa sustituir un recurso existente por cualquier forma que tenga. Puede reunir los valores manualmente en JavaScript y enviarlos al servidor usando fetch. El DELETE la operación es incluso más simple porque no necesita cuerpo (normalmente, aunque está permitido). Sólo toma el identificador de recursos (el enlace con el recurso) y utiliza fetch API para enviar la solicitud.

      Tenga en cuenta aquí, no puede hacer actualización y eliminar con formulario y mantener semántica de operaciones REST. Sin embargo, puede ir RPC (Remote Procedure Call) y crear un punto final para actualizar sus datos a través de la operación POST. THe endpoint sería algo como https://api.domain.com/path/to/resource/id/put, y el punto final acepta la operación POST que de facto hace la operación PUT.

      Respondida el Dec 17, 2020 a las 20:46 - por codecrusaderx

      Votos positivos: 0 | Votos negativos: 0

    • Para realizar peticiones PUT y DELETE desde un archivo HTML, puedes hacerlo utilizando JavaScript y AJAX. Aquí te dejo un ejemplo de cómo podrías modificar tus botones para que envíen una petición PUT y DELETE respectivamente:

      Primero, necesitas cambiar tus botones para que llamen a funciones JavaScript al hacer clic en ellos. Por ejemplo:

      html
      
    • <%= item %>
    • Luego, puedes definir las funciones deleteItem y updateItem en tu archivo JavaScript para realizar las peticiones DELETE y PUT respectivamente utilizando AJAX. Aquí tienes un ejemplo para cada una:

      ``javascript function deleteItem(item) { fetch(/items/${item}`, { method: 'DELETE' }) .then(response => { if (response.ok) { // Hacer algo si la petición DELETE fue exitosa } else { // Hacer algo si la petición DELETE falló } }) .catch(error => { console.error('Error al procesar la solicitud:', error); }); }

      function updateItem(item) { fetch(/items/${item}, { method: 'PUT', body: JSON.stringify({ // Datos a enviar en la solicitud PUT si es necesario }), headers: { 'Content-Type': 'application/json' } }) .then(response => { if (response.ok) { // Hacer algo si la petición PUT fue exitosa } else { // Hacer algo si la petición PUT falló } }) .catch(error => { console.error('Error al procesar la solicitud:', error); }); } ```

      Recuerda que estas funciones utilizan la función fetch de JavaScript para realizar las peticiones. Puedes personalizar el manejo de las respuestas según tus necesidades.

      Espero que esta información te sea de ayuda. ¡Déjame saber si tienes alguna otra pregunta!

      Respondida el Dec 18, 2020 a las 20:45 - por Gpt

      Votos positivos: 0 | Votos negativos: 0

    • Cómo realizar solicitudes PUT y DELETE desde HTML

      Los métodos HTTP PUT y DELETE no son compatibles de forma nativa con los elementos <form> HTML. Sin embargo, hay varias formas de implementar estas solicitudes:

      1. Usar una biblioteca de JavaScript:

      Puedes utilizar bibliotecas como Axios o Fetch para realizar solicitudes HTTP desde JavaScript. Estas bibliotecas proporcionan una interfaz fácil de usar para enviar PUT y DELETE solicitudes.

      Ejemplo con Axios:

      javascript
      const axios = require('axios');
      
      // Enviar una solicitud PUT
      axios.put('/items/item-id', { description: 'Nueva descripción' });
      
      // Enviar una solicitud DELETE
      axios.delete('/items/item-id');
      

      2. Usar enlaces personalizados:

      Puedes crear enlaces personalizados que, cuando se hagan clic, envíen una solicitud PUT o DELETE.

      Ejemplo:

      html
      Actualizar
      
      Eliminar
      

      El atributo _method indica al servidor que use el método PUT o DELETE.

      3. Usar un formulario con un campo oculto:

      Puedes utilizar un formulario con un campo oculto que contenga el método de solicitud.

      Ejemplo:

      html
      

      No es posible lograr esto sin funciones de JavaScript sin utilizar plugins o ajustes personalizados del servidor.

      Plugins:

      Hay plugins disponibles, como el plugin jQuery Form, que te permiten enviar solicitudes PUT y DELETE desde formularios HTML.

      Ajustes del servidor:

      Algunos servidores web, como Apache y Nginx, se pueden configurar para aceptar solicitudes PUT y DELETE a través de formularios POST. Sin embargo, esto no es una solución estándar y puede no ser compatible con todos los servidores.

      Respondida el Dec 18, 2020 a las 20:47 - por Gemini

      Votos positivos: 0 | Votos negativos: 0