Runtime Support: Ionic Framework

[theD1360]

Can anyone help me out with this? Below is a simplified version of what I have running on an ionic2 project.
I seems that the connection is working but it never seems to trigger the callback but it also never triggers any errors or warnings. Tried using the promises as well but still nothing.

        let node = new IPFS(
                {
                    repo: this.repoPath,
                    EXPERIMENTAL: {
                        pubsub: false
                    },
                  config: { 
                    Addresses: {
                      Swarm: [
                        '/ip4/127.0.0.1/tcp/1337',
                        '/ip4/127.0.0.1/tcp/1337/ws'
                      ]
                    }
                  }
                }
            );

            node.on('start', ()=>{
               node.files.add(file, (err, res) => {
                    console.log('never fires!!!');                
               });
           }); 

[daviddias]

@theD1360 what is the file var you are passing?

[daviddias]

@theD1360, @victorbjelkholm just brought up that you might be using a older version of js-ipfs, which version are you using?

[theD1360]

@diasdavid Should be using master. I added this in my package.json
"ipfs": "git@github.com:ipfs/js-ipfs.git#master",

the ipfs-api package.json shows "version": "12.1.7"

[theD1360]

Here is what is the calling snippet looks like.

              PhotoLibrary.getPhoto(libraryItem).then( (blob) => {
                console.log("Blob Size:", blob.size); // shows the blob has a size
                let reader = new FileReader();

                reader.addEventListener("loadend", function() {

                  // transform array buffer to ArrayBuffer since ArrayBuffer failed to work
                  let buf = new Buffer(reader.result.byteLength);
                  let view = new Uint8Array(reader.result);
                  for (let i = 0; i < buf.length; ++i) {
                    buf[i] = view[i];
                  }

                  // this is my own wrapper which is passing to the code you saw above.
                  ipfs.addFile({
                    path: "/testing/"+libraryItem.id, // '/testing/99D53A1F-FEEF-40E1-8BB3-7DD55A43C8B7/L0/001'
                    content:buf
                  }).then((data) => {
                    // I'm triggering a resolve to trigger this code. pls ignore
                    console.log("filedata", data);

                  }).catch((e) =>{
                    // same here
                    console.log("crap",libraryItem.photoURL,e);

                  });


                });

                reader.readAsArrayBuffer(blob);


              });

[theD1360]

@diasdavid Could this be caused by not having any peers connected? I've checked the peer connections and it comes an empty array.

[victorb]

@theD1360 could you try listening to the error event as when when you initialize your node? Could be something that is not working when initializing but you're not catching any errors so might just be silent.

[daviddias]

@theD1360 can you push a full script that reproduces the case? Since you are using your own wrappers, I can't be sure of what is going on inside.

[theD1360]

@diasdavid

https://github.com/theD1360/CygnusLoop/blob/master/src/app/app.component.ts#L136
https://github.com/theD1360/CygnusLoop/blob/master/src/providers/ipfs.ts

@victorbjelkholm logged out the errors and not getting anything.

[daviddias]

@theD1360 looks like Ionic doesn't offer a native TCP shim module or a WebSockets one (read it here: https://forum.ionicframework.com/t/tcp-sockets-in-ionic-2/67806/3). Seems like we need to create a custom transport, that supports Ionic2 networking.

See how we did TCP for Node.js -- https://github.com/libp2p/js-libp2p-tcp/ -- and how we bundle it in here: https://github.com/ipfs/js-libp2p-ipfs-nodejs/blob/master/src/index.js#L48

[theD1360]

Upon further inspection it looks like WebSockets are available in the window object not sure what else I need to get this working. I also decided to build the app for android and am getting a new error regarding secure origins on init. Is it possible that it's related to this issue? If not is there any way that I can circumvent the secure origins restriction (webrtc or something)?

I'll take some time to look into how to shim the cordova TCP module . Not 100% clear on how to do that at the moment.

[daviddias]

Ok, let's go with WebSockets first then :) We just need to make sure it exposes the same interface that one would get from using WebSockets in a browser context, if it does, then it should work like a charm.

getting a new error regarding secure origins on init

Could you tell us more?

Btw, if you can set up some custom simple apps on Ionic2 for us to have a quick sandbox to try things, that would be extremely helpful.

[theD1360]

For sure. I'll see what I can figure out as far as the websockets go. In the meantime, feel free to clone my CygnusLoop app repo. Standard ionic 2 install and build nothing fancy.

Login page is fake just enter any values. Check out the Ionic 2 docs for debugging for debugging info.

[theD1360]

Current master appears to be initializing without errors on both iOS and Android. As far as the secure origins goes it appears that it was related to ionic live reload. Still having issues with uploading to the the network but it seems to be a different issue. I'll keep this issue open until I verify that the new error is unrelated.

Thanks guys.

[daviddias]

@theD1360 if you could come up with a simple example of how to run js-ipfs in Ionic, similar to what we have for Node.js, Browser and Electron in the examples folder, then I would be more able to help you. Wanna do it?

Thanks in advance!

[Juanperezc]

Hello, someone else has worked to implement ipfs on ionic?, I'm trying but I'm having an error

[silkroadnomad]

I guess its related to "Content-Security-Policy" of Cordova and "same origin" stuffs. But I'll come back to you guys when I tried it myself.

[achingbrain]

js-ipfs is being deprecated in favor of Helia. You can #4336 and read the migration guide.

I've not kept up to date with Ionic and similar frameworks - if any participants in this thread are still using it, may I suggest creating a small project that uses Helia and we can go from there?