Question

我正在使用react-native编写一个简单的Twitter应用程序。使用twit模块获取Twitter提要和流。下面是代码，它工作正常。但是，当包含在我的本机应用程序中时，会看到错误＆＃34;需要未知模块＆＃34;加密＆＃34;＆＃34;。依赖性似乎是myapp-＆gt; twit-＆gt; oauth-＆gt; crypto（那是节点v0.12.2的一部分）。有什么建议让这个在反应本地环境中工作吗？

var Twit = require('twit')
var T = new Twit({
    consumer_key:''
  , consumer_secret:''
  , access_token:''
  , access_token_secret:''
})
var filtered_tweets=[];
var error;
var isSuccess=false;

function getTweets(searchString){
    T.get('search/tweets',{q:searchString, count:100}, getResponse);
    }

function getResponse(err,data,response){
        if(err) { 
            handleGetErr(err); 
        }
        handleGetData(data.statuses);
    }

function handleGetErr(err){

    enter code here

    error = err;
    }

function handleGetData(data){
    data.map(function(tweet){
      var twit={
        twit:tweet.id,
        created_at:tweet.created_at,
        text:tweet.text,
        retweet_count:tweet.retweet_count,
        favorite_count:tweet.favorite_count
      };
      filtered_tweets.push(twit);
    });
    console.log(filtered_tweets);
    isSuccess=true;
}
getTweets("@sahaswaranamam");
module.exports = getTweets;

！[附] [2]

Answer 1

crypto模块是内置节点模块; React Native在JavaScriptCore（在设备或模拟器上）和Chrome本身（使用Chrome调试时）运行JS，因此依赖于内置Node.js模块的模块无法运行。有关详细信息，请参阅React Native文档的the JavaScript Runtime section。

我不确定将其集成到React Native应用程序有多难，但浏览器模块捆绑包（如Browserify）通常具有核心Node.js模块的浏览器版本，例如this one for crypto。

Answer 2

React Native packager在引擎盖下使用Babel。这意味着您可以使用babel-plugin-rewrite-require Babel plugin重写对require('crypto')的所有require('crypto-browserify')次来电，假设后者已安装在node_modules中。

截至2016年1月，您可以使用.babelrc文件来定义可选配置，因此这变得非常简单。首先，安装依赖项：

npm install --save crypto-browserify
npm install --save-dev babel-plugin-rewrite-require

然后将plugins config添加到.babelrc文件中：

{
  "presets": ["react-native"],
  "plugins": [
    ["babel-plugin-rewrite-require", {
      "aliases": {
        "crypto": "crypto-browserify"
      }
    }]
  ]
}

重新启动打包器，应该是它。

这与ReactNativify使用的方法相同，只是在这里我们使用.babelrc而不是定义自定义变换器。写ReactNativify时，它不受支持，所以他们必须采用更复杂的解决方案。有关几乎完整的节点polyfill列表，请参阅this file from ReactNativify。

Answer 3

在我的React Native应用程序中实现Twilio包时，我遇到了同样的问题，并且让React Native突破了加密依赖项。

作为一项工作，我最终创建了一个单独的，独立的Node / Express应用程序作为我的服务器，并负责我的Twilio逻辑。这样我就从我的React Native应用程序中删除了所有Twilio逻辑并将其移动到Node。然后我使用fetch在React Native中调用了我的Express路由，这触发了我想用Twilio发生的功能。如果你不熟悉这里取一个很好的起点 - Making AJAX calls with Fetch in React Native

此外，这是关于加密依赖项破坏我的应用程序的问题：

twilio-react-native-unable-to-resolve-module-crypto

Answer 4

您可以使用rn-nodeify模块获取本地反应的crypto。

将rn-nodeify添加到devDependencies中的package.json：

"devDependencies": {
  "rn-nodeify": "^6.0.1"
}

将以下内容添加到同一文件的scripts部分：

"scripts": {
  …
  "postinstall": "node_modules/.bin/rn-nodeify --install crypto --hack"
}

请注意，rn-nodeify将修改package.json。

此处提供了更多信息：https://www.npmjs.com/package/rn-nodeify

Answer 5

如果您使用rn-nodeify作为@emmby建议，那么您可以使用react-native-crypto。自述文件中的说明：

安装

npm i --save react-native-crypto
# install peer deps
npm i --save react-native-randombytes
react-native link react-native-randombytes
# install latest rn-nodeify
npm i --save-dev mvayngrib/rn-nodeify
# install node core shims and recursively hack package.json files
# in ./node_modules to add/update the "browser"/"react-native"
# field with relevant mappings
./node_modules/.bin/rn-nodeify --hack --install

rn-nodeify将在项目根目录

中创建shim.js

// index.ios.js or index.android.js
// make sure you use `import` and not require!  
import './shim.js'
// ...the rest of your code

但是rn-nodeify也说明了：

如果您正在寻找更合理的方法，请查看ReactNativify。我自己还没有测试过，但我认为philikon很乐意帮助

使用ReactNativify，您可以创建rn-cli.config.js，然后在transformer.js中让Babel使用babel-plugin-rewrite-require转换捆绑依赖项：

// The following plugin will rewrite imports. Reimplementations of node
// libraries such as `assert`, `buffer`, etc. will be picked up
// automatically by the React Native packager.  All other built-in node
// libraries get rewritten to their browserify counterpart.

[require('babel-plugin-rewrite-require'), {
  aliases: {
    crypto: 'crypto-browserify',
    // ...
  },
  throwForNonStringLiteral: true,
}]

（注意：您也可以直接在.babelrc中

（ Note2 ：虽然ReactNativify是一种更清洁的方式，但它仍然会让我联系crypto.getRandomValues以便在RN中进行生产用途。请参阅this question）

Answer 6

到目前为止，我可以看到amazon-cognito-identity-js使用crypto-js 3.3.0，而没有任何额外的魔法...如果该版本的软件包有效，则可以尝试一下。

需要未知模块＆＃34;加密＆＃34;在反应原生的环境中

6 个答案: