As a follow-up to my last post, I wanted to share a solution I discovered with the help of another developer.
tinycert.org is a great way to setup a localhost SSL. They have good documentation and the setup is easy!
Localhost SSL…what a pain!
I thought I would share some of my pain in working in my dev environment and what I went through in hopes that I might spare someone else my pain…or even better if there is someone out there who has a better solution…let me know.
I wanted to install a self-signed certificate on my dev box, which is Windows 10 / IIS 10. The issue was that Chrome, which I use a ton for my web dev work, was not liking it. I was receiving the typical…”This site is not safe!” message. I looked into the dev tools and found this…
I then added the cert to the trusted authority area…no joy.
I also looked into Let’s Encrypt…nope and OpenSSL. This had/has promise, but is rather a convoluted setup for dev work and appears to favor an OSx environment (but that is my opine…I favor OSx myself).
So, in the end, I used a ‘hacky’ workaround. Chrome has a flag that can be enabled to avoid this issue…
chrome://flags/#allow-insecure-localhost
This does not get rid of the ugly red warning in the address bar, but it does get rid of the interruptive warning message that the user receives.
Again…if anyone out there has a better solution, please let me know.
Who are you?
When utilizing forms, it is helpful to use a combination of the ID and name attributes, I typically name and ID my form and nearly all of my form fields so it is easy to manage them programmatically. Here is an example:
1 2 3 4 5 6 | <form id="contactForm" name="contactForm"> <input id="firstName" name="firstName" type="text"> <input id="lastName" name="lastName" type="text"> <input id="phone" name="phone" type="tel"> <input id="submit" name="submit" type="button" value"Contact Us"> </form> |
Accessing via ID or Name
As you can see, I made both the names and IDs the same. The reason I do this is because sometimes you use the ID in JavaScript to grab a field and in form processing, the form object, which is accessed via the name attribute, is used.
To access a field by ID:
1 | document.getElementByID("firstName").value; |
To access a field via the name attribute:
1 | document.formObject["firstName"].value; |
Either one is a valid access method, but with forms and their processing, the form object is typically easier and used more often.
Happy Coding!
Clay Hess