今天看到阿里云有一個《借助OSS搭建在線教育視頻課程分享網(wǎng)站》的課程，記錄一下里面的內(nèi)容。
首先是創(chuàng)建一個資源,大概要等1-2分鐘。
1. 創(chuàng)建資源
開始實驗之前，您需要先創(chuàng)建相關(guān)實驗資源。
在體驗實驗室，單擊創(chuàng)建資源。
（可選）在實驗室頁面左側(cè)導(dǎo)航欄中，單擊云產(chǎn)品資源列表，可查看本次實驗資源相關(guān)信息（例如IP地址、用戶信息等）。 說明：資源創(chuàng)建過程需要1~3分鐘。
好家伙，創(chuàng)建完資源之后是一張……圖片？
接著我注意到了底部的邊框和左上角的快捷方式，我以為只是一個frame內(nèi)嵌網(wǎng)頁罷了……沒想到……
好家伙，我直呼好家伙，原來是云電腦，怪不得要等個兩分鐘，原來是初始化云電腦去了。
OK，時間已經(jīng)浪費了10分鐘了。
需要的東西都可以在左邊找
2. 連接ECS服務(wù)器
本步驟將指導(dǎo)您如何使用Workbench遠(yuǎn)程連接ECS服務(wù)器。
雙擊打開虛擬桌面的Chromium瀏覽器。
在RAM用戶登錄框中單擊下一步，并復(fù)制粘貼頁面左上角的子用戶密碼到用戶密碼輸入框，單擊登錄。
復(fù)制下方地址，在Chromium瀏覽器打開新頁簽，粘貼并訪問云服務(wù)器ECS控制臺。
https://ecs.console.aliyun.com在左側(cè)導(dǎo)航欄中，選擇實例與鏡像>實例。
在實例頁面頂部，選擇資源所在地域。例如下圖中，地域切換為華東2（上海）。
在實例頁面，找到您的ECS實例，單擊操作列下的遠(yuǎn)程連接。
說明：您可在云產(chǎn)品資源列表中查看目標(biāo)實例的實例ID。
在連接與命令對話框的通過Workbench遠(yuǎn)程連接區(qū)域中，單擊立即登錄。
在登錄實例對話框中，輸入ECS服務(wù)器的密碼，單擊確定。
說明：您可以在云產(chǎn)品資源列表中查看到您的ECS服務(wù)器密碼。
返回如下頁面，表示您已經(jīng)成功遠(yuǎn)程連接到ECS服務(wù)器。
3. 創(chuàng)建在線教育網(wǎng)站界面
本步驟將指導(dǎo)您創(chuàng)建HTML，創(chuàng)建完成后，通過瀏覽器訪問相應(yīng)地址，可看到在線教育網(wǎng)站。
在ECS命令行界面，復(fù)制并執(zhí)行以下命令，將在根目錄下創(chuàng)建新目錄。
mkdir /alidata/www/default/edu執(zhí)行命令后，將返回如下界面。
復(fù)制并執(zhí)行以下命令，命令行將跳轉(zhuǎn)到如下界面，在此可編輯index.html文件。
vim /alidata/www/default/edu/index.html
按下 i 鍵進(jìn)入編輯模式。
將如下代碼復(fù)制并粘貼：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>在線教育</title>
<meta name="keywords" content="在線教育">
<meta name="description" content="在線教育">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<!--Favicon-->
<link rel="shortcut icon" href="" title="Favicon">
<style>
@media all and (orientation : portrait) {
/*豎屏*/
.mypic {
width: 80%;
}
}
@media all and (orientation : landscape) {
/*橫屏*/
.mypic {
width: 40%;
}
}
a {
color: #000000;
}
a:link {
color: #000000;
}
a:visited {
color: #000000;
}
a:hover {
color: #000000;
}
a:active {
color: #000000;
}
</style>
</head>
<body style=" font-family: 'Microsoft JhengHei UI';">
<div id="wrapper" style=" margin: 0 15px; padding: 15px 0; position: relative;">
<div style="padding:20px;">
<p><font size="10" color="green">在線教育網(wǎng)</font></p>
<p><font size="3" >您貼身的教育管家</font></p>
</div>
<p style="text-align:center"><font size="6" color="green">您可在此獲取到豐富的教學(xué)視頻，充分滿足學(xué)習(xí)要求</font></p>
<div style="padding:50px;">
<h1 style="text-align:center">精選課程</h1>
<p style="text-align:center">口碑好，效益佳</p>
<div>
<table style="float: center;">
<tbody>
<tr>
<td>
<b>
<center>
<div class="video">
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
</video>
<p>實戰(zhàn)視頻1</p>
<p>您可以在此視頻學(xué)習(xí)相關(guān)內(nèi)容1</p>
</div>
</center>
</b>
</td>
<td>
<b></b>
<center><b>
<div class="video">
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
</video>
<p>實戰(zhàn)視頻2</p>
<p>您可以在此視頻學(xué)習(xí)相關(guān)內(nèi)容2</p>
</div>
</b></center>
</td>
<td>
<b>
<center>
<div class="video">
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
</video>
<p>實戰(zhàn)視頻3</p>
<p>您可以在此視頻學(xué)習(xí)相關(guān)內(nèi)容3</p>
</div>
</center>
</b>
</td>
<td>
<b>
<center>
<div class="video">
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
</video>
<p>實戰(zhàn)視頻4</p>
<p>您可以在此視頻學(xué)習(xí)相關(guān)內(nèi)容4</p>
</div>
</center>
</b>
</td>
</tr>
</tbody>
</table>
</div>
<h1 style="text-align:center">觀看金牌講師直播</h1>
<p style="text-align:center">所有導(dǎo)師來自名企，有多年教學(xué)經(jīng)驗</p>
<div>
<table style="float: center;">
<tbody>
<tr>
<td>
<b>
<center>
<div class="video">
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
</video>
<p>張佳佳</p>
<p>擅長教學(xué)產(chǎn)品知識</p>
</div>
</center>
</b>
</td>
<td>
<b></b>
<center><b>
<div class="video">
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
</video>
<p>李文</p>
<p>多年web開發(fā)經(jīng)驗</p>
</div>
</b></center>
</td>
<td>
<b>
<center>
<div class="video">
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
</video>
<p>王杰</p>
<p>專攻大數(shù)據(jù)計算</p>
</div>
</center>
</b>
</td>
<td>
<b>
<center>
<div class="video">
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
</video>
<p>劉子雯</p>
<p>運營專家</p>
</div>
</center>
</b>
</td>
</tr>
</tbody>
</table>
</div>
<p style=" margin: 0 auto; text-align: center; ">
<img class="mypic" src=""
style=" vertical-align: middle; text-align: center;">
</p>
<p>
更多：
<a style=" font-size:14px; font-family: 'Microsoft JhengHei UI'" href="aliyun.com"
target="_blank">aliyun.com</a>
</p>
<p>電話號碼：xxxxx；</p>
</div>
</div>
<div style="text-align: center; margin: 0px; width: 100%; font-size: 14px; font-family: 'Microsoft JhengHei UI';">
@
<a target="_blank" style="text-decoration:none">京ICP備15047403號-1</a>
</div>
</body>
</html>粘貼后將出現(xiàn)以下對話框，點擊確定。
確定后出現(xiàn)如下界面，此時按下 Esc 鍵，并輸入 :wq 后按下Enter鍵保存并退出。
以上操作后，將返回命令行界面。
在瀏覽器打開新頁簽，在地址欄輸入http://<ECS公網(wǎng)地址>/edu，訪問在線教育網(wǎng)站。創(chuàng)建的網(wǎng)站如圖所示：
說明：ECS公網(wǎng)地址可在云產(chǎn)品資源列表查看。
emmm,OK
其實就是教你簡單用了一下cd切到目標(biāo)文件夾，然后用vim編輯文件，把它的代碼丟進(jìn)去。
我的效果是這樣的：
4. 上傳數(shù)據(jù)至OSS
OSS對象存儲可上傳數(shù)據(jù)進(jìn)行存儲。本步驟指導(dǎo)您如何在OSS中上傳數(shù)據(jù)。
打開新的Chromium瀏覽器頁簽。
復(fù)制并粘貼如下OSS地址，進(jìn)入后可看到預(yù)覽的視頻。
https://labfileapp.oss-cn-hangzhou.aliyuncs.com/storage/%E5%AF%B9%E8%B1%A1%E5%AD%98%E5%82%A8OSS%E4%BA%A7%E5%93%81%E8%A7%86%E9%A2%91.mp4在預(yù)覽的視頻上，右鍵點擊視頻另存為 。
彈出如下對話框，點擊桌面，點擊保存。OSS視頻數(shù)據(jù)將下載保存在桌面上。
復(fù)制下方地址，在Chromium瀏覽器打開新頁簽，粘貼并訪問對象存儲OSS控制臺。
https://oss.console.aliyun.com/在左側(cè)導(dǎo)航欄中，選擇Bucket列表，找到云產(chǎn)品資源提供的Bucket名稱。
點擊Bucket名稱，進(jìn)入如下界面。
在界面點擊文件管理-文件列表 。在右側(cè)功能框中，點擊上傳文件 。
右側(cè)產(chǎn)生新的界面后，下拉找到掃描文件 ，并點擊。
在彈出的對話框中找到桌面上下載的對象存儲OSS產(chǎn)品視頻 ，點擊打開，待文件出現(xiàn)在下圖所示中，狀態(tài)為已掃描待上傳，點擊上傳文件 。
11. 可看到如下界面，文件上傳成功。
5. 開通并使用OSS傳輸加速
OSS傳輸加速功能，專門應(yīng)對傳輸速度慢，傳輸距離遠(yuǎn)，跨境等場景使用，可以幫助用戶提高OSS數(shù)據(jù)訪問速度，提升用戶體驗。本步驟將指導(dǎo)您開通并使用OSS傳輸加速。
點擊左上角Bucket列表，回到Bucket列表界面，如下圖所示，找到Bucket名稱，并在右側(cè)的傳輸加速這一欄，點擊開啟。
在彈出的對話框中，如下圖所示，點擊確定即可開通。
開通后傳輸加速狀態(tài)為已開啟。
開通之后，需要將域名替換成傳輸加速域名，才可使傳輸加速生效。傳輸加速域名格式為BucketName.oss-accelerate.aliyuncs.com。將BucketName替換后，按照以下網(wǎng)址，輸入到新的瀏覽器頁簽，即可訪問傳輸加速效果的OSS文件。
BucketName.oss-accelerate.aliyuncs.com/對象存儲OSS產(chǎn)品視頻.mp4訪問效果如下所示：
在瀏覽器中新增頁簽，輸入以下網(wǎng)址，可以查看使用傳輸加速前后的對比情況。
https://oss-accelerate-test.oss-accelerate.aliyuncs.com/acc/oss-transfer-acc-zh.html網(wǎng)站如下所示：
6. 在服務(wù)器后臺html中插入OSS視頻源
在步驟3的html中插入OSS視頻源，完成后，登錄網(wǎng)站可瀏覽視頻，達(dá)到網(wǎng)站教學(xué)視頻的分享效果。
切換回ECS服務(wù)器命令行。
復(fù)制并執(zhí)行以下命令，編輯index.html文件。
vim /alidata/www/default/edu/index.html按下 i 鍵進(jìn)入編輯模式。
按照如下所示找到實戰(zhàn)視頻2，將source src中的movie.mp4替換成如下域名，BucketName需替換成云產(chǎn)品資源列表中的BucketName。
http://BucketName.oss-accelerate.aliyuncs.com/對象存儲OSS產(chǎn)品視頻.mp4
替換后如下所示：
按下 Esc 鍵后，輸入 :wq 后按下Enter鍵保存并退出。
在瀏覽器打開新頁簽，在地址欄輸入http://<ECS公網(wǎng)地址>/edu，訪問在線教育網(wǎng)站。您可查看到網(wǎng)站中可播放相應(yīng)視頻源，并實現(xiàn)一定的加速效果。
備注：若您需要使用CDN加速，您可參照以下地址進(jìn)行CDN配置。
https://help.aliyun.com/document_detail/123226.htmlCDN內(nèi)容分發(fā)服務(wù)可幫助您，在數(shù)據(jù)資源量重復(fù)下載的情況下，可有效緩存到CDN節(jié)點，并加速訪問，同時可配置源站OSS，進(jìn)行源數(shù)據(jù)讀取。
上一頁下一頁
7. OSS配置生命周期
OSS生命周期功能可按照規(guī)則將部分冷數(shù)據(jù)轉(zhuǎn)儲到低頻或者歸檔中，可有效降低客戶音視頻存儲成本。本步驟將指導(dǎo)您如何配置生命周期。
在瀏覽器中回到OSS界面，點擊進(jìn)入相應(yīng)的Bucket。
在如下界面中，點擊數(shù)據(jù)管理-生命周期，進(jìn)入生命周期管理界面。
點擊下圖的創(chuàng)建規(guī)則按鈕，對生命周期進(jìn)行規(guī)則設(shè)置。
本次設(shè)置以最后一次修改時間為例，超過一定時間數(shù)據(jù)未修改的，數(shù)據(jù)將自動轉(zhuǎn)換。如下圖所示，將策略選擇配置到整個Bucket，規(guī)則設(shè)置成 修改時間 ，天數(shù)默認(rèn)為30天，自動的轉(zhuǎn)換類型設(shè)置成低頻訪問。點擊確定。
如下圖所示，生命周期規(guī)則創(chuàng)建成功，狀態(tài)為啟動中。
通過本次實驗?zāi)@得了
基于ECS環(huán)境，實現(xiàn)在線教育網(wǎng)站前端界面的開發(fā)與瀏覽
創(chuàng)建bucket，并上傳數(shù)據(jù)至OSS
開通并使用OSS傳輸加速
接入教學(xué)視頻url鏈接，從瀏覽器訪問在線教育網(wǎng)站oss視頻
OSS生命周期管理設(shè)置
本場景使用到的云產(chǎn)品
對象存儲oss
云服務(wù)器ECS
還是我高看了它，不過對初學(xué)者來講比較適合，就是簡單的linux文件操作，內(nèi)嵌視頻文件鏈接和簡單的阿里云控制臺操作。
還另外試了試，阿里云用于操作的云電腦，可以看B站，但是沒有聲音
還拿speedtest中國版測了一下速，這個結(jié)果有點小離譜文章來源：http://www.zghlxwxcb.cn/news/detail-800739.html
沒有你這樣的上下不對等吧哈哈哈文章來源地址http://www.zghlxwxcb.cn/news/detail-800739.html
到了這里，關(guān)于借助OSS搭建在線教育視頻課程分享網(wǎng)站-阿里云的課程體驗和記錄的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
