Helia with Angular

[YugasVasyl]

I'm having trouble running Helia with Angular.
Whenever I call createHelia();, I get several errors in the console like WebTransportError: Connection lost. and then the browser tab crashes. I've tried different Angular versions and deploying the code to a server, but I still get the same result.
I have tried to use Helai examples, and they work for me.
What I'm doing wrong? Are there any other alternatives to read/write to ipfs?

[paschal533]

Hello
Which version of Angular and Helia are you using?
Try and Implement more robust error handling around your createHelia() call to catch and manage exceptions that may be causing the browser to crash. Since you’re getting WebTransportError, ensure that your WebTransport or WebSocket configuration in your Angular app is set up correctly. and If you’re using SSR with Angular, it might affect how client-side code interacts with the browser. Make sure Helia is initialized only on the client-side.

If Helia continues to be problematic, consider these alternatives for interacting with IPFS: IPFS HTTP Client and web3.storage.

[SgtPooki]

it would be nice if we had an example for devs. see ipfs-examples/helia-examples#308

[SgtPooki]

@YugasVasyl can you share more information about how your browser tab is crashing? Could you share the code you're using so we can try to reproduce?

[YugasVasyl]

@SgtPooki @paschal533 I no longer work with Helia, I will probably use some 3th party service like Pinata to store files. About error - it looks like it always crashes Chrome when I call createHelia(); and it's unrelated to Angular. Probably because of missing configuration for WebTransport or WebSocket

[SgtPooki]

@YugasVasyl Ok thank you for the update. FYI: permanent storing of files in the browser isn't a great plan, and you should always be running a backend node somewhere (your own, pinata, lighthouse, web3.storage, etc..) in order to ensure content stays available.

I'll close this for now, but if you have the old code you can share so we can investigate the crash that would be great.

[YugasVasyl]

@SgtPooki to reproduce it - open any Angular (but I believe it's general issue, not only Angular) project, install helia package (my current local version is 4.2.2), import it and run. I just checked it - it still crashes browser tab. I understand I need to setup additional things, but it looks not ok.

import { createHelia } from 'helia'

createHelia();

[paschal533]

@SgtPooki to reproduce it - open any Angular (but I believe it's general issue, not only Angular) project, install helia package (my current local version is 4.2.2), import it and run. I just checked it - it still crashes browser tab. I understand I need to setup additional things, but it looks not ok.

import { createHelia } from 'helia'

createHelia();

Hi @YugasVasyl , the browser issue you encountered while integrating Helia into your Angular project has been resolved. You can find the solution in this Helia Angular Example PR. Feel free to check it out when you're ready to integrate Helia into your project.