Skip to content

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

@JulienKisoni

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;
    }
  });
}

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