react-native - 无法使用`apollo-upload-client`将图像上传到graphql服务器`graphql-upload`

Question

我正在尝试将图像从 react-native 应用程序上传到 apollo-server，但出现以下错误：

message: "Variable "$photo" got invalid value { uri: "file:///data/user/0/com.dummyapp/cache/react-native-image-crop-picker/IMG_20211028_171740.jpg", name: "1635453941000", type: "image/jpeg" }; Upload value invalid."

服务器端解析器变异实现

import { FileUpload } from "graphql-upload";

这是FileUpload模块类型定义中的样子：

export interface FileUpload {
  filename: string;
  mimetype: string;
  encoding: string;
  createReadStream(): ReadStream;
}

我想我应该期待客户的这一点。

客户端实现

const USER_UPLOAD_AVATAR = gql`
    mutation userUploadAvatar($photo: Upload!) {
        userUploadAvatar(photo: $photo)
    }
`;

const avatarPhotoAsReactNativeFile = new ReactNativeFile({
  uri: avatarPhoto.path, // -> "file:///data/user/0/com.univarsity/cache/react-native-image-crop-picker/IMG_20211028_171740.jpg"
  name: avatarPhoto.modificationDate, // -> "1635453941000"
  type: "image/jpeg",
});

const [avatarPhotoUploadHandler] = useMutation(USER_UPLOAD_AVATAR, {
  variables: { photo:  avatarPhotoAsReactNativeFile },
  onCompleted: data => console.log(data),
  onError: error => console.log(error), 
});


const MyScreen = () => <Button title="upload avatar" onPress={avatarPhotoUploadHandler} />

这是我为得到错误而汇总的逻辑：D，任何想法都将不胜感激:)

标签： react-nativegraphqlapollo-clientapollo-serverimage-upload