Ошибка: не удалось получить медиа в React Native - PullRequest
0 голосов
/ 09 июля 2020

Мне удалось создать фотогалерею, сохранив фотографии в моей настраиваемой папке, созданной в моем родном приложении Cameraroll. Я также записывал видео с помощью приложения RNCameraRoll. Теперь я хочу создать видеогалерею, но мой код не может получать видео, но изображения с сообщением об ошибке «Не удалось получить медиа». Мне нужна помощь в создании этой видеогалереи ... Спасибо

 state = {
        modalVisible: false,
        videos: [],
        index: null
    }


    setIndex = (index) => {
        if (index === this.state.index) {
            index = null
        }
        this.setState({ index })
    }

    getPhotos = () => {
        CameraRoll.getPhotos({
            first: 20,
            groupTypes: 'Album',
            groupName: 'Vocajam Videos',
            assetType: 'Videos'
        })
        .then(r => this.setState({ videos: r.edges}))
        .then((statResult) => {
        let videos = []
        var allowedExtensions = /(\.avi|\.mp4|\.mov|\.wmv|\.avi)$/i;
        statResult.forEach(item => {
        if (item.isFile() && !allowedExtensions.exec(item.originalFilepath)) {
        videos.push(item)
        }
        });
        console.log(videos)
        })
    }

    toggleModal = () => {
      this.setState({ modalVisible: !this.state.modalVisible})
  }


  share = () => {
    const vocvideo = this.state.photos[this.state.index].node.image.uri
    RNFetchBlob.fs.readFile(vocvideo, 'base64')
    .then((data) => {
      let shareOptions = {
        title: "React Native Share Example",
        message: "Check out this photo!",
        url: `data:video/mp4;base64,${data}`,
        subject: "Check out this photo!"
      };

      Share.open(shareOptions)
        .then((res) => console.log('res:', res))
        .catch(err => console.log('err', err))
    })
  }

      render() {
        console.log('state :', this.state)
        return (
          <View style={styles.container}>
            <Button
              title='View videos'
              onPress={() => { this.toggleModal(); this.getPhotos() }}
            />
            <Modal
              animationType={"slide"}
              transparent={false}
              visible={this.state.modalVisible}
              onRequestClose={() => console.log('closed')}
            >
              <View style={styles.modalContainer}>
                <Button
                  title='Close'
                  onPress={this.toggleModal}
                />
                <ScrollView
                  contentContainerStyle={styles.scrollView}>
                  {
                    this.state.videos.map((p, i) => {
                      const isSelected = i === this.state.index;
                      const divide = isSelected && this.share === true ? 1 : 3;
                      return (
                        <TouchableHighlight
                          style={{opacity: i === this.state.index ? 0.5 : 1}}
                          key={i}
                          underlayColor='transparent'
                          onPress={() => this.setIndex(i)}
                        >
                          <Image
                            style={{
                              width: width/divide,
                              height: width/divide
                            }}
                            source={{uri: p.node.image.uri}}
                          />
                        </TouchableHighlight>
                      )
                    })
                  }
                </ScrollView>
                {
                  this.state.index !== null  && (
                    <View style={styles.shareButton}>
                      <Button
                          title='Share'
                          onPress={this.share}
                        />
                    </View>
                  )
                }
              </View>
            </Modal>
          </View>
        )
      }
    }
...