जैसा कि मुझे पता है कि "लाने में विफल" होता है यदि कोई प्रतिक्रिया नहीं होती है (उदाहरण के लिए सर्वर डाउन है)। ऐसा इसलिए क्योंकि आपको कोई स्टेटस कोड नहीं दिखेगा। अगर मैं गलत हूं कृपया मुझे सही।

लेकिन मुझे लगता है कि ऐसी परिस्थितियों में केवल एक टेक्स्ट संदेश रखना सबसे अच्छा विचार नहीं है - कुछ ऐसा होना चाहिए जिसे अधिक आसानी से नियंत्रित किया जा सके (जैसे त्रुटि कोड)।

मैंने देखा कि क्रोम इंस्पेक्टर के नेटवर्क टैग में अनुरोध भेज रहा था और (401) में।

मुझे लगता है कि यह #218 से संबंधित है (निश्चित नहीं ..)

साथ ही यह समस्या हो रही है। networkError.status या networkError.statusCode गायब हैं और प्रतिक्रिया वस्तु गायब है। नेटवर्क परत में HTTP स्थिति कोड को संभालने का कोई तरीका नहीं है।

मुझे भी वर्तमान में यह समस्या मिली है। इसे नवीनतम रिलीज़ में तय किया गया था, लेकिन मुझे अभी भी यह समस्या आ रही है।

इस @jbaxleyiii पर कोई विचार?

मुझे यह जानकर अफ़सोस हुआ कि @akrigline और @bogdansoare को अभी भी इससे समस्या हो रही है! यह निश्चित रूप से तय किया जाना चाहिए।

मैं अभी #364 के माध्यम से काम कर रहा हूँ। इस बीच, क्या आप त्रुटि को पुन: उत्पन्न करने के लिए इस कोड सैंडबॉस को बना या संशोधित कर सकते हैं? या इससे भी बेहतर एक असफल परीक्षण के साथ पीआर खोलें?

कोई खबर?

साथ ही यह समस्या होने पर, प्रतिक्रिया ऑब्जेक्ट खाली है और नेटवर्क एरर ऑब्जेक्ट पर कोई स्थिति कोड नहीं है।

मुझे networkError संपत्ति भी नहीं मिलती है:

संपादित करें: सबसे अधिक संभावना है #475

मैंने Error प्रकार को अनदेखा करके इस समस्या को ठीक कर दिया है, लेकिन यह पूरी तरह से अस्थायी समाधान है और हमें भविष्य के सुधारों की प्रतीक्षा करनी होगी। @ इवांस

यहाँ यह समस्या है!

हमने उनके बारे में जो networkError लिखा था, वह वास्तविक सर्वर-साइड त्रुटि नहीं थी। संक्षेप में, इन मामलों में हमारे पास statusCode बिल्कुल भी नहीं होगा और वास्तव में, हमें ग्राफ़िकल सर्वर पर एक वास्तविक नेटवर्क त्रुटि बनाने या प्राप्त करने की आवश्यकता है। (_यदि आपके पास सर्वर के साथ संचार संबंधी कोई समस्या है, तो आप statusCode _ तक नहीं पहुंच सकते)।

टाइपफेस त्रुटि अभी बाकी है!

यदि आप टाइपस्क्रिप्ट का उपयोग कर रहे हैं, तो आप देख सकते हैं कि networkError में निम्न प्रकार हैं:

export interface ErrorResponse {
  graphQLErrors?: GraphQLError[];
  networkError?: Error;
  response?: ExecutionResult;
  operation: Operation;
}

और Error को इस प्रकार परिभाषित किया गया है:

interface Error {
    name: string;
    message: string;
    stack?: string;
}

हम देख सकते हैं कि statusCode यहां परिभाषित नहीं है, इसलिए हम टाइपस्क्रिप्ट में networkError.statusCode जैसा कुछ नहीं कह सकते।

मेरा अस्थायी समाधान

हमें networkError को any रूप में डालना है और हम इसे एक खाली object रूप में भी बनाते हैं।

const afterWareLink = onError(({operation, response, graphQLErrors = {}, networkError = {} as any}) => {
    const status: number = networkError && networkError.statusCode ? networkError.statusCode : null;
    debugHelper.error('apolloError', {
        operation,
        response,
        graphQLErrors,
        networkError,
        status,
    });

    // Do your job
    // if (status && HTTPExceptions[status])
    //     redirectService.redirectWithReload(`/error/${status}`);
});

उपरोक्त afterWareLink कोड के अनुसार, हमें 400 स्थिति कोड के साथ सर्वर त्रुटि का सामना करना पड़ा और अब इस स्थिति कोड तक पहुंचने में सक्षम होंगे:

यहाँ मेरी अपोलो क्लाइंट परिभाषा है:

import {ApolloLink, from} from 'apollo-link';
import {application} from '../../constants/application';
import {ApolloClient} from 'apollo-client';
import {InMemoryCache} from 'apollo-cache-inmemory';
import {HttpLink} from 'apollo-link-http';
import {tokenStorage} from '../middleware';
import {debugHelper} from '../helpers/debugHelper';
import {onError} from 'apollo-link-error';
import {apolloCache} from './apolloCache';
import fetch from 'unfetch';

const API = new HttpLink({
    uri: application.API.URL,
    fetch: fetch
});

const cache = new InMemoryCache({
    dataIdFromObject: (object: any) => apolloCache.getID(object)
});

const afterWareLink = onError(({operation, response, graphQLErrors = {}, networkError = {} as any}) => {
    const status: number = networkError && networkError.statusCode ? networkError.statusCode : null;
    debugHelper.error('apolloError', {
        operation,
        response,
        graphQLErrors,
        networkError,
        status,
    });

    // Do your job
    // if (status && HTTPExceptions[status])
    //     redirectService.redirectWithReload(`/error/${status}`);
});

const middleWareLink = new ApolloLink((operation, forward) => {
    const token = tokenStorage.get();
    operation.setContext(context => ({
        ...context,
        headers: {
            ...context.headers,
            token: token ? token.token : '',
        },
    }));

    return forward(operation);
});

export const apolloClient = new ApolloClient({
    link: from([
        middleWareLink,
        afterWareLink,
        API
    ]),
    cache: cache,
});

आशा है कि उपयोगी होगा।

यदि आप नोड सर्वर का उपयोग कर रहे हैं और संदर्भ से आपकी प्रतिक्रिया ऑब्जेक्ट तक पहुंच है तो आप इसे जोड़कर हल कर सकते हैं; अपनी प्रतिक्रिया वापस करने से पहले ctx.res.status(401); ।
अब अपोलो-लिंक-एरर्स और अपोलो-लिंक-रीट्री दोनों नेटवर्क एरर्स ऑब्जेक्ट से एरर को पिक करने में सक्षम होंगे।

यहां एक उदाहरण दिया गया है जहां मैं यह सुनिश्चित करने के लिए एक कस्टम स्कीमा निर्देश का उपयोग कर रहा हूं कि उपयोगकर्ता प्रमाणित है;

import { SchemaDirectiveVisitor } from "graphql-tools";
import { defaultFieldResolver } from "graphql";
import { createError } from "apollo-errors";

const AuthError = createError("AuthError", {
  message: "Not authorized"
});

export class IsAuthenticatedDirective extends SchemaDirectiveVisitor {
  visitObject(type) {
    this.ensureFieldsWrapped(type);
  }
  visitFieldDefinition(field, details) {
    this.ensureFieldsWrapped(details.objectType);
  }

  ensureFieldsWrapped(objectType) {
    if (objectType._authFieldsWrapped) return;
    objectType._authFieldsWrapped = true;

    const fields = objectType.getFields();
    Object.keys(fields).forEach(fieldName => {
      const field = fields[fieldName];
      const { resolve = defaultFieldResolver } = field;
      field.resolve = async function(...args) {
        const ctx = args[2];
        const result = await resolve.apply(this, args);
        if (ctx.req.user) {
          return result;
        } else {
          ctx.res.status(401);
          return null;
        }
      };
    });
  }
}

तय हुआ या नहीं? मैं अभी भी नेटवर्क एरर ऑब्जेक्ट में किसी भी स्थिति कोड तक नहीं पहुंच सकता।

@artsiompeshko
मैं इसे टाइपस्क्रिप्ट में इस तरह एक्सेस कर सकता हूं:

const networkErrorLink = onError(({networkError, operation, forward}: ErrorResponse) => {
  if (networkError) {
    switch (networkError['statusCode']) {
      case 401:
      case 422:
        if (window.location.pathname !== '/login') {
          Logger.error('Unauthorized or stale Authorization Session. Reloading page...')
          window.history.go()
        }
        break
    }
  }
  return forward(operation)
})

इस पर कोई भी समाचार? समान समस्या। मेरे जावास्क्रिप्ट कोड में कोई networkError.statusCode उपलब्ध नहीं है।

@goldenbearkin शायद हम इसे सही तरीके से इस्तेमाल कर रहे हैं?

हमें त्रुटि में नेटवर्क स्थिति कोड की अनुमति देनी चाहिए, वर्तमान में नेटवर्क स्थिति तक पहुंचने का कोई तरीका नहीं है। यह networkError वास्तव में एक HttpErrorResponse प्रकार की वस्तु है जिसमें status संपत्ति होती है जो हमेशा 0 जहां कंसोल में मूल स्थिति कोड 401 या 403 होता है

@lvlohammadi
क्या ग्राफ़QLErrors के लिए भी वही समाधान किया जा सकता है? मैं आपके वर्कअराउंड का उपयोग करते हुए नेटवर्क एरर के लिए स्थिति कोड देख सकता हूं - 504 के साथ इसका परीक्षण किया। लेकिन जब प्रमाणीकरण विफल हो जाता है, तो मुझे 401 के ग्राफ़QLError स्थिति कोड की उम्मीद है। लेकिन वर्तमान में इसे एक्सेस करने का कोई तरीका नहीं है। मैंने 'graphQLErrors = {} as any' विकल्प की कोशिश की, लेकिन कोई फायदा नहीं हुआ।

यह अजीब है, लेकिन मेरे पास वास्तव में statusCode संपत्ति है networkError । हालाँकि, इंटरफ़ेस में ऐसी कोई संपत्ति नहीं है, इसलिए TS यहाँ त्रुटि उत्पन्न करता है।

const errorLink = onError(({ networkError, graphQLErrors, response }: ErrorResponse) => {
  if (graphQLErrors) {
    graphQLErrors.map(({ message, locations, path }: GraphQLError) => {
      showError(message);
    });
  }

  // @ts-ignore
  console.log('statusCode', networkError.statusCode); // outputs 401

  if (networkError) {
    showError(networkError.message);
  }
});

सर्वर पर मैं koa और koa-passport उपयोग करता हूं, और यहां कोड का संबंधित भाग है:

app.use(mount(graphQlPath, passport.authenticate('jwt', { session: false })));

चूंकि यह मुद्दा वास्तव में पुराना है, मैं इसे बंद कर रहा हूं, लेकिन अगर आप अभी भी इसके बारे में चिंतित हैं तो बेझिझक फिर से खोलें और मैं आपसे जल्द से जल्द संपर्क करूंगा।

@JoviDeCroock अभी उस मुद्दे का सामना कर रहा है ... तो, समाधान क्या है? मैं नेटवर्क एरर से त्रुटि स्थिति कैसे प्राप्त करूं?

ठीक है, तो आप सुनिश्चित हैं कि यह एक नेटवर्क त्रुटि है (कोई ग्राफ़िकल त्रुटि नहीं है?) और स्थिति कोड/स्थिति अपरिभाषित है?

क्या यह टाइपप्रति त्रुटि है या वास्तव में अपरिभाषित है? क्या आप इसे पुन: पेश कर सकते हैं?

मेरी टिप्पणी को कम करने से बीटीडब्ल्यू इस त्रुटि को हल करने में मदद नहीं करता है, इस मुद्दे को पुन: पेश करने के लिए कभी भी कोई रास्ता नहीं था और जिस तरह से हम मदद कर सकते हैं उसे सुधारने के लिए आवश्यक मुद्दों को ट्रिम करने की आवश्यकता है।

मेरे पास एक ही समस्या है, हालांकि यह हो सकता है कि मैं सर्वर से स्थिति कैसे भेज रहा हूं। मैं मूल रूप से किसी भी ग्राफ़क्यूएल विशिष्ट हैंडलिंग को शॉर्टकट करने का प्रयास कर रहा हूं और उदाहरण के लिए, बस इसके साथ प्रतिक्रिया कर रहा हूं:
res.status(404).send("The resource you are looking for cannot be found")

हालांकि मुझे केवल TypeError: Failed To Fetch । क्या यह अपोलो-सर्वर-एक्सप्रेस में कार्यान्वयन विवरण के कारण है?

@JoviDeCroock वास्तव में, मैंने 401 या 403 के लिए क्लाइंट साइड एरर हैंडलिंग को लागू करने का प्रयास करते समय ग्राफ़कल कोड के साथ थोड़ा गड़बड़ किया। हम मिडलवेयर का उपयोग करते हैं, और मैंने जो किया वह हर अनुरोध के लिए हमेशा 401 वापस दे रहा है। इस तरह भी OPTION रिक्वेस्ट 401 हो गई, क्या नहीं होना चाहिए और शायद इसी वजह से मैं स्टेटस बिल्कुल नहीं देख पा रहा था। कोड अपडेट करने के बाद, मैं स्टेटस कोड देख पा रहा हूं

अद्यतन के लिए धन्यवाद @ dimitriy-k यह सुनकर खुशी हुई कि यह समस्या हल हो गई है।

@AlbertoPL के लिए , मैं आज रात आपकी समस्या पर ध्यान दूंगा। यदि आप कर सकते हैं तो इसके बारे में अधिक टिप्पणी देने के लिए स्वतंत्र महसूस करें।

@JoviDeCroock एक नज़र
res.status(426).send()

क्रोम के नेटवर्क टैब में मैं देखता हूं कि /graphql एंडपॉइंट 426 स्थिति कोड और उचित प्रतिक्रिया (अपग्रेड आवश्यक) के साथ प्रतिक्रिया दे रहा है। हालांकि मुझे अभी भी केवल TypeError: Failed to Fetch जब apollo-link-error से onError लिंक का उपयोग किया जाता है। अगर मुझे सही स्थिति कोड मिल सकता है जो बहुत अच्छा होगा (या संदेश भी पर्याप्त होगा)।

ठीक है, यह कुछ बहुत बढ़िया जानकारी है। हमें इसे किसी भी तरह डीबग करने में सक्षम होना चाहिए, क्या आप इसे महसूस करते हैं या?

हाँ, मैं निश्चित रूप से कोशिश कर सकता हूँ। मैं ऐसा करने के लिए किसी भी मदद/सुझावों की सराहना करता हूं।

तो बस क्रोम के डीबगर में कोड के माध्यम से कदम उठाते हुए, मैं देख सकता हूं कि दोनों apollo-link-batch-http और apollo-link-http फ़ेचर फ़ंक्शन का उपयोग करके एपीआई कॉल करते हैं (या तो एक लिंक विकल्प या कुछ डिफ़ॉल्ट के रूप में पारित किया गया है, मैंने दोनों की कोशिश की):

fetcher(chosenURI, options)
    .then(function (response) {
        operations.forEach(function (operation) { return operation.setContext({ response: response }); });
        return response;
    }).then(parseAndCheckHttpResponse(operations))

यह किसी भी तत्कालीन ब्लॉक में नहीं जाता है, बल्कि कैच ब्लॉक में जाता है। तब तक त्रुटि "प्राप्त करने में विफल" पर सेट हो चुकी होती है। कोई स्थिति कोड मौजूद नहीं है।

हमें जांचना चाहिए कि क्या यह यहां गलत है:

https://github.com/apollographql/apolo-link/blob/master/packages/apollo-link-http-common/src/index.ts#L118

मैं इस सप्ताह के अंत में एक पुनरुत्पादन करने की कोशिश करूँगा, काम पर एक बहुत व्यस्त कार्यक्रम एटीएम होने के कारण।

संपादित करें:

मुख्य समस्या यह है कि हर बार जब मैं इसका परीक्षण करता हूं तो मैं apollo-server का उपयोग कर रहा हूं और यह ठीक हो जाता है लेकिन यह हो सकता है कि बाइंडिंग या कुछ अलग हो। इसलिए मेरे लिए बिना सर्वर के प्रजनन के रूप में इसका परीक्षण करना कठिन है

अगर यह मदद करेगा, तो यहां हमारा अपोलो-सर्वर है (ध्यान दें कि हम अपोलो-सर्वर-एक्सप्रेस का उपयोग कर रहे हैं)। CreateGraphQLSchema हमारे द्वारा उपयोग किए जाने वाले अपोलो सर्वर का उदाहरण देता है:

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

const collectFragments = container => {
  return container
    .$list()
    .map(component => container[component])
    .join("\n");
};

const mergeObjects = container => {
  const types = container.$list().map(k => container[k]);
  return _.merge(...types);
};

function CreateGraphQLSchema(
  schema,
  queries,
  mutations,
  subscriptions,
  resolvers,
  graphqlFormatError,
) {
  const graphQlSchema = gql`
    ${collectFragments(schema.enum)}

    ${collectFragments(schema.type)}

    type Query {
      ${schema.Query}
    }

    ${collectFragments(schema.input)}

    type Mutation {
      ${schema.Mutation}
    }

    type Subscription {
      ${schema.Subscription}
    }

    schema {
      query: Query
      mutation: Mutation
      subscription: Subscription
    }
  `;

  const resolverMap = {};
  resolverMap.Query = mergeObjects(queries);
  resolverMap.Mutation = mergeObjects(mutations);
  resolverMap.Subscription = mergeObjects(subscriptions);
  resolvers.$list().forEach(type => (resolverMap[type] = resolvers[type]));

  return new ApolloServer({
    typeDefs: graphQlSchema,
    resolvers: resolverMap,
    context: ({ req, res }) => {
      return { req, res, user: req.user };
    },
    formatError: graphqlFormatError,
    playground: process.env.NODE_ENV !== "production",
  });
}

@AlbertoPL मैं भी इस मुद्दे में भाग गया। यह एक CORS मुद्दा निकला, अपोलो क्लाइंट नहीं।

जब नेटवर्क त्रुटि का सामना करना पड़ता है या सर्वर साइड पर CORS को गलत तरीके से कॉन्फ़िगर किया जाता है, तो एक भ्रूण () वादा एक TypeError के साथ अस्वीकार कर देगा

सुनिश्चित करें कि अनुरोध को अस्वीकार करते समय आप उचित शीर्षलेख वापस कर रहे हैं। मेरे मामले में, मैं एपीआई गेटवे का उपयोग कर रहा था और मेरा कस्टम ऑथराइज़र अनुरोध को अस्वीकार कर रहा था, लेकिन Access-Control-Allow-Origin हेडर संलग्न नहीं कर रहा था। मैं तैनाती का प्रबंधन करने के लिए सर्वर रहित का उपयोग करता हूं, लेकिन इसे क्लाउडफॉर्मेशन टेम्प्लेट में बदला जा सकता है यदि इसका उपयोग किया जाता है: https://serverless.com/blog/cors-api-gateway-survival-guide/#cors -with-custom-authorizers।

अच्छा खोज @ क्रिस-फीस्ट!
प्रतिक्रिया में Access-Control-Allow-Origin हेडर जोड़ने से स्थिति कोड अपोलो-क्लाइंट के लिए उपलब्ध हो गया

Express.js में, मैंने बस निम्नलिखित किया:

res.set('Access-Control-Allow-Origin', '*').status(401).send()

एक्सेस-कंट्रोल-अनुमति-उत्पत्ति का उपयोग संभावित सुरक्षा जोखिम की अनुमति नहीं देता है? https://stackoverflow.com/questions/12001269/what-are-the-security-risks-of-setting-access-control-allow-origin

तो किसी के लिए अभी भी देख रहे हैं ...

StatusCode मान को networkError पर एक संपत्ति के रूप में लौटाया जाता है, और networkError के लिए अद्यतन टाइपिंग को यहाँ जोड़ा गया था: https://github.com/apollographql/apollo-link/pull/530

चूंकि networkError अब Error | ServerError | ServerParseError का एक संघ प्रकार है, टाइपप्रति हमें केवल उन संपत्तियों तक पहुंचने की अनुमति देगा जो संघ में सभी प्रकार के लिए सामान्य हैं। statusCode प्रकार Error पर मौजूद नहीं है। हम टाइपप्रति शिकायत के बिना networkError.statusCode माध्यम से इसे एक्सेस नहीं कर पाएंगे; हमें प्रकारों में अंतर करने के लिए टाइप गार्ड या कुछ और का उपयोग करने की आवश्यकता है।

टाइपस्क्रिप्ट हैंडबुक में कई तरीके सुझाए गए हैं: https://www.typescriptlang.org/docs/handbook/advanced-types.html#type -guards-and-differentiating-types

अपने उद्देश्यों के लिए, मैंने चीजों को काम करने के लिए in ऑपरेटर का उपयोग किया।

  onError: ({ networkError }: ErrorResponse) => {
    if (
      networkError &&
      'statusCode' in networkError &&
      networkError.statusCode === 401
    ) {
      // perform logout stuff
    }
  },

@JoviDeCroock लगता है कि इस मुद्दे को बंद करना सुरक्षित है?

@mrkrli धन्यवाद। सभ्य समाधान।