运行时 Google Speech API React-Native 错误

Question

尝试将 Google Speech to text API 移动到 React-Native。这是我到目前为止的代码。我得到的错误是：“捆绑失败：错误：

无法从 /Users/Desktop/finalTest/final3/App.js 解析模块 fs：模块 fs 不存在于 Haste 模块映射中”。

我尝试运行建议的命令，但仍然无效：

1. 清除守望者手表：watchman watch-del-all。
   1. 删除node_modules文件夹：rm -rf node_modules && npm install。
   2. 重置 Metro Bundler 缓存：rm -rf /tmp/metro-bundler-cache-* 或 npm start -- --reset-cache。
   3. 移除加速缓存：rm -rf /tmp/haste-map-react-native-packager-*。

任何帮助将不胜感激。

import React, { Component } from "react";
import { Platform, StyleSheet, Text, View } from "react-native";
import axios from "axios";

const instructions = Platform.select({
  ios: "Press Cmd+R to reload,\n" + "Cmd+D or shake for dev menu",
  android:
    "Double tap R on your keyboard to reload,\n" +
    "Shake or press menu button for dev menu"
});

const fs = require("fs");
const axios = require("axios");

const API_KEY = "./keyfile.json";
const fileName = "./audio.raw";

// Reads a local audio file and converts it to base64
const file = fs.readFileSync(fileName);
const audioBytes = file.toString("base64");

// The audio file's encoding, sample rate in hertz, and BCP-47 language code
const audio = {
  content: audioBytes
};
const config = {
  encoding: "LINEAR16",
  sampleRateHertz: 16000,
  languageCode: "en-US"
};
const request = {
  audio: audio,
  config: config
};

const apiKey = API_KEY;
const url = `https://speech.googleapis.com/v1/speech:recognize?key=${apiKey}`;

axios
  .request({
    url,
    method: "POST",
    data: request
  })
  .then(response => {
    const transcription = response.data.results
      .map(result => result.alternatives[0].transcript)
      .join("\n");
    console.log(`Transcription: ${transcription}`);
  })
  .catch(err => {
    console.log("err :", err);
  });

type Props = {};
export default class App extends Component<Props> {
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>Welcome to React Native!</Text>
        <Text style={styles.instructions}>To get started, edit App.js</Text>
        <Text style={styles.instructions}>{instructions}</Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: "center",
    alignItems: "center",
    backgroundColor: "#F5FCFF"
  },
  welcome: {
    fontSize: 20,
    textAlign: "center",
    margin: 10
  },
  instructions: {
    textAlign: "center",
    color: "#333333",
    marginBottom: 5
  }
});

Answer 1

您不能在本机反应中使用fs 或任何节点核心模块。 You can read more about that here，但最好将您的 JS 视为没有任何附加 API 或模块的纯 JavaScript。

如果您需要文件系统访问权限，则需要第三方库，例如 react-native-fs