HTTPS is essential everywhere for security and modern web standards:
// Modern APIs work only with HTTPS
navigator.geolocation.getCurrentPosition(); // ❌ HTTP
fetch('/api/data'); // ⚠️ Mixed content on HTTPSHTTPS has become a mandatory standard of the modern web! It’s not just a recommendation, but a necessity for security and functionality. 🌐
HTTPS encrypts all data between browser and server:
// Without HTTPS data is transmitted as plain text
// POST /login HTTP/1.1
// username=admin&password=123456 ❌
// With HTTPS data is encrypted
// Encrypted traffic: 4f8b2c1a9e... ✅// Man-in-the-middle attacks
// HTTP: attacker can modify content
document.body.innerHTML = "Hacked!"; // ❌ Possible
// HTTPS: protection from content substitution ✅Many APIs work only with HTTPS:
// Geolocation
navigator.geolocation.getCurrentPosition(); // HTTPS only
// Service Workers
navigator.serviceWorker.register('/sw.js'); // HTTPS only
// Push notifications
registration.pushManager.subscribe(); // HTTPS only
// Camera and microphone
navigator.mediaDevices.getUserMedia(); // HTTPS onlyGoogle uses HTTPS as a ranking factor:
<!-- HTTPS sites get search advantage -->
<link rel="canonical" href="https://example.com/page"> ✅
<link rel="canonical" href="http://example.com/page"> ❌HTTP/2 works only with HTTPS:
// HTTP/2 benefits only with HTTPS
// - Multiplexing
// - Server Push
// - Header compression
// - Binary protocol<!-- HTTPS page with HTTP resources -->
<img src="http://example.com/image.jpg"> <!-- ❌ Blocked -->
<script src="http://cdn.com/script.js"></script> <!-- ❌ Blocked -->
<!-- Correct -->
<img src="https://example.com/image.jpg"> <!-- ✅ -->
<script src="https://cdn.com/script.js"></script> <!-- ✅ -->// HTTP sites are marked as "Not Secure"
// Chrome, Firefox, Safari show warnings
// Users don't trust such sites# Nginx configuration
server {
listen 443 ssl;
ssl_certificate /path/to/cert.pem;
ssl_certificate_key /path/to/key.pem;
# HTTP to HTTPS redirect
return 301 https://$server_name$request_uri;
}// Strict-Transport-Security
app.use((req, res, next) => {
res.setHeader(
'Strict-Transport-Security',
'max-age=31536000; includeSubDomains'
);
next();
});<meta http-equiv="Content-Security-Policy"
content="upgrade-insecure-requests">HTTPS doesn’t slow down websites:
// HTTP/2 with HTTPS is faster than HTTP/1.1
// - Parallel requests
// - Header compression
// - Server Push# Let's Encrypt - free SSL certificates
certbot --nginx -d example.com// Protocol check
if (location.protocol !== 'https:') {
location.replace('https:' + window.location.href.substring(window.location.protocol.length));
}
// Check in code
const isSecure = window.location.protocol === 'https:';❌ Wrong:
<!-- Mixed content -->
<script src="http://cdn.com/jquery.js"></script>✅ Correct:
<!-- Protocol-relative URLs -->
<script src="//cdn.com/jquery.js"></script>
<!-- Or explicit HTTPS -->
<script src="https://cdn.com/jquery.js"></script>HTTPS is not an option, but a standard of the modern web:
Switch to HTTPS today — it’s simple and free! 🚀