React native-отправка фото на почту

------ ОТРЕДАКТИРОВАННЫЙ ОТВЕТ НИЖЕ ------

Хорошо, Итак, у меня наконец-то есть Mac и я смог изучить эту проблему более подробно.

это то, что я нашел для Android и iOS.

предполагается, что вы используете реагировать родной камеры вместе с react-native-mail

- 1: Абсолютный Путь

добавить свойство captureTarget={Camera.constants.CaptureTarget.disk} to Camera компонент, как Итак:

<Camera
  captureTarget={Camera.constants.CaptureTarget.disk}
  ref={(cam) => {
    this.camera = cam;
  }}
  style={styles.preview}
  aspect={Camera.constants.Aspect.fill}>
  <Text style={styles.capture} onPress={this.takePicture.bind(this)}>[CAPTURE]</Text>
</Camera>

теперь компонент камеры должен возвратить абсолютное путь к файлу вместо uri.

и Android вы должны увидеть нечто вроде этого:

"file:///storage/emulated/0 / Pictures / RCTCameraModule / IMG_20160730_060652.формат JPG"

вместо:

"содержание: / / медиа / внешний/изображения / медиа / 86"

и iOS вы должны сделать что-то вроде этого:

"/Users/anton/Library/Developer/CoreSimulator/Devices/9A15F203-9A58-41C5-A4FC-EA25FAAE92BD/data/Containers/Data/Application/79FF93F9-BA89-4F4C-8809-277BEECD447D/Documents/EFFF0ECE-4063-4FE5-984E-E76506788350.формат JPG"

вместо:

"assets-library: / / актив / актив.В JPG?id=0058FA4A-268F-408A-9150-017A3DA368D2 & ext=JPG"

- 2: подводные камни

iOS:

если сбой MFMailComposeViewController от Apple, и вы видите следующее сообщение об ошибке:

Это скорее всего потому, что вы используете приложение на iOS 9 симулятор. Решение: либо протестируйте приложение на реальном устройстве или загрузите старый симулятор, такой как iOS 8.4.

более подробную информацию по этому вопросу можно найти здесь

Android:

на момент написания этой статьи нет крепления для Android.

устранение: (PR был сделан, чтобы добавить эту функцию, но если вы не можете ждать)

добавить следующий код в файл RNMAILModule.java

if (options.hasKey("attachment") && !options.isNull("attachment")) {
  i.putExtra(Intent.EXTRA_STREAM, Uri.parse(options.getMap("attachment").getString("path")));
}

когда как Android, так и iOS работают, у вас должно быть что-то вроде этого:

и вот рабочий код:

var Mailer = require('NativeModules').RNMail;
import Camera from 'react-native-camera';

import React, {Component} from 'react';
import
{
  View,
  TouchableHighlight,
  Text,
  StyleSheet,
  Dimensions,
  CameraRoll
}
from 'react-native';

const styles = StyleSheet.create({
  container: {
    flex: 1
  },
  preview: {
    flex: 1,
    justifyContent: 'flex-end',
    alignItems: 'center',
    height: Dimensions.get('window').height,
    width: Dimensions.get('window').width
  },
  capture: {
    flex: 0,
    backgroundColor: '#fff',
    borderRadius: 5,
    color: '#000',
    padding: 10,
    margin: 40
  }
});

class SendPhoto extends Component {
  takePicture() {
    this.camera.capture()
      .then((data) => {
        console.log(data.path)
        Mailer.mail({
          subject: 'Ladunek',
          recipients: ['placeholder@mail.com'],
          body: 'body',
          isHTML: true, // iOS only, exclude if false
          attachment: {
            path: data.path,  // The absolute path of the file from which to read data.
            type: 'jpg',   // Mime Type: jpg, png, doc, ppt, html, pdf
            name: 'Ladunek',   // Optional: Custom filename for attachment
          }
        }, (error, event) => {
            if(error) {
              AlertIOS.alert('Error', 'Could not send mail. Please send a mail to support@example.com');
            }
        })
      })
      .catch(err => console.error(err));
  }

  render() {
    return(
      <View>
        <View style={styles.container}>
          <Camera
            captureTarget={Camera.constants.CaptureTarget.disk}
            ref={(cam) => {
              this.camera = cam;
            }}
            style={styles.preview}
            aspect={Camera.constants.Aspect.fill}>
            <Text style={styles.capture} onPress={this.takePicture.bind(this)}>[CAPTURE]</Text>
          </Camera>
        </View>
      </View>
    );
  }
}
export default SendPhoto;

------ СТАРЫЙ ОТВЕТ НИЖЕ ------

Я никогда не использовал этот модуль раньше, но похоже, что он ожидает абсолютный путь к файлу, однако вы предоставляете файл uri.

как вы получаете этот файл uri?

попробуйте использовать react-native-get-real-path модуль, чтобы увидеть, если это поможет, вы можете найти его здесь:react-native-get-real-path

т. е. преобразуйте uri файла для получения реального пути и используйте его как путь