Updated: "CDN" starter kit using IPFS

In August, I made a tutorial about Making a “CDN” with IPFS, which is very inefficient, slow, and annoying to setup.

So I made this:

ipfs-cdn


Setup a CDN powered by IPFS on Glitch!

  1. Remix this project here
  2. Add your files to the _files folder
  3. Check the logs. You should see a line that looks like this:
ℹ 🔗  QmXXdVAWhA8hJv9nr7mPWBx23onw4k7XcQwJw8zmTisDd7 (​https://ipfs.infura.io/ipfs/QmXXdVAWhA8hJv9nr7mPWBx23onw4k7XcQwJw8zmTisDd7/​)

The https://ipfs.infura.io/ipfs/(hash) is your new “CDN” link. Enjoy!

Example: https://cdn.aboutdavid.me/ (I used CloudFlare’s DNS to use a custom domain. Learn more here)

2 Likes

I am going to try IPFS for once :smiley:

1 Like

But what did I say?

Yes I know, I read the whole post as it’s literally less than 10 words.

1 Like

Is there a way to do this on the client?

What do you mean?

For use on static pages, so it has 24/7 uptime.

Or is it a package and can’t

It’s a NPM package so it can’t. Also, your project does not need to be online all of the time, just if your URL seems slow/not loading at all.

Moved to #tutorials.

This is more of a completed project because I made a starter kit, not a tutorial

This looks much like a tutorial to me. Feel free to move this back though.

1 Like

I mean I can make it even simpler tho

Can you add how to do the custom domain?

It’s a Cloudflare workers script.

addEventListener("fetch", (event) => {
  // Config
  var your_domain = "cdn.aboutdavid.me";
  var gateway = "gateway.ipfs.io";
  
  
  // Base code
  var path = event.request.url.split("/").slice(3).join("/").toString();
    return event.respondWith(
      fetch(`https://${gateway}/ipns/${your_domain}/repo/${path}`)
    );

});

I’m not finished with it, but still. You will also need to setup Cloudflare DNS with IPFS Deploy
https://github.com/ipfs-shipyard/ipfs-deploy#cloudflare-dns and add -d cloudflare to the start script.

image

Odd, where should I put my tokens?

Your .env file. That’s kind of weird as it worked with Netlify.

These are in my .env file.

Did you put all three of them? Because I think you have to one or the other.

Hmm, its still not working. Is the dotenv package installed.

No, I didn’t intend for it to be installed, but i’ll add it.