1

Soy nuevo en spring boot y angular y estoy tratando de actualizar un dato pero el problema está en el frontend con el angular porque ya hice la peticion con Postman y funciona correctamente pero cuando hago la solicitud con el angular no funciona. en angular estaba tratando de quemar los datos y enviarlos pero tampoco funcionó para mí. "Tengo más métodos que funcionan desde el angular pero los elimino porque no es necesario mostrarlos"


back end


Esto es @RestController

@PutMapping(value = "update/{cantidad}/{idProductos}")
    private void agregarCantidad(@PathVariable("cantidad") int cantidad, @PathVariable Long idProductos){
        try {
            
             productosService.updateCantidad(cantidad,idProductos);
        }catch(Exception e) {

            System.out.println(e);
        }
        
    }

la interface

public interface ProductosRepository extends JpaRepository<Productos, Long>{

    @Transactional
    @Modifying
    @Query("UPDATE Productos p set p.cantidad = ?1 where p.idProductos = ?2")
    void updateCantidad(Integer entrada,Long id) throws SQLException;
}

the @Service


    @Override
    public void updateCantidad(Integer entrada,Long idProductos) {
        List<Productos> productos = productosRepository.findAll();
        Integer resultado;
        try {
            for (Productos pro : productos) {
                if (entrada > 0) {
                    resultado = entrada + pro.getCantidad();
                    productosRepository.updateCantidad(resultado,idProductos);
                } else {
                    System.out.println("la cantidad no es valida");
                }
            }
        } catch (Exception e) {
            System.out.println(e);
        }

    }
  1. Front end
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { HttpClient } from '@angular/common/http'; 

@Injectable({
  providedIn: 'root'
})
export class ProductosService {

  private API_SERVER = "http://localhost:8881/producto/";

  constructor(private httpClient: HttpClient) { }


  public addCantidad(cantidad:any,id:any): Observable<any>{
    return this.httpClient.put(this.API_SERVER+"update/",cantidad+"/"+id);
  }
  
}
import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute, ParamMap } from '@angular/router';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { ProductosService } from '../services/productos/productos.service';
import { MarcaService } from '../services/marca/marca.service';
import { CategoriasService } from '../services/categorias/categorias.service';
import { ValueTransformer } from '@angular/compiler/src/util';

@Component({
  selector: 'app-productos-listar [disableControl]',
  templateUrl: './productos-listar.component.html',
  styleUrls: ['./productos-listar.component.css']
})
export class ProductosListarComponent implements OnInit {


  productos: any;
  productosEditForm1!:FormGroup;


 

  constructor(
    private route: ActivatedRoute,
    public productosService: ProductosService,
    public fb: FormBuilder,
    
    
  ) { }

  ngOnInit(): void {

    this.productosEditForm1= this.fb.group({
      idProductos: [''],
      nombre:  [''],
      cantidad: [''],
      precio: [''], 
    })

    this.route.queryParams.subscribe(params => {
      this.name = params['name'];
      
    });

    
  }

  tetsEnviar(){
    let id = 1;
    let cantidad = 5;
    this.productosService.addProductos(cantidad,id).subscribe(resp =>{
      console.log(resp)
    })
  }
}

HTML

<form>
<div class="form-row">
                
</div>
<button  type="submit"  class="btn btn-primary" (click)=" tetsEnviar()" >Agregar</button>
</form>

la peticion con Postman es correcta y hace la actualización de la base de datos

[2m2021-01-16 14:33:12.907[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-4][0;39m [36mo.s.web.servlet.DispatcherServlet       [0;39m [2m:[0;39m PUT "/producto/update/5/1", parameters={}
[2m2021-01-16 14:33:12.910[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-4][0;39m [36ms.w.s.m.m.a.RequestMappingHandlerMapping[0;39m [2m:[0;39m Mapped to com.millisecondsoftware.ventas.rest.ProductosRest#agregarCantidad(int, Long)
[2m2021-01-16 14:33:12.987[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-4][0;39m [36morg.hibernate.SQL                       [0;39m [2m:[0;39m select productos0_.idProductos as idproduc1_4_, productos0_.cantidad as cantidad2_4_, productos0_.categoria_idcategoria as categori6_4_, productos0_.fechaVencimiento as fechaven3_4_, productos0_.marca_idmarca as marca_id7_4_, productos0_.nombre as nombre4_4_, productos0_.operador_idoperador as operador8_4_, productos0_.precio as precio5_4_ from productos productos0_
Hibernate: select productos0_.idProductos as idproduc1_4_, productos0_.cantidad as cantidad2_4_, productos0_.categoria_idcategoria as categori6_4_, productos0_.fechaVencimiento as fechaven3_4_, productos0_.marca_idmarca as marca_id7_4_, productos0_.nombre as nombre4_4_, productos0_.operador_idoperador as operador8_4_, productos0_.precio as precio5_4_ from productos productos0_
[2m2021-01-16 14:33:12.990[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-4][0;39m [36morg.hibernate.SQL                       [0;39m [2m:[0;39m select categorias0_.idcategoria as idcatego1_1_0_, categorias0_.nombre as nombre2_1_0_ from categoria categorias0_ where categorias0_.idcategoria=?
Hibernate: select categorias0_.idcategoria as idcatego1_1_0_, categorias0_.nombre as nombre2_1_0_ from categoria categorias0_ where categorias0_.idcategoria=?
[2m2021-01-16 14:33:12.992[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-4][0;39m [36morg.hibernate.SQL                       [0;39m [2m:[0;39m select marca0_.idmarca as idmarca1_2_0_, marca0_.nombre as nombre2_2_0_ from marca marca0_ where marca0_.idmarca=?
Hibernate: select marca0_.idmarca as idmarca1_2_0_, marca0_.nombre as nombre2_2_0_ from marca marca0_ where marca0_.idmarca=?
[2m2021-01-16 14:33:12.994[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-4][0;39m [36morg.hibernate.SQL                       [0;39m [2m:[0;39m select operador0_.idoperador as idoperad1_3_0_, operador0_.cargo as cargo2_3_0_, operador0_.usuario_idusuario as usuario_3_3_0_, usuario1_.idusuario as idusuari1_6_1_, usuario1_.apellido as apellido2_6_1_, usuario1_.correo as correo3_6_1_, usuario1_.direccion as direccio4_6_1_, usuario1_.fechaNacimiento as fechanac5_6_1_, usuario1_.nombre as nombre6_6_1_, usuario1_.rol_idrol as rol_idro7_6_1_, rol2_.idrol as idrol1_5_2_, rol2_.nombre as nombre2_5_2_ from operador operador0_ left outer join usuario usuario1_ on operador0_.usuario_idusuario=usuario1_.idusuario left outer join rol rol2_ on usuario1_.rol_idrol=rol2_.idrol where operador0_.idoperador=?
Hibernate: select operador0_.idoperador as idoperad1_3_0_, operador0_.cargo as cargo2_3_0_, operador0_.usuario_idusuario as usuario_3_3_0_, usuario1_.idusuario as idusuari1_6_1_, usuario1_.apellido as apellido2_6_1_, usuario1_.correo as correo3_6_1_, usuario1_.direccion as direccio4_6_1_, usuario1_.fechaNacimiento as fechanac5_6_1_, usuario1_.nombre as nombre6_6_1_, usuario1_.rol_idrol as rol_idro7_6_1_, rol2_.idrol as idrol1_5_2_, rol2_.nombre as nombre2_5_2_ from operador operador0_ left outer join usuario usuario1_ on operador0_.usuario_idusuario=usuario1_.idusuario left outer join rol rol2_ on usuario1_.rol_idrol=rol2_.idrol where operador0_.idoperador=?
[2m2021-01-16 14:33:13.107[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-4][0;39m [36morg.hibernate.SQL                       [0;39m [2m:[0;39m update productos set cantidad=? where idProductos=?
Hibernate: update productos set cantidad=? where idProductos=?
[2m2021-01-16 14:33:13.128[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-4][0;39m [36mm.m.a.RequestResponseBodyMethodProcessor[0;39m [2m:[0;39m Using 'application/json', given [*/*] and supported [application/json, application/*+json, application/json, application/*+json]
[2m2021-01-16 14:33:13.128[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-4][0;39m [36mm.m.a.RequestResponseBodyMethodProcessor[0;39m [2m:[0;39m Nothing to write: null body
[2m2021-01-16 14:33:13.129[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-4][0;39m [36mo.s.web.servlet.DispatcherServlet       [0;39m [2m:[0;39m Completed 200 OK

Peticion con angular y este es el error

[2m2021-01-16 14:35:37.480[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-6][0;39m [36mo.s.web.servlet.DispatcherServlet       [0;39m [2m:[0;39m OPTIONS "/producto/update/", parameters={}
[2m2021-01-16 14:35:37.481[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-6][0;39m [36mo.s.w.s.handler.SimpleUrlHandlerMapping [0;39m [2m:[0;39m Mapped to ResourceHttpRequestHandler ["classpath:/META-INF/resources/", "classpath:/resources/", "classpath:/static/", "classpath:/public/", "/"]
[2m2021-01-16 14:35:37.483[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-6][0;39m [36mo.s.web.servlet.DispatcherServlet       [0;39m [2m:[0;39m Completed 200 OK
[2m2021-01-16 14:35:37.488[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-7][0;39m [36mo.s.web.servlet.DispatcherServlet       [0;39m [2m:[0;39m PUT "/producto/update/", parameters={}
[2m2021-01-16 14:35:37.490[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-7][0;39m [36mo.s.w.s.handler.SimpleUrlHandlerMapping [0;39m [2m:[0;39m Mapped to ResourceHttpRequestHandler ["classpath:/META-INF/resources/", "classpath:/resources/", "classpath:/static/", "classpath:/public/", "/"]
[2m2021-01-16 14:35:37.496[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-7][0;39m [36mo.s.w.s.r.ResourceHttpRequestHandler    [0;39m [2m:[0;39m Resource not found
[2m2021-01-16 14:35:37.497[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-7][0;39m [36mo.s.web.servlet.DispatcherServlet       [0;39m [2m:[0;39m Completed 404 NOT_FOUND
[2m2021-01-16 14:35:37.497[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-7][0;39m [36mo.s.web.servlet.DispatcherServlet       [0;39m [2m:[0;39m "ERROR" dispatch for PUT "/error", parameters={}
[2m2021-01-16 14:35:37.498[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-7][0;39m [36ms.w.s.m.m.a.RequestMappingHandlerMapping[0;39m [2m:[0;39m Mapped to org.springframework.boot.autoconfigure.web.servlet.error.BasicErrorController#error(HttpServletRequest)
[2m2021-01-16 14:35:37.499[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-7][0;39m [36mo.s.w.s.m.m.a.HttpEntityMethodProcessor [0;39m [2m:[0;39m Using 'application/json', given [application/json, text/plain, */*] and supported [application/json, application/*+json, application/json, application/*+json]
[2m2021-01-16 14:35:37.500[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-7][0;39m [36mo.s.w.s.m.m.a.HttpEntityMethodProcessor [0;39m [2m:[0;39m Writing [{timestamp=Sat Jan 16 14:35:37 EST 2021, status=404, error=Not Found, message=, path=/producto/updat (truncated)...]
[2m2021-01-16 14:35:37.501[0;39m [32mDEBUG[0;39m [35m16976[0;39m [2m---[0;39m [2m[nio-8881-exec-7][0;39m [36mo.s.web.servlet.DispatcherServlet       [0;39m [2m:[0;39m Exiting from "ERROR" dispatch, status 404

XHR console

General:
Request URL: http://localhost:8881/producto/update/
Request Method: PUT
Status Code: 404 
Remote Address: [::1]:8881
Referrer Policy: strict-origin-when-cross-origin

Request Payload
5/1
4
  • El error está aquí: (this.API_SERVER+"update/",cantidad+"/"+id); en lugar una coma , debe ir un signo más +
    – Lobos
    Commented el 16 ene. 2021 a las 22:42
  • @Lobos ya habia probado hacer eso pero resivo un error An argument for body was not provided
    – alexis
    Commented el 17 ene. 2021 a las 1:01
  • Se debe a que put() requiere dos parámetros: la url y el body. En el parámetro body puedes pasarle un null.
    – Lobos
    Commented el 17 ene. 2021 a las 1:18
  • Mira Cómo preguntar para que tu pregunta sea mejor recibida. También, aprovecha y haz el recorrido de bienvenida para entender mejor cómo funcionamos y de paso obtener tu primera medalla! Recuerda aceptar tu respuesta...
    – gbianchi
    Commented el 17 ene. 2021 a las 16:25

1 respuesta 1

1

Lo solucione añadiendo + y ,{} al final

return this.httpClient.put(this.API_SERVER+"update/"+cantidad+"/"+id,{});

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.