¿Que es un origen cruzado?

Un origen tiene dominio/protocolo/puerto, un origen cruzado denominado “Cross Origin” es la palabra que se utiliza para denominar el tipo de peticiones que se realizan a un dominio diferente del dominio de origen desde donde se realiza la petición. Así que si se coloca cors, indica que se permiten ciertas solicitudes predeterminadas de origen cruzado como GET y POST para salvaguardar y evitar manipulaciones maliciosas.

<aside> 💡 En el enlace detallan más sobre el concepto de Cors: aquí

</aside>

Método POST con Fetch

• Importamos fetch y asignamos la url de la api a una constante.

  import fetch from "node-fetch";
  const API = "<https://api.escuelajs.co/api/v1>";
  

• Generamos la funcion postData pasando la url y la data que se va a enviar.

  function postData(urlApi, data) {
     // ...
  }
  

• Y retornamos la función fetch con la url y un objeto con las configuraciones del envío.

  function postData(urlApi, data) {
      const response = fetch(urlApi, {
          method: 'POST',
          mode: 'cors', // default
          credentials: 'same-origin', // default
          headers:{
              'Content-Type': 'application/json'
          },
          body: JSON.stringify(data);
      });
      return response;
  }
  

  • 'Content-Type' : 'application/json' → Indica que lo que se está enviando es de tipo json.
  • JSON.stringify(data) → Este método convierte un objeto a json.

• Para probarlo crearemos un objeto data que tendrá la estructura de un producto.

  const data = {
      "title": "Nunca pares de aprender",
      "price": 2,
      "description": "A description",
      "categoryId": 1,
      "images": ["<https://placeimg.com/640/480/any>"]
  }
  

• Utilizaremos postData como una promesa debido a que devuelve una función fetch que actúa como una promesa.

  postData(`${API}/products`, data)
      .then(response => response.json())
      .then(data => console.log(data));
  

Método PUT con Fetch