尝试向本地 GQL 端点发出请求时出现异常错误答案

【问题标题】：Perculiar error when trying to make request to local GQL endpoint尝试向本地 GQL 端点发出请求时出现异常错误
【发布时间】：2020-01-13 09:12:13
【问题描述】：

我正在尝试在 react-native 中设置一个 android 应用程序，它正在调用本地 API。理想情况下，我希望看到 API 请求实际成功，或者至少返回一个格式化的 GraphQL 异常，该异常应该在我的后端生成。

我的 GraphQL api 在 localhost:3000 上运行

我已经为我偶然发现的任何问题尝试了通用解决方案

设置安卓模拟器HTTP代理到10.0.2.2:3000

我已经这样设置了 ApolloClient

const client = new ApolloClient({
    link: new HttpLink({
        uri: Platform.select({
            android: 'http://"my machine ip here" / ipv4 /graphql'
        })
    }),
    cache: new InMemoryCache(),
});

我也试过了

const client = new ApolloClient({
    link: new HttpLink({
        uri: Platform.select({
            android: 'http://10.0.2.2:3000/graphql'
        })
    }),
    cache: new InMemoryCache(),
});

API 请求在这里发出：

    const [login, {data, loading, error}] = useMutation(LoginUserMutation);

    return <LoginWrapper>
        <Formik
            initialValues={{email: '', password: ''}}
            onSubmit={async ({email, password}) => {
                const user = await login({variables: {email, password}});

            }}
        >
            {({
                  values,
                  handleChange,
                  errors,
                  setFieldTouched,
                  touched,
                  isValid,
                  handleSubmit
              }) => <>
                <Input
                    value={values.email}
                    onChangeText={handleChange('email')}
                    onBlur={() => setFieldTouched('email')}
                    placeholder='E-mail'
                />
                <Input
                    value={values.password}
                    onChangeText={handleChange('password')}
                    placeholder='Password'
                    onBlur={() => setFieldTouched('password')}
                    secureTextEntry={true}
                />
                <Button
                    onClick={handleSubmit}
                    text='Sign In'
                />
            </>}
        </Formik>
    </LoginWrapper>
};

graphql 突变可以看这里

export const LoginUserMutation =
    gql(
        mutation('loginUser',
            params(
                {
                    $args: 'LoginUserInput!'
                },
                {
                    updateUser: params({args: '$args'},
                        {
                            email: types.string,
                        }
                    ),

                })
        )
    );

可以在此处找到错误图像 - https://imgur.com/a/6odLPnU

这里是部分堆栈跟踪 -

可能的未处理承诺拒绝（id：0）：错误：网络错误：响应不成功：收到状态码 400 ApolloError@blob:http://localhost:8081/86efb950-3eff-404f-bc63-41535a310e3a:92518:28 错误@blob:http://localhost:8081/86efb950-3eff-404f-bc63-41535a310e3a:93755:30 notifySubscription@blob:http://localhost:8081/86efb950-3eff-404f-bc63-41535a310e3a:141965:20 onNotify@blob:http://localhost:8081/86efb950-3eff-404f-bc63-41535a310e3a:142004:23

【问题讨论】：

400 错误意味着您发送的查询格式错误或验证失败。检查从服务器收到的实际响应以查看问题所在。如果您不知道问题出在哪里，您也可以在此处使用您发送的查询更新您的问题。
您好，感谢您的回复。我已经在我的服务器上启用了日志记录，并且没有请求通过。 & 我刚刚用 GQL 突变更新了它
根据您记录请求的位置，如果请求格式不正确，您不一定会记录任何内容。
确实如此。它在解析器级别作为拦截器，所以很可能是。但我也没有看到它在网络选项卡中触发......我不完全确定你是否可以看到来自 react native 的流量。我将向控制器设置一个简单的获取请求并查看它是否返回任何内容
无论哪种方式，尚不清楚您的 sn-p 中的 mutation 和 params 函数的作用。查看传递给gql 的实际字符串会提供更多信息。

标签： android-emulator graphql react-native-android

【解决方案1】：

所以我已经解决了这个问题。

突变应该是

export const LoginUserMutation = gql(
    mutation('login',
        params({$args: 'LoginUserInput!'}, {
            login: params({args: '$args'}, {
                token: types.string,
            }),
        })
    )
);

突变的调用应该是

    const [login, {data, loading, error}] = useMutation(LoginUserMutation);

    await login({variables: {args: {email, password}}})

【讨论】：