React-Native-Camera只会偶尔运行

时间:2018-11-03 20:40:50

标签: javascript android react-native

我在设置react-native-camera时遇到问题,当我在应用程序上创建新帐户时,它有时可以让我拍照,但是即使设置了路由也不会发送到服务器向上,我尝试记录图像生成的数据,并按需获取base64和uri。 问题是它仅在某些情况下才起作用,即使在那时,只有当我在应用程序中创建新帐户时,它也不会将图像发送到服务器。

以下是Camera.js文件的编写方式:


class Camera extends Component {
  constructor(props) {
    super(props);
    this.state = {
      userId: this.props.navigation.state.params
    };
  }

  render() {
    return (
      <View style={styles.container}>
        <RNCamera
          ref={ref => {
            this.camera = ref;
          }}
          style={styles.preview}
          type={RNCamera.Constants.Type.back}
          flashMode={RNCamera.Constants.FlashMode.on}
          permissionDialogTitle={"Permissao para usar a camera"}
          permissionDialogMessage={
            "Precisamos da sua permissao para utilizar a camera do dispositivo"
          }
          onGoogleVisionBarcodesDetected={({ barcodes }) => {
            console.log(barcodes);
          }}
        />
        <View
          style={{ flex: 0, flexDirection: "row", justifyContent: "center" }}
        >
          <TouchableOpacity
            onPress={this.takePicture.bind(this)}
            style={styles.capture}
          >
            <Text style={{ fontSize: 14 }}>
              <Icon
                name="camera"
                size={20}
                color="#669999"
                paddingHorizontal={5}
              />
              FOTO
            </Text>
          </TouchableOpacity>
        </View>
      </View>
    );
  }

  takePicture = async function() {
    if (this.camera) {
      const options = { quality: 0.5, base64: true };
      const imageData = await this.camera.takePictureAsync(options);
      const turbo = Turbo({ site_id: "5bd242567d324e00130545a1" });
      console.log(imageData);
      const cdnResp = await turbo.uploadFile({
        uri: imageData.uri,
        name: "camera_pic",
        type: "image/jpeg"
      });
      const resp = await fetch(
        config.baseUrl + "/users/" + this.state.userId + "/photo",
        {
          method: "POST",
          headers: {
            Accept: "application/json",
            "Content-Type": "application/json"
          },
          body: JSON.stringify({ imageUrl: cdnResp.result.url })
        }
      );
      console.log(resp);
    }
  };
}

有人知道为什么它会不时地起作用吗? 这是camera.js在api中使用的路由:

router.get("/users/:id/photo", function(req, res) {
    const userId = req.params.id;
    console.log(req.params);
    const myPhoto = {
      url: req.body.imageUrl,
      user: req.params.id
    };
    turbo
      .create("photo", myPhoto)
      .then(data => {
        res.json({
          confirmation: "success",
          data: data
        });
        return;
      })
      .catch(err => {
        res.json({
          confirmation: "fail",
          message: "Sorry, something went wrong"
        });
        return;
      });
  });

本来应该在Turbo中创建一个名为photo的新资源,但是图片没有到达那里,有人知道如何解决这个问题或给我指示吗?

0 个答案:

没有答案