mirror of
https://github.com/cunnie/sslip.io.git
synced 2025-10-05 23:56:50 +08:00
178 lines
7.2 KiB
HTML
178 lines
7.2 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width,
|
|
initial-scale=1">
|
|
<!-- The above 3 meta tags *must* come first in the head; any
|
|
other head content must come *after* these tags -->
|
|
<title>Welcome to sslip.io</title>
|
|
<meta name="description" content="sslip.io">
|
|
<meta name="author" content="Brian Cunnie">
|
|
<!-- cute Green Lock icon -->
|
|
<link rel="shortcut icon" type="image/x-icon" href="img/favicon.ico">
|
|
<!-- Latest
|
|
compiled and minified CSS -->
|
|
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
|
|
<!--
|
|
Optional theme -->
|
|
<link rel="stylesheet" href="css/starter-template.css">
|
|
<!--
|
|
HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
|
|
<!--
|
|
WARNING: Respond.js doesn't work if you view the page via file:// -->
|
|
<!--[if lt
|
|
IE 9]> <script
|
|
src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> <script
|
|
src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> <![endif]-->
|
|
</head>
|
|
|
|
<body>
|
|
<nav class="navbar navbar-inverse navbar-fixed-top">
|
|
<div class="container">
|
|
<div class="navbar-header">
|
|
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
|
|
data-target="#navbar" aria-expanded="false" aria-controls="navbar">
|
|
<span class="sr-only">Toggle navigation </span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button> <a class="navbar-brand" href="/">sslip.io</a> </div>
|
|
<div id="navbar" class="collapse navbar-collapse">
|
|
<ul class="nav navbar-nav">
|
|
<li class="active"><a href="/">Home</a></li>
|
|
<li><a href="faq.html">FAQ</a></li>
|
|
<li><a href="about.html">About</a></li>
|
|
</ul>
|
|
</div>
|
|
<!--/.nav-collapse -->
|
|
</div>
|
|
</nav>
|
|
<div class="container">
|
|
<div class="starter-template">
|
|
<h1>sslip.io</h1>
|
|
<h3>Turn your red lock into a green lock!</h3>
|
|
<br />
|
|
<div class="col-sm-5">
|
|
<img src="img/red_lock.png" height="71" /> </div>
|
|
<div class="col-sm-1">
|
|
<p></p>
|
|
</div>
|
|
<div class="col-sm-5">
|
|
<img src="img/green_lock.png" height="71" /> </div>
|
|
<div class="col-sm-1"></div>
|
|
<div class="row"></div>
|
|
<h3>What is it?</h3>
|
|
<p><b>sslip.io</b> is a means for developers to test against
|
|
valid SSL certificates without the bother of purchasing
|
|
them. Two components make this possible:</p>
|
|
<ol>
|
|
<li>a special DNS backend that maps crafted hostnames to
|
|
IP addresses (e.g. <i>192-168-0-1.sslip.io</i> resolves
|
|
to <i>192.168.0.1</i>) (similar to xip.io)</li>
|
|
<li>a wildcard SSL certificate for *.sslip.io and the corresponding
|
|
key, both downloadable from GitHub</li>
|
|
</ol>
|
|
<p>Install the certificate and key on the
|
|
server, modify the server's configuration to use the certificate and key, and restart
|
|
the daemon. After that, browse the server
|
|
using the sslip.io hostname via HTTPS (e.g.
|
|
<a href="https://52-0-56-137.sslip.io">https://52-0-56-137.sslip.io</a>)
|
|
and receive a valid SSL connection (green lock), all in a matter of seconds. </p>
|
|
<h3>How do I use it? </h3>
|
|
<p class="lead">First, find your server's IP address to determine its sslip.io
|
|
hostname</p>
|
|
<p>Your server's sslip.io hostname is a mash-up of your server's
|
|
IP address and the <b>sslip.io</b> domain. Here are some
|
|
examples:</p>
|
|
<table class="sslip">
|
|
<tr>
|
|
<th>Server's IP Address</th>
|
|
<th>sslip.io Hostname</th>
|
|
</tr>
|
|
<tr>
|
|
<td>127.0.0.1</td>
|
|
<td>127-0-0-1.sslip.io</td>
|
|
</tr>
|
|
<tr>
|
|
<td>192.168.1.80</td>
|
|
<td>192-168-1-80.sslip.io</td>
|
|
</tr>
|
|
<tr>
|
|
<td>172.16.0.80</td>
|
|
<td>172-16-0-80.sslip.io</td>
|
|
</tr>
|
|
<tr>
|
|
<td>52.0.56.137</td>
|
|
<td><a href="https://52-0-56-137.sslip.io/">52-0-56-137.sslip.io</a></td>
|
|
</tr>
|
|
</table>
|
|
<br />
|
|
<p class="lead">Second, download sslip.io's SSL certificate and key from
|
|
GitHub</p>
|
|
<p>Download the SSL key (<a href="https://raw.githubusercontent.com/cunnie/sslip.io/master/ssl/sslip.io.key.pem">sslip.io.key.pem</a>)
|
|
and wildcard SSL certificate chain (<a href="https://raw.githubusercontent.com/cunnie/sslip.io/master/ssl/sslip.io.chained.crt.pem">sslip.io.chained.crt.pem</a>)
|
|
from GitHub. You may use <i>curl</i> if you prefer the
|
|
command line:</p> <pre>
|
|
curl -OL https://raw.githubusercontent.com/cunnie/sslip.io/master/ssl/sslip.io.key.pem
|
|
curl -OL https://raw.githubusercontent.com/cunnie/sslip.io/master/ssl/sslip.io.chained.crt.pem</pre>
|
|
<p class="lead">Third, configure the webserver with the SSL certificate
|
|
& key</p>
|
|
<p>Configure the server's configuration file's SSL portion
|
|
to use the SSL certificate & key downloaded from
|
|
GitHub. Here is a sample from sslip.io's webserver's
|
|
<i>nginx.conf</i> (modified for clarity):</p> <pre>
|
|
server {
|
|
listen 443 ssl;
|
|
ssl_certificate /etc/ssl/sslip.io.chained.crt.pem;
|
|
ssl_certificate_key /etc/ssl/sslip.io.key.pem;</pre>
|
|
<p class="lead">Finally, restart your webserver and browse to its sslip.io
|
|
address via HTTPS</p>
|
|
<p>Browse to your webserver's sslip.io hostname, e.g. <a href="https://52-0-56-137.sslip.io">https://52-0-56-137.sslip.io</a> (assuming that 52.0.56.137 is the IP address of your
|
|
webserver, which it isn't because that's the IP address
|
|
of <i>our</i> webserver). Admire the beautiful green
|
|
lock in your browser's address bar.</p>
|
|
<div class="row">
|
|
<p></p>
|
|
</div>
|
|
<p>© 2015 Brian Cunnie, Pivotal Software</p>
|
|
</div>
|
|
</div>
|
|
<!-- /.container -->
|
|
<!--
|
|
Bootstrap core JavaScript ================================================== -->
|
|
<!--
|
|
Placed at the end of the document so the pages load faster -->
|
|
<!-- jQuery
|
|
(necessary for Bootstrap's JavaScript plugins) -->
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
|
|
<!--
|
|
Latest compiled and minified JavaScript -->
|
|
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
|
|
<!--
|
|
IE10 viewport hack for Surface/desktop Windows 8 bug -->
|
|
<script src="https://raw.githubusercontent.com/twbs/bootstrap/master/docs/assets/js/ie10-viewport-bug-workaround.js"></script>
|
|
<!--
|
|
Google Analytics -->
|
|
<script>
|
|
(function(i, s, o, g, r, a, m) {
|
|
i['GoogleAnalyticsObject'] = r;
|
|
i[r] = i[r] || function() {
|
|
(i[r].q = i[r].q || []).push(arguments)
|
|
}, i[r].l = 1 * new Date();
|
|
a = s.createElement(o), m = s.getElementsByTagName(
|
|
o)[0];
|
|
a.async = 1;
|
|
a.src = g;
|
|
m.parentNode.insertBefore(a, m)
|
|
})(window, document, 'script',
|
|
'//www.google-analytics.com/analytics.js', 'ga');
|
|
ga('create', 'UA-43107212-2', 'auto');
|
|
ga('send', 'pageview');
|
|
</script>
|
|
</body>
|
|
|
|
</html>
|