Files
nip/document_root/index.html
2015-09-18 13:06:45 -07:00

201 lines
8.3 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>
<h4><i><b></b></i></h4>
<h3>Turn your red lock into a green lock!</h3>
<div class="alert alert-danger" role="alert">
<span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
<span class="sr-only">Error:</span>
2015-09-12: <b>This service is no longer available</b>.
The original certificate for the sslip.io domain has
been revoked and a new one issued on the condition that
the private key not be published. <i>Pivotal Software employees
may access the key via <a style="color:#800;" href="https://drive.google.com/open?id=0ByweFu4TspftMWJPdE1US0hQTGc">Google Drive</a></i>.
If you're interested in deploying a custom version of
sslip.io, follow
<a style="color:#800;" href="https://github.com/cloudfoundry-community/xip-release#deploying-a-custom-version-of-xip-to-amazon-aws">
these instructions</a>.
</div>
<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
&amp; key</p>
<p>Configure the server's configuration file's SSL portion
to use the SSL certificate &amp; 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>Here's a similar configuration for Apache 2.4's <i>httpd-ssl.conf</i>:</p><pre>
Listen 443
SSLCertificateFile "/etc/ssl/sslip.io.chained.crt.pem"
SLCertificateKeyFile "/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>&copy; 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>