国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

小小weibo音樂播放器

mdluo / 2952人閱讀

摘要:故事背景前幾周看到一個(gè)網(wǎng)友做音樂播放器,然而在巧合之下發(fā)現(xiàn)微博的網(wǎng)頁播放器挺不錯(cuò)的,就捉摸著自己試試,文章最末處獻(xiàn)上源碼,喜歡就請(qǐng)帶走吧。

故事背景:前幾周看到一個(gè)網(wǎng)友做web音樂播放器,然而在巧合之下發(fā)現(xiàn)微博的網(wǎng)頁播放器挺不錯(cuò)的,就捉摸著自己試試,文章最末處獻(xiàn)上源碼,喜歡就請(qǐng)帶走吧。

演示地址:http://123.56.191.84/jmusic_v...

兼容當(dāng)前主流瀏覽器包括ie9及以上,不考慮兼容ie8及以下的瀏覽器

好了,步入正題,這個(gè)小東西涉及的一些大概知識(shí)點(diǎn):cRULajaxsessionmemcache閉包遞歸。。差不多就這些把,沒別的了,考慮到有些朋友可能對(duì)有些知識(shí)點(diǎn)遺忘了,哈哈,我特意整理了每個(gè)知識(shí)點(diǎn)的筆記。
Cookie 與 Session:http://segmentfault.com/n/133...
Memcache:https://segmentfault.com/n/13...
cURL:https://segmentfault.com/n/13...
至于如果作為一個(gè)前端不知道ajax那我也沒辦法了,找點(diǎn)資料了解下吧,因?yàn)樘唵危揖蜎]有整理筆記了,但是如果有網(wǎng)友需要,可以聯(lián)系我。

功能演示

1.小窗口與大窗口切換

2.播放面板的:后退、播放與暫停、前進(jìn)、播放模式切換、音量(點(diǎn)贊與分享功能沒做,和刪除功能大同小異,后面有時(shí)間了我再補(bǔ)上)、定位播放位置(可拖拽)

3.播放列表頁、新歌榜(默認(rèn)顯示20首)、歌曲搜索頁、列表滾動(dòng)條。

注:這些歌曲均是通過網(wǎng)易接口爬取過來的,因?yàn)榫W(wǎng)易很坑,我拿到的接口中30首差不多就只有5-8首可以正常播放,所以采用了cURL爬取驗(yàn)證,過濾掉了不能放的音樂,如果不知道網(wǎng)易接口怎么用的,可以自行百度

4.播放列表的歌曲批量刪除、單曲刪除,排行榜的批量播放、搜索列表的批量播放。

5.歌詞的拖拽查看

播放器使用方法(引入方法)

將除show文件夾之外的必要文件移動(dòng)到你要顯示播放器所在的文件夾

在要顯示播放器的頁面中插入如下幾行代碼

    1. 
    2. 
    3. 
    4. 

注意:除第一行代碼必須放在網(wǎng)頁頂部外,其余代碼可以插入到任意位置(但是css樣式插入位置必須在標(biāo)簽中),但是要保準(zhǔn)順序不能變 第4行代碼必須要在第三行代碼后面

代碼插入示例




    
    音樂播放器
    


    



提醒:代碼必須要放置在php環(huán)境、并且安裝memcache擴(kuò)展

4行代碼解釋

1. //啟動(dòng)Session 的初始化 ,分配給用戶一個(gè)sessionid,此id使用來讀取服務(wù)器緩存的用戶播放記錄和新歌榜記錄(方便下次快速播放->因?yàn)榫W(wǎng)易api的問題才會(huì)考慮緩存新歌榜的記錄的)。
2. // 引入css樣式文件
3. 引入js主文件
4. // 將sessionid傳遞給js主文件通過ajax進(jìn)行服務(wù)器的匹配是否存在此用戶的緩存音樂,如果存在就直接返回,沒有怎重新從api獲取

文件目錄

jmusic.php //次文件是你的將要引入播放器的文件(可修改)

css // css樣式文件(不可改,但是如果懂,可以自行修改)

js // js主文件(不可改,但是如果懂,可以自行修改)

php // 存放著php文件,用于驗(yàn)證網(wǎng)易api中那些音樂可以播放哪些音樂不可以播放

show // 用于存放本文章中所有功能演示圖片(可刪除)

提示

這種可以緩存音樂的都是需要用戶登錄的,考慮到大家看演示的時(shí)候都會(huì)緩存造成大量垃圾,而我又是用的很渣的服務(wù)器,所以緩存在的時(shí)間只有24小時(shí),并且開啟了session的垃圾回收機(jī)制(當(dāng)訪問過大時(shí),超時(shí)的session會(huì)被自動(dòng)刪除)。
如果想要看微博原始播放器的朋友,可以移步至:點(diǎn)擊進(jìn)入微博頁提醒:必須要登錄后播放器才會(huì)顯示,如果有賬號(hào)可以登錄查看

源碼下載地址

https://github.com/66pig/-jMusic

其實(shí)很早就做出來了,但是好尷尬,最開始不知道怎么把源碼發(fā)上來(自己服務(wù)器存放的時(shí)間都不長,鏈接容易失效),沒玩過github,初次嘗試,別見笑,后期有時(shí)間會(huì)更新的,如果你們覺得有什么bug也可以合并過來,大家相互學(xué)習(xí)。

當(dāng)有朋友想要視頻播放器的時(shí)候會(huì)發(fā)現(xiàn)其實(shí)視頻播放器的功能多數(shù)都體現(xiàn)在了這個(gè)音樂播放器,是吧?這就是為啥我把這個(gè)發(fā)出來,而視頻播放器中多數(shù)人的一個(gè)瓶頸應(yīng)該全屏問題,下次再說吧,先到這里了,如果有問題可以聯(lián)系我。

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://specialneedsforspecialkids.com/yun/50842.html

相關(guān)文章

  • 小小weibo音樂放器

    摘要:故事背景前幾周看到一個(gè)網(wǎng)友做音樂播放器,然而在巧合之下發(fā)現(xiàn)微博的網(wǎng)頁播放器挺不錯(cuò)的,就捉摸著自己試試,文章最末處獻(xiàn)上源碼,喜歡就請(qǐng)帶走吧。 故事背景:前幾周看到一個(gè)網(wǎng)友做web音樂播放器,然而在巧合之下發(fā)現(xiàn)微博的網(wǎng)頁播放器挺不錯(cuò)的,就捉摸著自己試試,文章最末處獻(xiàn)上源碼,喜歡就請(qǐng)帶走吧。 演示地址:http://123.56.191.84/jmusic_v... 兼容當(dāng)前主流瀏覽器包括i...

    klivitamJ 評(píng)論0 收藏0
  • 小小weibo音樂放器

    摘要:故事背景前幾周看到一個(gè)網(wǎng)友做音樂播放器,然而在巧合之下發(fā)現(xiàn)微博的網(wǎng)頁播放器挺不錯(cuò)的,就捉摸著自己試試,文章最末處獻(xiàn)上源碼,喜歡就請(qǐng)帶走吧。 故事背景:前幾周看到一個(gè)網(wǎng)友做web音樂播放器,然而在巧合之下發(fā)現(xiàn)微博的網(wǎng)頁播放器挺不錯(cuò)的,就捉摸著自己試試,文章最末處獻(xiàn)上源碼,喜歡就請(qǐng)帶走吧。 演示地址:http://123.56.191.84/jmusic_v... 兼容當(dāng)前主流瀏覽器包括i...

    TZLLOG 評(píng)論0 收藏0
  • 小小weibo音樂放器

    摘要:故事背景前幾周看到一個(gè)網(wǎng)友做音樂播放器,然而在巧合之下發(fā)現(xiàn)微博的網(wǎng)頁播放器挺不錯(cuò)的,就捉摸著自己試試,文章最末處獻(xiàn)上源碼,喜歡就請(qǐng)帶走吧。 故事背景:前幾周看到一個(gè)網(wǎng)友做web音樂播放器,然而在巧合之下發(fā)現(xiàn)微博的網(wǎng)頁播放器挺不錯(cuò)的,就捉摸著自己試試,文章最末處獻(xiàn)上源碼,喜歡就請(qǐng)帶走吧。 演示地址:http://123.56.191.84/jmusic_v... 兼容當(dāng)前主流瀏覽器包括i...

    cangck_X 評(píng)論0 收藏0
  • 指尖一點(diǎn)歌聲來--微信小程序之仿網(wǎng)易云音樂心得

    摘要:為了提高自己,最近在學(xué)習(xí)微信小程序,選題是仿網(wǎng)易云音樂。查文檔發(fā)現(xiàn),小程序中圖片加載完成后,有一個(gè)加載完成事件。前者在微信客戶端版本就不開始維護(hù)了,后者低版本需做兼容處理。目前還有一些功能暫未實(shí)現(xiàn),會(huì)在以后繼續(xù)完善項(xiàng)目,繼續(xù)學(xué)習(xí)。 為了提高自己,最近在學(xué)習(xí)微信小程序,選題是仿網(wǎng)易云音樂。期間踩過了大把的坑,bug出現(xiàn)的難受和解決bug歡喜,一直是伴隨我階段性學(xué)習(xí)這個(gè)項(xiàng)目的心情。初步完成...

    KitorinZero 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<