項目持續(xù)更新中：
仿抖音短視頻APP專欄

目錄

發(fā)布短視頻的流程梳理

傳統(tǒng)上傳流程?

傳統(tǒng)上傳

CDN上傳

CDN上傳流程

使用Unicloud云端功能

?實現(xiàn)app端視頻上傳

保存視頻信息入庫

發(fā)布短視頻的流程梳理

傳統(tǒng)上傳流程?

注：controller接受到文件之后會把文件上傳到服務(wù)器，同時controller獲得某一幀幀來獲得我們的封面圖，上傳到我們的文件服。視頻和封面的地址保存到我們的數(shù)據(jù)庫。

傳統(tǒng)上傳

?這里是兩個節(jié)點，整個鏈路帶寬資源占了2G，會有2G帶寬的損耗。用戶產(chǎn)生的風險也很大。

CDN上傳

云廠商提供：

CDN，靜態(tài)資源服務(wù)，全球都能訪問。?

傳統(tǒng)方式：前端上傳文件到cdn之后，我們可以拿到cdn中的播放地址，隨后我們會把視頻文件再次傳到controller。

現(xiàn)在：只需要拿到視頻文件的url地址，一些基本的視頻信息放到我們的controller中存儲就可以了。這里我們只有一次文件的上傳，產(chǎn)生的帶寬損耗發(fā)生在云廠商，風險的承擔也由他們承擔。

補：cdn帶有截幀的功能

優(yōu)化：減少一次帶寬，優(yōu)化傳輸速率，提升用戶體驗。

CDN上傳流程

?我們會拿到兩個url，文本信息提交到controller做處理。

使用Unicloud云端功能

?unicloud可以在云端編寫云函數(shù)，云函數(shù)作為接口為前端服務(wù)，這里不需要我們操作。

云端也提供了云數(shù)據(jù)庫服務(wù)。

?打開官方控制臺：
創(chuàng)建服務(wù)空間：

?打開HBuilder：

?關(guān)聯(lián)云空間：?

?集成成功之后的unicloud

?

?實現(xiàn)app端視頻上傳

發(fā)送在前端的：

?打開前端：

監(jiān)聽函數(shù)，代表中間的+按鈕，可以讓APP.Vue監(jiān)聽，就可以有相應(yīng)方法的執(zhí)行：

?這里的e是一個文件事件對象，

?跳轉(zhuǎn)到publish頁面：

?進度條：?

上傳成功之后，我們會得到一個文件對象（f）：

?這里阿里云會提供一個截幀服務(wù)。

最后重啟，打開主頁，點擊+上傳：

?這里的封面圖是截幀截取的

?

?點擊預覽視頻：

?返回網(wǎng)頁看我們的云存儲：

?這個就是我們剛剛上傳的地址。

這就完成了我們CDN的視頻上傳。

保存視頻信息入庫

在前端找到發(fā)布視頻的路由：

?在model中：

?構(gòu)建service：

接口：

?接口實現(xiàn)：
?

@Service
public class VlogServiceImpl implements VlogService {

    @Resource
    private VlogMapper vlogMapper;



    @Autowired
    private Sid sid;
    private static final String USER_FACE1 = "http://122.152.205.72:88/group1/M00/00/05/CpoxxF6ZUySASMbOAABBAXhjY0Y649.png";


    @Transactional
    @Override
    public void createdVlog(VlogBO vlogBO) {
        String vid = sid.nextShort();
        Vlog vlog = new Vlog();
        BeanUtils.copyProperties(vlogBO,vlog);
        vlog.setId(vid);
        vlog.setCommentsCounts(0);
        vlog.setIsPrivate(YesOrNo.NO.type);
        vlog.setCreatedTime(new Date());
        vlog.setUpdatedTime(new Date());
        vlogMapper.insert(vlog);
    }
}

?在controller層：

?Meavn中install，重啟運行。

?點擊發(fā)布，頁面消失，發(fā)布成功，打開數(shù)據(jù)庫：

?

把視頻的url地址在unicloud中搜索，檢查是否匹配。

文章來源地址http://www.zghlxwxcb.cn/news/detail-411111.html

到了這里，關(guān)于從零搭建仿抖音短視頻APP-后端開發(fā)短視頻業(yè)務(wù)模塊（1）的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！