今天來教大家部署一個(gè)屬于自己的第一個(gè)靜態(tài)網(wǎng)站，因?yàn)檫@里借助小程序云開發(fā)的靜態(tài)服務(wù)器資源，所以可以輕松的實(shí)現(xiàn)自己網(wǎng)站的部署，部署完以后可以在電腦瀏覽器，手機(jī)瀏覽器，微信公眾號(hào)里面展示。

老規(guī)矩，先看效果圖

簡單起見，我這里寫一個(gè)最簡單的html靜態(tài)網(wǎng)頁

然后把這個(gè)網(wǎng)頁部署到云開發(fā)靜態(tài)網(wǎng)站上 微信上訪問效果如下

手機(jī)瀏覽器上訪問如下

這也就意味著，我們的網(wǎng)站可以供用戶在任何地方訪問。下面就來教大家如何快速的部署一個(gè)屬于自己的網(wǎng)站。

一，開通云開發(fā)

這里開通云開發(fā)我們借助小程序開發(fā)者工具來實(shí)現(xiàn)快速開通。

1-1，注冊(cè)小程序

這里我就不再多說了，只有注冊(cè)過小程序的appid才可以開通云開發(fā)

我們注冊(cè)好小程序后，就可以拿到appid了，如上圖

1-2，創(chuàng)建一個(gè)小程序項(xiàng)目

小程序項(xiàng)目的創(chuàng)建，我這里不再多說，我前面小程序基礎(chǔ)課里有講過很多遍?！缎〕绦蚧A(chǔ)學(xué)習(xí)》

這里強(qiáng)調(diào)一點(diǎn)，就是創(chuàng)建小程序項(xiàng)目時(shí)一定要用我們自己的appid不要用測試號(hào)。

如果你一開始是用測試appid創(chuàng)建的，也可以通過上圖的方式更換成自己的小程序的appid。

1-3，開通云開發(fā)

這里云開發(fā)的開通，我就不做過多講解了，我云開發(fā)課程里也講過很多遍。大家可以去翻看下

只需要點(diǎn)擊開發(fā)者工具里的云開發(fā)按鈕，跟著提示一步步操作就可以快速開通云開發(fā)。

二，開通靜態(tài)網(wǎng)站功能

我們上面云開發(fā)開通好以后，就可以在這里快速開通靜態(tài)網(wǎng)站了。

點(diǎn)擊以后，直接點(diǎn)擊開通即可

這時(shí)候開通有個(gè)條件

我們必須按照要求改變自己小程序的付費(fèi)方式，把我們的付費(fèi)方式改成按量付費(fèi)即可。

這個(gè)時(shí)候我們的靜態(tài)網(wǎng)站功能就開通成功了。

開通成功以后如下圖。

這個(gè)時(shí)候我們就可以把我們開發(fā)好的靜態(tài)網(wǎng)頁上傳到網(wǎng)站供別人訪問了。

三，部署網(wǎng)站

我們的靜態(tài)html如下

點(diǎn)擊上傳文件，把我們的index.html文件上傳到靜態(tài)網(wǎng)站

這樣就代表上傳成功了。

訪問我們的網(wǎng)站

上面把網(wǎng)頁部署成功以后，我們就可以通過云開發(fā)為我們創(chuàng)建的默認(rèn)網(wǎng)址來訪問了。

點(diǎn)擊上圖所示的詳情，就可以拿到訪問我們網(wǎng)站的網(wǎng)址如下

上圖箭頭所示的網(wǎng)址，就是我們網(wǎng)頁的訪問網(wǎng)址。

如果你的html是以index命名的，我們使用云開發(fā)為我們分配的域名，就可以直接訪問我們的網(wǎng)站。

study-gas4x-1258760189.tcloudbaseapp.com 就是云開發(fā)為我分配的網(wǎng)站域名，以后用戶就可以直接通過這個(gè)域名訪問我們的網(wǎng)站了。 其實(shí)到這里我們就可以成功的部署屬于我們自己的網(wǎng)站了，無非就是你網(wǎng)頁寫的比石頭哥再好看些。

但是有些同學(xué)覺得官方給分配的域名太長，不好記，想使用自己的域名。那么我們?cè)撊绾闻渲米约旱挠蛎兀?/p>

四，配置域名（選看）

其實(shí)前面3步就可以成功的部署自己的網(wǎng)站了，如果你有自己的域名，并且也成功的備案了，再來跟著石頭哥學(xué)習(xí)這一節(jié)。如果沒有自己的域名，那么你就要先去注冊(cè)自己的域名，并備案了。所以這一節(jié)作為一個(gè)選學(xué)。

4-1，在網(wǎng)站配置里添加自己的域名

如我在這里點(diǎn)擊添加域名，然后添加自己的備案域名。

但是我們這里要想https來安全訪問，就必須配置自己的ssl證書。

點(diǎn)完以后，我們這里可以直接申請(qǐng)免費(fèi)證書。免費(fèi)證書有效期1年，1年后我們?cè)僦匦律暾?qǐng)新的證書就可以了，所以這里免費(fèi)的就夠用了。

如實(shí)的填寫自己的備案域名和其余信息。

提交完資料，我們這里需要驗(yàn)證下自己的域名，驗(yàn)證方式選擇DNS就可以

點(diǎn)位DNS驗(yàn)證，我們就需要給我們的域名配置訪問的解析值了（這里的知識(shí)點(diǎn)比較深?yuàn)W，大家需要自己課下惡補(bǔ)下域名解析的相關(guān)知識(shí)點(diǎn)）如果不想學(xué)習(xí)，直接根據(jù)提示配置也行。

配置好以后，就可以點(diǎn)擊驗(yàn)證先進(jìn)行驗(yàn)證了

驗(yàn)證通過后，可以看到如下

云開發(fā)控制臺(tái)也會(huì)顯示部署中，我們耐心等待部署就可以了。

啟動(dòng)成功會(huì)有如下標(biāo)識(shí)

雖然已經(jīng)啟動(dòng)成功，我們?nèi)绻胪ㄟ^自己的域名訪問自己的云開發(fā)靜態(tài)網(wǎng)站，還需要配置下CNAME進(jìn)行重定向，也就是訪問我們域名的時(shí)候我們要重定向到云開發(fā)給我們分配的域名。

這里理解起來有點(diǎn)晦澀，官方給的文檔也是沒有講明白，我也是試了很多遍才知道是這樣配置的。這里都配置好以后，我們就可以直接通過自己的域名訪問網(wǎng)站了。

大家也可以去訪問下石頭哥的云開發(fā)靜態(tài)網(wǎng)站試一試。

到這里我們的網(wǎng)站部署就講完了，后面我會(huì)用vue寫一些炫酷的網(wǎng)站，然后部署到線上供大家觀賞。 好了，今天就講到這里吧，要過周末了。