使用Flutter请求GraphQL时无法在QueryVariables中封装LogIn

问题原因 #

• 你声明的GraphQL Mutation要求传入一个名为Login的Login类型输入对象，但你当前构造的variables参数直接把phone、accessCode放在根层级，没有按照变量定义封装到Login字段下
• 你的Mutation字符串末尾遗漏了闭合的三引号，会引发Dart语法错误

修复方案 #

修改inviteCode方法中的variables构造逻辑，补全Mutation字符串的闭合标记即可，修正后完整代码如下：

import 'package:fauna/data/api/graphql_api_client.dart';
import 'package:get/get.dart';
import 'package:graphql_flutter/graphql_flutter.dart';

abstract class InviteCodeRepository {
  Future<void> inviteCode(String inviteCode, String phone);
}

class InviteRepositoryImplementation extends GetxController
    implements InviteCodeRepository {
  String login = r'''
  mutation login($Login: Login){
    login(login: $Login) {
      token
    }
  }
'''; // 补全了三引号闭合标记

  final _gqlClient = Get.put(GraphQLApiClient(), permanent: true);

  @override
  Future<void> inviteCode(String inviteCode, String phone) async {
    // 把参数封装到Login字段下，匹配Mutation的变量定义
    final variables = {
      'Login': {
        'phone': phone,
        'accessCode': inviteCode
      }
    };
    final QueryResult result = await _gqlClient.mutation(
      login,
      variables: variables,
    );
    print(result.data);
  }
}

补充说明 #

如果请求依然报错，可以打印result.exception查看具体的GraphQL服务端返回的错误信息，排查是否存在字段名拼写错误、Login类型字段不匹配的问题。

内容的提问来源于stack exchange，提问作者Igor Lopatchin