Graphql call : Network error - failed to fetch for long tasks only

Question

I am firing a query using on the react front-end which in turn triggers a long task on the server. The task is triggered again on the server (no fire visible on the network tab on front-end) and after some time the front-end throws a network error - failed to fetch.

All short task queries/mutations work just fine. I tried useLazyQuery, refetch from useQuery and creating a custom useLazyQuery as well. Same result for all as well as from the graphql playground.

I'm using apollo-server-express and the timeout set is 1200s. Following is my server.js

import express from "express";
import { ApolloServer } from "apollo-server-express";
import mongoose from "mongoose";
import fs from "fs";
import { resolvers } from "./graphql/resolvers/resolvers.js";
import { typeDefs } from "./GraphQL/typeDefs";
const cors = require("cors");

const startServer = async () => {
  console.log("[Server] Creating Express Server");
  var dir = "src/graphql/resolvers/audiofiles";

  if (!fs.existsSync(dir)) {
    console.log("[Server] Creating directory ", dir);
    fs.mkdirSync(dir);
  }
  const app = express();
  app.use(cors());
  console.log("[Server] Creating ApolloServer");
  const apollo = new ApolloServer({
    typeDefs,
    resolvers
  });

  apollo.applyMiddleware({ app });

  console.log("[Server] Connecting to MongoDB");
  await mongoose
    .connect("mongodb://localhost:27017/database",
      {
        useNewUrlParser: true
      }
    )
    .then(
      app.listen(
        {
          port: 4000,
          origin: {
            requestTimeout: "1200s"
          }
        },
        () =>
          console.log(`Server ready at http://****:4000${apollo.graphqlPath}`)
      )
    )
    .catch((err) => console.log(err));
};

startServer();

This is not a cors issue as it works for other queries but and for long tasks, fails after some time. My front-end apollo-client has a fetch policy "no-cache" and I don't see a second call in the network tab. I think there would've been a third one if the front-end didn't get a network error. I'm sure this has got something to do with the front-end.

I want to understand whether this is a front-end problem or a server side problem. What is a good way to diagnose the problem?

@xadm I tested the query from postman. It is not triggered again in this case — Siddhant Parekh, Oct 04 '21 at 05:41
read https://stackoverflow.com/a/62470009/6124657 and other comments from this thread ... you shouldn't use 'long tasks' with long timeouts ... use some queue on BE, run task using mutation, test if it is ready using query (polling) or subscriptions (sockets) — xadm, Oct 04 '21 at 06:30
We are already polling for tasks which we plan on storing. This is for a try out like app where we don't want to store it. Thanks for the advice though! — Siddhant Parekh, Oct 04 '21 at 09:14
store them temporary (redis)? forcing long tasks is not a good idea or good practice — xadm, Oct 04 '21 at 11:48
Yeah, I created a new collection for temporary tasks altogether as the final solution. Thanks a lot @xadm — Siddhant Parekh, Oct 06 '21 at 10:16

Graphql call : Network error - failed to fetch for long tasks only

0 Answers0