reason: connect ECONNREFUSED 127.0.0.1:8000 nuxt apollo

[HDxXxHD]

NuxtServerError Network error: request to http://localhost:8000/graphql failed, reason: connect ECONNREFUSED 127.0.0.1:8000

index.vue

import gql from 'graphql-tag'

export default {
  data() {
    return {
      allUser: [],
    }
  },


  async asyncData({app}) {
    const client = app.apolloProvider.defaultClient
    const allUser = await client.query({
      query: gql`query GetAllUser{
          allUser{
            data{
              id
              username
            }
          }
        }`,
    })
    return allUser;
    
  },
  
}

nuxt.config.js

modules: [
    '@nuxtjs/pwa',
    '@nuxtjs/apollo'
   
  ],
  apollo: {
    clientConfigs: {
      default: {
        httpEndpoint: "http://localhost:8000/graphql",
        browserHttpEndpoint: "/graphql",
      },
    },
  },

errors: NuxtServerError Network error: request to http://localhost:8000/graphql failed, reason: connect ECONNREFUSED 127.0.0.1:8000

How can I fix this feature?

@chriscalo

[chriscalo]

Are you running the GraphQL server and your UI server together on port 8000? That's what this approach of using both httpEndpoint and browserHttpEndpoint assumes.

For example, in a project I use nuxt.render to run Nuxt and my GraphQL API in the same Express app / server. It looks something like this:

const express = require("express");
const middleware = require("./middleware");
const graphqlServer = require("./graphql");
const nuxtServer = require("./nuxt");

const app = express();

app.use(middleware);
app.use("/graphql", graphqlServer);
app.use(nuxtServer);

app.listen(process.env.PORT);

In my nuxt.js server file I use nuxt.render. Note that it's using Nuxt version 2.11.0, which seems to have an older API than what's in the docs today.

const { Nuxt, Builder } = require("nuxt");
const express = require("express");
const config = require("../nuxt.config.js");

const nuxt = new Nuxt(config);

// hot-reloading in dev
if (config.dev) {
  console.log("Development mode detected, building Nuxt…");
  new Builder(nuxt).build();
}

const nuxtServer = express();
nuxtServer.use(nuxt.render);
module.exports = nuxtServer;

And the graphql.js server looks something like this:

const express = require("express");
const { ApolloServer, gql } = require("apollo-server-express");

const graphqlServer = express();
module.exports = graphqlServer;

const apolloServer = new ApolloServer({
  modules: [
    // define your modules here
  ],
  context: ({ req, res }) => ({ req, res }),
});

apolloServer.applyMiddleware({
  app: graphqlServer,
  path: "/",
});

[madhupk16]

I am getting below Error while starting Apollo server, Any idea ?

[nodemon] Throwing Error while starting server [nodemon] FetchError: request to http://localhost:5003/graphql failed, reason: connect ECONNREFUSED 127.0.0.1:5003[nodemon] at ClientRequest. (C:\workspace<>\dist\server.js:122958:11) [nodemon] at ClientRequest.emit (events.js:315:20) [nodemon] at Socket.socketErrorListener (_http_client.js:469:9) [nodemon] at Socket.emit (events.js:315:20) [nodemon] at emitErrorNT (internal/streams/destroy.js:106:8) [nodemon] at emitErrorCloseNT (internal/streams/destroy.js:74:3) [nodemon] at processTicksAndRejections (internal/process/task_queues.js:80:21) { [nodemon] type: 'system', [nodemon] errno: 'ECONNREFUSED', [nodemon] code: 'ECONNREFUSED' [nodemon] } [nodemon] request to http://localhost:5003/graphql failed, reason: connect ECONNREFUSED 127.0.0.1:5003 [nodemon] (node:5752) UnhandledPromiseRejectionWarning: Error: Cannot use GraphQLSchema "[object GraphQLSchema]" from another module or realm.

[jovylle]

also having same issue. but the problem can't change the port it keep using the first port setuped.