What's the right way to deploy JS/CSS into CDN?

help
1

Hi folks,

I’m following this package https://github.com/nitrolabs/meteor-cdn/ and failed for S3/Cloudfront.

Does meteor-cdn package to update the big JS/CSS files to S3/Cloudfront? If yes, how to setup S3/Cloudfront to allow this kind of uploading. I enabled HTTP PUT/GET etc for Cloudfront and upload/delete for S3. But still failed to see any uploading to S3/Cloudfront.

Need we upload static resources like JS/CSS fiels to S3/Cloudfront manually?

Or any other good solutions for this JS/CSS CDN deployment?

Thanks,
-Bryan

2

Hi, Bryan,

As for S3, it seems to be easy without installing any additional packages. All you have to do is to make client side into static hosting compatible and manually upload it to S3. You can do it all from the bash script.

3

With Cloudfront, you can set the origin to your website (so cache miss will look for the files on your website and then cache things, and you don’t have to upload files to your cdn/s3 directly), and then do

Meteor.startup(function () {
  WebAppInternals.setBundledJsCssPrefix('myCDNRootAddress');
  WebApp.rawConnectHandlers.use("/public", function(req, res, next) {
    res.setHeader("Access-Control-Allow-Origin", "*");
    return next();
  });
});

Also, make sure to not cache allowed origin header in cloudfront as explained in http://joshowens.me/using-a-cdn-with-your-production-meteor-app/

And it doesn’t work very well for fonts

1 Like
4

Thanks a lot, Alexandr and Guillaume.

This is really helpful and I confirm this works fine with me now. Even my server clusters has 1 nginx and 2 application servers.

I forget to setup origin and behavior in my Cloudfront service which is using for other static files. I created a new cloudfront service just for JS/CSS and followed the blogs.

Now my app works fine with JS/CSS deployed in Cloudfront CDN.

Thanks,
-Bryan

2 Likes