scripting / drummerSupport

Support for Drummer users.
19 stars 0 forks source link

Testing HTTPS #78

Open tmanternach opened 3 years ago

tmanternach commented 3 years ago

I saw on Dave's Drummer change notes that he posted about HTTPS today. Here is my experience with making this work.

Preface: I am going to assume you already have (or know how to create) an SSL certificate for your domain. If you need a nudge, Google your web server (Apache/nginx) and "Lets Encrypt" for tons of instructions on how to deploy a free one. All of my experience is with a DigitalOcean VPN running Ubuntu and nginx. You can visit my working site here.

I'd love to help anyone else work through this!

  1. You need to host the 3 template files listed in the Drummer docs yourself. These are index.html, styles.css, and code.js. They are discussed in the Drummer docs here.
  2. These files need to be accessible on the internet via https. I did this using a sub-domain (so you technically would need 2 SSL certificates). I couldn't figure out a clean way to server these from the same domain I am using for Drummer.
  3. You need to edit your index.html template file and replace all the references to fargo.io and scripting.com with the s3.amazonaws.com/fargo.io and s3.amazonaws.com/scripting.com equivalents. Here is what my index.html file looks like after those edits. The reason for this is so these files get downloaded via https in your browser. If not, modern browsers don't allow for "mixed content" (the main page loaded via https but script/resources loaded via http).
  4. Once your index.html is accessible via https, you need to add a "urlTemplate" OPML header to your blog.opml. This is done by clicking File->Edit OPML Headers in Drummer and clicking the plus button. The value of mine, for example, is "https://static.trevormanternach.com/index.html"
  5. You need to configure your web server properly to 1) proxy your main blog to your oldschool.script.com url and 2) serve your 3 template files via https. Here is my nginx config for doing all of this.

Cheers; have a good weekend everyone!

dcoletta commented 3 years ago

Agreed. I hunted around a bit to see if I could find a smoking gun, but I couldn't.

It might be related to how easy I found it to accidentally edit the OPML headers of the wrong tab in the editing environment. E.g., editing the headers of the about outline when I meant to edit the headers of the blog outline.

I suspect I would make this error less often if the popup for editing OPML headers showed the name of the outline whose headers I was editing right there in the title.

scripting commented 3 years ago

I suspect I would make this error less often if the popup for editing OPML headers showed the name of the outline whose headers I was editing right there in the title.

We can do that.

scripting commented 3 years ago

image

jackbaty commented 3 years ago

I'm still using my own template, so I just merged from Dave's repo into mine and pushed it out to my static host and all is well. The about page is working on https://rudimentarylathe.org/. Thanks!

sabre23t commented 3 years ago

scripting wrote:

I've got the About tab working in the Clueless Newbie blog without doing a read through the proxy server. ... So the About outline is baked into the page.

I found that current drummer v2.0.10 doesn't show images in About page set by item "image" or "inlineImage" attributes. Even when the image is on scripting.com site. I'm just using the default templates. The console log show "viewAboutTab: using the pre-built aboutOutline" but doesn't show any error.

Ref my blog about page. I've managed to show one image using html "<img src= >" tag.

scripting commented 3 years ago

@sabre23t — that’s correct. It uses a different renderer. You can as you discovered use an html image element.