duprez / delonetServer

1 stars 0 forks source link

Llamada a API se efectúa por doble #6

Closed duprez closed 6 years ago

duprez commented 6 years ago

Las llamadas a la API cuando se hace un POST, DELETE o PUT se envian 2 veces y una se queda en espera...

image

JuanMME commented 6 years ago

Mira esto: https://github.com/angular/universal/issues/845

You can prevent multiple http requests by transfering your state from the server to client with the use of TransferState and TransferHttpCache with v5 https://github.com/angular/universal/tree/master/modules/common#transferhttpcachemodule

No tengo claro donde debe instalarse, creo que es en el servidor pero no estoy seguro.

duprez commented 6 years ago

Parece que cuando haces un servidor en localhost y también tu aplicación en localhost, cuando tu front hace una petición a back y ese back intenta servir la información puede que haya conflicto por crossdomain, y entonces al intentar servir la información hace dos peticiones, la primera que digamos que es fake, como para "probar" (rafa me explico que probaba exactamente, no recuerdo si era algun tipo de peticiones que jodían algo o algo asi, ni idea XD), y la segunda que es la verdadera y sirve los datos.

Crossdomain: Requesting content from another host, than where the website is hosted. For example site hosted at google loads a facebook icon from facebook domain.

Creo que es cosa de que el navegador detecta que la petición se hace desde local y entonces pasa todo eso, podemos hacer un arreglo para que eso no pase, rafa me lo va a comentar cuando tenga un rato.

Respecto a lo que has comentado, diría que se instala en Angular ya que tiene toda su estructura igual, en servidor no vi nunca esa estructura, de hecho si te fijas tenemos poquísimos archivos, lo justo para que funcione, nada de modulos ni nada, asi que si, diria que es angular. Pero nunca ví eso en los archivos que toco, no me suena de nada, y tiene pinta de ser un módulo implementado por alguien, seguramente funcione, pero voy a ver si rafa me hecha una mano para arreglarlo en el servidor y asi nos ahorramos implementar eso en los proyectos de ionic y angular, es mejor ¿no?

duprez commented 6 years ago

La segunda petición pasa de estado provisional a estado 204 si incluimos el siguiente código a la hora de devolver datos

res.json(data);

duprez commented 6 years ago

Probar https://stackoverflow.com/questions/7067966/how-to-allow-cors, pero cambiar lo de app.options por un tipo que no permita el de method.options, dependerá de la cabecera con la que se envíe

const cors = require('cors');
const express = require('express');
let app = express();
app.use(cors());
app.options('*', cors());

Luego otro dice algo de ionic más abajo


// CORS (Cross-Origin Resource Sharing) headers to support Cross-site HTTP requests

app.all('*', function(req, res, next) {
       res.header("Access-Control-Allow-Origin", "*");
       res.header("Access-Control-Allow-Headers", "X-Requested-With");
       res.header('Access-Control-Allow-Headers', 'Content-Type');
       next();
});
duprez commented 6 years ago

Quitar módulo de cors e incluir estas líneas:

app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
});
duprez commented 6 years ago

Todo funciona correctamente y se eliminará la doble llamada cuando se suba al server