标签: react-native-image-picker

我根据文档安装了react-native-image-picker。当我尝试从手机中选择图像时（按下按钮后），模拟器给了我这个错误 - null is not an object (evaluating 'ImagePickerManager.showImagePicker')

我的 React Native 版本是 0.59.8

图像选择器的版本是0.28.0

这是代码-

import React, { Component } from 'react';
import {
  StyleSheet,
  Text,
  View,
  Image,
  Button
} from 'react-native';
import ImagePicker from "react-native-image-picker";

export default class App extends Component {

  state = {
    pickedImage: null
  }

  reset = () => {
    this.setState({
      pickedImage: null
    });
  }




pickImageHandler = () => {
    ImagePicker.showImagePicker({title: "Pick an Image", maxWidth: 800, maxHeight: 600}, res => {
      if (res.didCancel) {
        console.log("User …

我正在开发一个项目，我需要使用相机或从库中选择图像，因此使用了 React Native 图像选择器，它在开发模式下工作正常，在生产中它在 Android 10 中不起作用，只是我尝试了来自 github 的很多解决方案就像权限一样，我在清单中添加 android:requestLegacyExternalStorage="true" 但它导致了我和错误 android:requestLegacyExternalStorage 当我想在开发和生产中构建时找不到

我将 sdk 目标更新为 29 同样的问题

我的图像选择器代码

const options = {
  cancelButtonTitle: strings.cancel,
  takePhotoButtonTitle: strings.takePicture,
  chooseFromLibraryButtonTitle: strings.chooseFromLibrary,
  title: strings.selectPhoto,
  quality: 0.1,
  noData: true,
  storageOptions: {
    skipBackup: true,
    path: 'images',
    cameraRoll: true,
    waitUntilSaved: true,
  },
};

const pickImage = () => {
  const promise = new Promise(async (resolve, reject) => {
    if (Platform.OS === 'android') {
      try {
        await PermissionsAndroid.requestMultiple([
          PermissionsAndroid.PERMISSIONS.CAMERA,
          PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE,
        ]);

        const permissionCamera = await PermissionsAndroid.check(
          'android.permission.CAMERA', …

我的功能提供了一个小图像图标作为可触摸的按钮来上传或拍照，使用"react-native-image-picker": "^3.3.2"。

我收到 error: ，与此GitHub 问题Cannot read property 'launchImageLibrary' of undefined相同，但如您所见，我的代码已经按照他们的指示进行了导入。

这是我的完整代码：

import React from 'react';
import {
    StyleSheet,
    Image,
    TouchableOpacity,
    Alert
} from 'react-native';
import { launchImageLibrary } from 'react-native-image-picker';

const ImageUpload: React.FC<any> = ({}) => {

    function showMessage() {
        Alert.alert("Upload image", "Choose a option", [
            {
                text: 'Camera',
                onPress: () => openCamera(),
            },
            {
                text: 'Gallery',
                onPress: () => openLibrary()
            },
        ]);
    }

    const openLibrary = () => {

        const options = { …

我正在尝试将图像文件上传到 firebase 存储，保存下载 URL，并在上传完成后加载它。当我使用 debug js 远程运行应用程序时，它工作正常。当我关闭调试模式时，它会停止处理无效格式异常。当我在真实设备（iOS 和 Android）中运行时也会发生同样的情况

来自React Native Image Picker的base64响应数据似乎是正确的

这是我的代码

...
import * as ImagePicker from 'react-native-image-picker'; //0.26.10
import firebase from 'firebase'; //4.9.1
...

handleImagePicker = () => {
    const { me } = this.props;
    const options = {
      title: 'Select pic',
      storageOptions: {
        skipBackup: true,
        path: 'images'
      },
      mediaType: 'photo',
      quality: 0.5,
    };
    ImagePicker.showImagePicker(options, async (response) => {
        const storageRef = firebase.storage().ref(`/profile-images/user_${me.id}.jpg`);

        const metadata = {
          contentType: 'image/jpeg',
        };

        const task = storageRef.putString(response.data, 'base64', metadata); …

我想保持上传图像的质量（大小）。用于此的选项是

const options = { quality:1, maxWidth: 500, maxHeight: 500, allowedEditing: false, storageOptions: { skipBackup: true } }

我在将图片上传到 Firebase 存储时遇到问题。我正在使用 React Native 的 @react-native-firebase/storage 并且安装和连接似乎很好，因为我能够很好地引用图像：

const ref = firebase.storage().ref('myImage.png');

问题绝对是基于权限的，因为当我暂时删除时：

: if request.auth != null

来自 Firebase 控制台存储规则：

rules_version = '2';
service firebase.storage {
  match /b/{bucket}/o {
    match /{allPaths=**} {
      allow read, write: if request.auth != null;
    }
  }
}

这工作得很好：

firebase.storage()
    .ref('images/test.jpg')
    .putFile(myImage[0].path)
    .then((successCb) => {
        console.log('successCb');
        console.log(successCb);
    })
    .catch((failureCb) => {
        console.log('failureCb');
        console.log(failureCb);
    });

那么如何进行身份验证以安全地使用 putFile 呢？

编辑：我正在使用“@react-native-firebase/storage”：“^6.2.0”

提前致谢！

我正在使用react-native-image-picker 2.3.1，react-native 0.63.3和react 16.3.1。当使用图像选择器启动相机时，在某些设备（三星设备、Android 10、平板电脑和手机）上，用户拍照后，react-native 应用程序将重新初始化自身，而不会出现任何错误或适当的警告。行为并不一致：有时，用户只能拍摄 1 张照片，应用程序会重新启动，有时会发生在拍摄第 33 张照片时。该行为无法在模拟器或一加或摩托罗拉等不同设备中重现。系统 logcat 日志仅显示一些相关细节，我可以缩小范围：

• 15533-15533/？E/com.sfsdriver：runtime_flags 中设置的未知位：0x8000

• E/InputDispatcher: 通道 'd0f2b6f com.sfsdriver/com.sfsdriver.MainActivity (server)' ~ 通道已不可恢复地损坏并将被处置！（可能在应用程序不再活动后发生）

• E/memtrack：无法加载 memtrack 模块

还有这样的行： 7165-13038/com.sfsdriver I/ReactNativeJNI: Memory warning (Pressure level: TRIM_MEMORY_COMPLETE) returned by JS VM, running a GC 当应用程序在采取操作后成功返回到应用程序活动时都会发生这种情况图片以及应用程序何时重新启动。

我还尝试了以下react-native库：expo-image-picker、react-native-image-picker：v3.0.0-vnext.3

我正在尝试使用 react-native-image-picker，但出现错误：NativeModule.ImagePickermanager 为空。

import React, { Component } from 'react';
import { Text, View, StyleSheet, Alert, PixelRatio, Image } from 'react-native';
import ImagePicker from 'react-native-image-picker';
...
handleChoosePhoto = () => {
    const options = {
      noData: true,
    };
    ImagePicker.launchImageLibrary(options, response => {
      if (response.uri) {
        this.setState({ photo: response });
      }
    });
};

...

<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
            {this.state.photo && (
    <Image
       source={{ uri: this.state.photo.uri }}
       style={{ width: 300, height: 300 }}
    />
  )}
  <Button title="Choose …

使用0.28.0版本的本机图像选择器，使用本机0.59.5的反应器和小于13的iOS版本运行良好。但是升级到iOS 13+之后，它不会从库中选择视频并返回权限错误作为响应。具体如何实现？

在我的 react-native 应用程序中，我使用 react-native-image-picker 从相机或图库中选择图像。但是在launchCamera 和launchImageLibrary 中返回的resource.uri 都是undefined。我究竟做错了什么？

这是我的 react-native 应用程序基本构建的github 存储库。图像选择器代码在 addProductScreen.js 中