服務器託管如何基於IPFS建一個靜態網站
用戶將主機用作網站站點是最常見的做法了。這裏介紹一個搭建靜態網站的方法。
1 常見的html頁面，通常由 html，css，js文件構成
創建一個文件夾來存放我們頁面：demo
在文件夾下面創建一個文件 index.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">
<title>Hello IPFS</title>
<!-- Bootstrap -->
<link href="./bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-xs-12">
<h1 style="text-align: center">Hello IPFS!</h1>
</div>
<div class="col-xs-12">
<h3 style="text-align: center">飛向未來</h3>
</div>
<div class="col-xs-12">
<h3 style="text-align: center">時間：2017-12-26 19:35</h3>
</div>
<div class="col-xs-12">
<h3 style="text-align: center">微信公衆號: IPFS指南(ipfs_guide)</h3>
</div>
<div class="col-xs-12">
<img src="./wechat_mp.jpeg" class="img-rounded img-responsive center-block">
</div>
</div>
</div>
<script src="./jquery.min.js"></script>
<script src="./bootstrap.min.js"></script>
</body>
</html>
本文使用了bootstrap框架進行排版，把bootstrap文件同時放到文件夾demo下面。
於是你的文件夾結構如下：
demo:
--- index.html
--- bootstrap.min.
--- cssbootstrap.min.js
--- jquery.min.js
--- style.css
--- wechat_mp.jpeg
一個網站具備的全部元素都在這裏了。
2 發佈網站到IPFS上面
根據之前文章介紹的方法，如果你的IPFS節點沒有啓動，首先要執行 ipfs daemon 啓動節點，只有節點啓動才能與其它節點建立連接，把你的網站發佈出去。
命令行定位到文件夾的上層文件夾，執行
ipfs add -r demo
返回值如下：
localhost:Desktop tt$ ipfs add -r demo
added QmYUaCPwvJWiueRXFSTTv8vdedWWzRhRdn8RMw35e7k67u demo/bootstrap.min.css
added QmNXRFREw7waGtKW9uBUze3PkR9E12HeeAQSkZQSiFUJqo demo/bootstrap.min.js
added QmaoVnNzLmM23M9EAGk7vPJMN2MHLUJQNT8Rs4nVWr2nPG demo/index.html
added QmWS8GZ4yk69ZHtBWx9RwSGc6WW7DMeCVmc74iVYnC5WQC demo/jquery.min.js
added QmZjV1QuvTkVcaR1qkvxM2RjCicYx2B8tVKLgEx8V7TUgV demo/style.css
added QmNrDoGiTMpZmmbMq1ocZvoQ7vRbZqybpe2vrvbnW6fvXb demo/wechat_mp.jpeg
added QmYaGz9ChV3PcRuz3Zmr8XP34gxAe2gunZdtM7sKhDMqUS demo
這是小編的電腦上的輸出結果，你的可能會不一樣。除非你嚴格的跟小編的內容一致，IPFS是內容尋址，只要內容完全一樣，生成的哈希值就一樣。
3 查看你發佈的網站
上面輸出的最後一行，demo的文件夾哈希值，就是你的網站的根目錄，可以使用http://ipfs.io提供的網關查看https://ipfs.io/ipfs/QmYaGz9ChV3PcRuz3Zmr8XP34gxAe2gunZdtM7sKhDMqUS
截止到現在我們完成了網站的發佈，是不是很簡單。
http://ipfs.io網關最近有點不太穩定，可能打開的時間稍長
4 IPNS
哈希跟ip地址一樣難以記憶和傳播，ipfs提供ipns來解決這個問題，ipns允許爲哈希地址綁定域名，很簡單，只需要在域名解析裏面添加一條TXT記錄即可：
dnslink=/ipfs/<your_hash>
例如小編的哈希地址是 QmYaGz9ChV3PcRuz3Zmr8XP34gxAe2gunZdtM7sKhDMqUS
TXT解析的值爲： dnslink=/ipfs/QmYaGz9ChV3PcRuz3Zmr8XP34gxAe2gunZdtM7sKhDMqUS
一旦域名解析生效，那麼我們可以通過 http://ipfs.io/ipfs/your.domain 來訪問網站了。
5 域名綁定
每次發佈，只要內容有變化（如果沒變化，你也不會重新發佈網站），那麼生成的哈希一定是不一樣的，那樣我們是不是要每次都去設置一下DNS的TXT解析呢？當然不用，如果這樣子，這個技術就沒有存在的必要了，ipns支持現有的域名系統。
我們可以爲我們的網站綁定已有的域名：
第一步：執行：ipfs name publish your_hash，your_hash是剛纔生成的文章根目錄demo文件的哈希地址
localhost:Desktop tt$ ipfs name publish QmYaGz9ChV3PcRuz3Zmr8XP34gxAe2gunZdtM7sKhDMqUS
Published to QmaiXZeg5PQ2CqojCTCHi9ftmPJmhiC6kRYKDx4TJ3Frxu: /ipfs/QmYaGz9ChV3PcRuz3Zmr8XP34gxAe2gunZdtM7sKhDMqUS
ipfs name publish命令後面的的哈希值就是網站根文件目錄 demo的哈希值。命令的輸出分爲兩部分，意思是把你的地址 /ipfs/QmYaGz9ChV3PcRuz3Zmr8XP34gxAe2gunZdtM7sKhDMqUS 發佈到了你的 節點IDQmaiXZeg5PQ2CqojCTCHi9ftmPJmhiC6kRYKDx4TJ3Frxu下面。
第二步：查看解析是否生效 ipfs name resolve your_id_hash
localhost:Desktop tt$ ipfs name resolve QmaiXZeg5PQ2CqojCTCHi9ftmPJmhiC6kRYKDx4TJ3Frxu
/ipfs/QmYaGz9ChV3PcRuz3Zmr8XP34gxAe2gunZdtM7sKhDMqUS
可以執行 ipfs id隨時查看你的節點ID。這個時候我們就可以使用節點ID來訪問網站，http://ipfs.io/ipns/QmaiXZeg5PQ2CqojCTCHi9ftmPJmhiC6kRYKDx4TJ3Frxu/，注意這裏使用的是ipns，而不是ipfs。
因爲我們節點ID是不會發生變化的，以後每次更新完網站，只需要發佈一次ipfs name publish就可以重新進行綁定。我們訪問的地址就會一直保持不變。
第三步：綁定域名
既然我們有了一個不會發生變化哈希，那麼域名綁定就變得簡單了。修改我們上面的DNS的TXT解析值：
dnslink=/ipns/IDQmaiXZeg5PQ2CqojCTCHi9ftmPJmhiC6kRYKDx4TJ3Frxu
·如果你自己運行有ipfs節點，可以在域名解析裏面添加A記錄，指向自己運行ipfs節點的主機即可。
·如果你不想運行自己的ipfs節點，仍然可以藉助於IPFS官網提供的網關地址 http://gateway.ipfs.io，在域名解析裏面建立一條CNAME記錄，將解析指向 http://gateway.ipfs.io，同時建立一條TXT記錄指向 _dnslink.your.domain 指向 dnslink=/ipns/<你的節點ID>
等待解析生效
然後，你就可以使用自己的域名來訪問網站了。
最後，每次網站有更新，執行 ipfs add 後，需要執行一次 ipfs name publish重新發布一下，就可以了。