Skip to content

Error while trying to upload image from react-native #348

Description

@JulienKisoni

Hello, please help me. I have a serious problem, and i don't know how to fix that.
I'm using react native (and expo) with react-native-meteor and I'm trying to upload an image to meteor (FSCollection) and i get this error [TypeError: (0, _Collection.default) is not a function. (In '(0, _Collection.default)(collectionName)', '(0, _Collection.default)' is undefined)]

here is my code on client (react-native)

import React, { Component } from "react";
import {  View } from "react-native";
import { Button, Text } from "native-base";
import * as ImagePicker from "expo-image-picker";
import Meteor, { withTracker } from "react-native-meteor";

class Profil extends Component {
  upload = async file => {
    try {
      if (this.props.imagesReady) {
        console.log("images ready", this.props.Images.find());
        this.props.Images.insert(file.uri, (err, fileObj) => {
          if (err) {
            console.log("error upload", err);
          } else {
            console.log("fileObj", fileObj);
          }
        });
      }
    } catch (e) {
      console.log("upload error catch", e);
    }
  };
  getImages = async () => {
    try {
      const options = {
        mediaTypes: ImagePicker.MediaTypeOptions.Images
      };
      const result = await ImagePicker.launchImageLibraryAsync(options);
      console.log("result", result);
      this.upload(result.uri);
    } catch (e) {
      console.log("error getImages", e);
    }
  };
  render() {
    return (
          <View>
            {this.props.imagesReady ? (
              <Button full onPress={this.getImages}>
                <Text>Get Images</Text>
              </Button>
            ) : null}
          </View>
    );
  }
}

export default Meteor.withTracker(params => {
  const handle = Meteor.subscribe("Images.all");
  return {
    imagesReady: handle.ready(),
    Images: Meteor.FSCollection("Images")
  };
})(Profil);

here is my code on meteor server :

import { Meteor } from "meteor/meteor";
import { FS } from "meteor/cfs:base-package";
import { GridFS } from "meteor/cfs:gridfs";

const imageStore = new FS.Store.GridFS("images", {
  mongoUrl: "xxxxxxxxxxxxxx" // < -- My mongoUrl here
});

export const Images = new FS.Collection("Images", {
  stores: [imageStore]
});

if (Meteor.isServer) {
  Meteor.publish("Images.all", function() {
    return Images.find();
  });
  Images.allow({
    insert: function() {
      // add custom authentication code here
      return true;
    },
    update: function() {
      return true;
    },
    download: function() {
      return true;
    }
  });
}

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions