Runtime Support: React-Native #1254
Comments
|
Instead of trying to run IPFS directly, check out how the browser and node versions work. You'll want to create new versions of those files which only use features available in react-native. I think the only transport that you'll get working is React-Native is like a more constrained browser environment at the moment, and getting it anywhere as near to the node version of IPFS will require a bunch of new transports that work with RN plugins. |
|
I was able to get ipfs and orbit-db working on react native using janeasystems/nodejs-mobile. I had to make the following changes though:
I used that build of leveldown for js-datastore-level and ipfs-repo. I also had to update js-datastore-level to work with [email protected] (mistakia/js-datastore-level@9545fe5) After making those changes, I was able to initialize an ipfs repo. I'm going to do some stress testing this weekend to see how well it works. |
|
@RangerMauve Do you mean making some tweaks to files in https://github.com/ipfs/js-ipfs/tree/master/src/core/runtime to make files like |
|
@krahimian Is https://github.com/krahimian/record your project? Can I try it out? |
Yes, I think you'll want to do that if you want it to run in a RN context
I don't think I said it was difficult to deal with, quite the opposite. It's the only transport that can receive connections in the browser AFAIK. By the way, @krahimian 's suggestion of using nodejs-mobile is way better than trying to get it to run in regular RN. |
|
@linonetwo yea that's the project - there's not much to try out right now. I'll update you when there is. The goal is to build a proof of concept twitter and soundcloud using just ipfs/orbit-db. |
daviddias
added
kind/support
|
@krahimian hope You succeed soon! |
|
I was able to get js-ipfs working on nodejs mobile (react native) both on simulator and a device (after using this fix). However, I noticed a difference in performance and ipfs boot/start time if I add a swarm address (websocket-star). I see there are plans for adding libp2p-connection-manager in the next release, which I think would help address performance issues on mobile. In the meantime, does anyone have any recommendations for any settings/configurations or strategies I can try to boost performance in a mobile environment? |
|
How about https://github.com/textileio/textile-mobile 's approach? They got it worked and is MIT licensed! |
|
@mistakia , have you already tried all the suggestions addressing performance issues ? |
|
Yup! 👍 Bundling the files did have a major impact on CPU usage (not just load times). After nodejs-mobile However, I have yet to really battle test it with a large number of peers and under poor network conditions. |
|
@mistakia looking forward, to see your updates, thanks! 👍 |
|
What's the status on this issue? I created a react-native project to test @mistakia's approach with nodejs-mobile but I can't get it working with versions higher than 0.31.7, get the following error with 0.34.4: Failed : error 0:61 [61]
/private/var/containers/Bundle/Application/18B0EE12-3521-4CAD-B769-BFC01D169B41/reactnativenodejsexample.app/nodejs-project/node_modules/proper-lockfile/lib/lockfile.js:47
return acquireLock(file, { ...options, stale: 0 }, callback);
^^^^
SyntaxError: Expected identifier, string or number
at createScript (vm.js:80:3)
at runInThisContext (vm.js:139:3)
at Module.prototype._compile (module.js:588:3)
at Module._extensions[.js] (module.js:635:3)
at Module.prototype.load (module.js:545:3)
at tryModuleLoad (module.js:508:5)
at Module._load (module.js:500:3)
at Module.prototype.require (module.js:568:3)
at require (internal/module.js:11:7)
at Anonymous function (/private/var/containers/Bundle/Application/18B0EE12-3521-4CAD-B769-BFC01D169B41/reactnativenodejsexample.app/nodejs-project/node_modules/proper-lockfile/index.js:3:1)The problem with sticking with 0.37.1 is that it includes vulnerable dependencies that have been patched already. Here is the example repo: https://github.com/pedrouid/react-native-nodejs-example |
|
Looks like it doesnt like the object spread syntax that proper-lockfile is using. cc @hugomrdias |
|
@pedrouid from what i can see nodejs-mobile is on node 8 and we have stopped supporting that, the solution here is to bundle your js code with rollup (or whatever bundler you prefer) and pass babel-preset-env targeting node 8. this will also keep you safe from any other dependency that uses newer js syntax. |
|
Thanks @hugomrdias, I did try bundling with both browserify and webpack using @babel/preset-env but I still got other object spread errors. I saw that |
|
@pedrouid that seems weird you sure you are running babel on your dependencies? Because that should work. |
|
Thanks, I also tried that with multiple plugins as well. You can check the branches on my test repo: https://github.com/pedrouid/react-native-nodejs-example I always get an error on the line that has asyncMap(pathComponents.map((part, index) => ({ part, index })), ({ part, index }, cb) => {
if (trail[index]) {
return cb(null, {
name: part,
...trail[index]
})
}
// if we are not at the last path component and we are
// not creating intermediate directories make a fuss
if (index !== pathComponents.length - 1 && !options.parents) {
return cb(new Error('file does not exist'))
}
waterfall([
(done) => createNode(context, 'directory', options, done),
({ cid, node }, done) => {
done(null, {
cid,
size: node.size,
name: part
})
}
], cb)
}, cb) |
Can you guys inform procedure for Android to use ipfs and ipfs-pubsub in React-Native ? |
|
@kesavananbu this is related to leveldb and not @pedrouid 's problem right ? can't you just use another datastore instead of going through that trouble ? |
|
The attempt below are using I used zeit/ncc to compile the code of the Running the compiled script in my computer with Node 8.6 works. In the React Native side I always receive the error below: Before the experiment I described above I tried using noderify + babel but I received the same |
|
OK, the problem about Now, it's partially working. The nodejs side is not breaking the app but it's not executing nothing after I create the node: e.g. |
|
I'm able to get version Everything works when no repo exists. However, when starting ipfs after a repo has been created/initialized from a previous time, I get this runtime issue: runtime logbundle.js referenced in the stacktrace. To save some time, I've tracked it down to this line: ipfs remains in the Update: passing in Update: ipfs config: |
|
@mistakia I tried all of your fixes and I keep getting the following error: Any idea how to fix this error specifically? |
|
I believe the babelify transform for browserify should fix this. See my previous comment for the full command. I used the |
|
@mistakia Thanks for the tip! Is it normal for it to attempt to transform the Also do I run the babelify command in the root of my entire project or in the |
|
You want to run browserify/babelify in |
|
@mistakia That's what I thought, but for some reason I'm getting conflict errors from libraries like
When I remove those the libraries in my root |
|
I don't know if this has to do with my issue, but I'm getting
before the script attempts to work on the project root's modules in |
Seeing the same here with the latest nodejs-mobile and libp2p dependencies. A lot of things seem to depend on lodash though. Maybe there's a way to make Babel avoid processing this file? |
|
Don't worry about that |
|
I am seting up IPFS 0.4.0 with nodejs-mobile-react-native 0.5.0 on MacOS. But always failed with build when launch npx react-native run-ios. Here is my issue post. The React Native version is 0.61.5 and 3 node version 10.13.0/10.16.0/10.17.0 all failed with launch build. It is related to node-gyp and I am not sure what exactly is wrong. Any suggestion about how to fix? |
|
js-ipfs is being deprecated in favor of Helia. You can #4336 and read the migration guide. Please feel to reopen with any comments by 2023-06-02. We will do a final pass on reopened issues afterwards (see #4336). I completely agree that we want IPFS to be able to run in react-native flawlessly. I believe this is possible with Helia, as we've already "proven" that we can "almost" replace public gateways with in-app service workers. Please try out Helia and let us know if you run into issues when using it in React-Native! |
To use IPFS on react-native, I have done following things:
core-jsto polyfillsetandSymbolreact-native-browser-polyfillto polyfillselfrn-nodeifyto installreact-native-cryptoDragons just come one by one, can we make it easier to use js-ipfs on react-native?
Reproducible example https://github.com/linonetwo/sermover .
The text was updated successfully, but these errors were encountered: