V2EX = way to explore
V2EX 是一个关于分享和探索的地方
Sign Up Now
For Existing Member  Sign In
爱意满满的作品展示区。
reorx

新年福利 xiamifav - HTML5 虾米音乐播放器

  •  
  •   reorx ·
    reorx · Feb 15, 2013 · 10741 views
    This topic created in 4822 days ago, the information mentioned may be changed or developed.
    实在不能忍受在 ipad 上用 xiami 的 iphone 客户端,于是做了这样一个小应用:

    http://xiami.reorx.com

    其实就是播放你的音乐库里的所以歌曲啦。

    输入你的虾米 uid 就可以使用,uid 在 “我的虾米” 页面的 url 中,比如我的: http://www.xiami.com/u/932367 ,932367 就是 uid。

    也可以将你的播放列表分享给其他人,加一个 user_id 参数就行:

    http://xiami.reorx.com/?user_id=932367

    现在部署在 heroku 上,貌似速度有点慢,改天放到 duapp 上好了。

    另外,只在 ipad 上测试了,iphone 不知道效果如何,有问题大家找我反馈呀。

    enjoy~
    Supplement 1  ·  Feb 16, 2013
    说明一下,这个东东无法在 firefox 上正常使用,因为 firefox 暂时还不支持 audio 标签播放 mp3 格式的音乐(虾米的流媒体似乎只有 mp3 格式)。想了解更多可以看 mozilla 的文档: https://developer.mozilla.org/en-US/docs/HTML/Supported_media_formats#MPEG_H.264_(AAC_or_MP3)
    44 replies    2014-08-13 01:39:44 +08:00
    andybest
        1
    andybest  
       Feb 15, 2013
    每次都要点一下歌曲的名字开始播放吗?
    shuson
        2
    shuson  
       Feb 15, 2013
    不错不错,希望再多支持些网站,比如多米 人人音乐什么的
    swulling
        3
    swulling  
       Feb 15, 2013
    GOOD
    oumu
        4
    oumu  
       Feb 15, 2013
    帅气~忍虾米的 Flash 很久了
    bombless
        5
    bombless  
       Feb 15, 2013 via iPad
    在我这里完全打不开>_<

    虾米只能打开三首音乐是挺麻烦的……另外貌似酷我也有些日文歌
    archsocks
        6
    archsocks  
       Feb 15, 2013
    GOOD。虾米的播放器flash很费CPU。
    如果做成能播放播放器列表里的歌就更好了,比如做个bookmarklet,在播放器窗口点一下就转到html5播放器。
    wzxjohn
        7
    wzxjohn  
       Feb 15, 2013
    弄到SAE上吧。
    bombless
        8
    bombless  
       Feb 15, 2013 via iPad
    刚刚看到1ting的html5版播放器不错 http://m.1ting.com/#/album/47007
    reorx
        9
    reorx  
    OP
       Feb 15, 2013 via iPad
    @andybest 草草做完,只花了2天时间,我会加入自动播放和播放控制功能的 :)

    @bombless 是页面出不来还是加载错误呢?

    @archsocks 嗯,我研究一下。现在用的虾米手机客户端的接口,所以能很方便获取音乐库的歌曲,播放列表还真不知道在哪能找到呢。

    @wzxjohn SAE 可以部署 tornado 吗?求个邀请码〜
    wzxjohn
        10
    wzxjohn  
       Feb 15, 2013
    wzxjohn
        11
    wzxjohn  
       Feb 15, 2013
    @reorx 貌似SAE的python已经不需要邀请码了???
    bombless
        12
    bombless  
       Feb 15, 2013 via iPad
    @reorx 网速问题^_^
    刚刚又可以了,试了试,效果很不错呢〜
    JTR
        13
    JTR  
       Feb 15, 2013 via iPad
    fetch 略慢。。
    我一般听虾米猜很少加心,歌单只有24首。。
    Kaiyuan
        14
    Kaiyuan  
       Feb 15, 2013
    问一个问题,怎么暂停?
    我在电脑上操作的,iPhone 可以双击 Home 键左边控制。
    reorx
        15
    reorx  
    OP
       Feb 15, 2013 via iPad
    @Kaiyuan 还没加上这个功能,很快会有的

    @JTR 所以这个应用主要是给经常听加心歌曲的人做的呀,不过倒是可以加上播放精选集的功能。
    JwhSir
        16
    JwhSir  
       Feb 15, 2013
    @reorx 同感 就是这几个可以改进的地方:能不能如Kaiyuan所说能暂停最好能有进度条 而且在页面最上方有一个音量调节 播放精选集和专辑的功能也很值得期待 不管怎样 这个比原版flash已经有了很大的改进 谢谢你的分享了
    reorx
        17
    reorx  
    OP
       Feb 15, 2013 via iPad
    @JwhSir 嗯,会加上暂停/播放控制和精选集、收藏专辑播放。不过我还是打算尽量保持界面和功能的简洁,毕竟在 pc 上有虾米自己的播放器用,没必要替代它嘛。Simple is better :)
    lossdante
        18
    lossdante  
       Feb 16, 2013
    不错不错,支持骁爷~
    pansafe
        19
    pansafe  
       Feb 16, 2013 via iPad
    太棒了,求追加github链接
    laoyuan
        20
    laoyuan  
       Feb 16, 2013
    好东东!!编程我不行,听歌我在行~~分享下我收的200来首歌,摇滚、独立为主
    http://xiami.reorx.com/?user_id=2497091
    http://www.xiami.com/space/lib-song/u/2497091
    paloalto
        21
    paloalto  
       Feb 16, 2013
    我这边在 Firefox 中无法播放,点击歌曲名字无反应。firebug中也看不到网络请求。

    Firefox 版本 18.0.2

    Chrome正常。
    SamZeng
        22
    SamZeng  
       Feb 16, 2013
    连续多次点击登陆表单上面的“黑圈”,发现表单乱了。可能就我无聊......
    reorx
        23
    reorx  
    OP
       Feb 16, 2013
    @paloalto 这是因为 firefox 不支持 audio 标签的 mp3 播放,哎,我忘了交代了,多谢提醒~

    @pansafe 等代码整理好就开源。

    @lossdante <3
    qiukun
        24
    qiukun  
       Feb 16, 2013
    @reorx sae 需要申请,秒申 http://python.sinaapp.com/apply
    reorx
        25
    reorx  
    OP
       Feb 16, 2013
    @qiukun 谢谢,已申请,等待回复中。
    @laoyuan 歌单很棒,符合我的口味~
    xsmile
        26
    xsmile  
       Feb 16, 2013
    有点意思!
    felinx
        27
    felinx  
       Feb 16, 2013
    @reorx SAE上不能用Tornado的异步特性,在上面用Tornado几乎没有什么意义。
    reorx
        28
    reorx  
    OP
       Feb 17, 2013 via Android
    @felinx 现在好像能用了,文档说 config.yaml 里 worker 设为 tornado 就可以了。不过它的 tornado 版本是 2.1.1,竟不能跟进最新。。

    话说飞龙你怎么知道我这个项目用 tornado 写的,太神了!
    reorx
        29
    reorx  
    OP
       Feb 17, 2013 via Android
    @felinx 我二了,一定是看了 Header > <
    felinx
        30
    felinx  
       Feb 17, 2013
    @reorx 嘿嘿!
    felinx
        31
    felinx  
       Feb 17, 2013
    @reorx 确实我有很久没有关注SAE的最新动态了,现在支不支持就不了解了。
    supersheep
        32
    supersheep  
       Feb 17, 2013
    设计的好赞。很想知道 api_proxy/fav_songs 这个接口是怎么抓的。以前自己也做过类似的事情,但是是抓html来分析的,这个看着不像啊,还拿了一些应用中没有用到的专辑封面歌词地址什么的,看着很像官方的感觉。是不是抓了app里的请求然后看到的?
    reorx
        33
    reorx  
    OP
       Feb 17, 2013 via iPad
    @supersheep sorry 回复晚了,今天一直在亲戚家。获取歌曲列表的接口就如它名字所说的那样,其实是对虾米已有接口的一个代理,返回数据也没有改动过。这样做是因为受跨域请求的限制,不然整个应用其实都可以是一个静态页面了。设计是偷 ipad 的音乐播放器,取色都是和它一样的呢。。其实前端代码写得很乱,明天把项目开源,还请多指教呀!
    supersheep
        34
    supersheep  
       Feb 18, 2013
    @reorx 期待
    reorx
        35
    reorx  
    OP
       Feb 18, 2013
    supersheep
        36
    supersheep  
       Feb 21, 2013
    赞!
    haichong520
        37
    haichong520  
       Feb 25, 2013
    貌似虾米音乐有做防盗链,请教一下楼主怎么越过防线的?
    reorx
        38
    reorx  
    OP
       Feb 25, 2013
    @haichong520 虾米的音乐链接的确不能直接跨域加载,我也是误打误撞才发现,当去掉 Header 里的 referer 项时就能加载了,所以我把 audio 标签放在一个没有 src 的 iframe 里面,你懂的~
    regent
        39
    regent  
       Feb 25, 2013 via iPad   ❤️ 1
    按钮太小了一点,ipad上面操作不够方便
    reorx
        40
    reorx  
    OP
       Feb 25, 2013
    @regent 是说播放控制的按钮吗?的确小了点,主要是没有找到好的 icon,不过应该不影响操作的,如果你按下去不放就会发现,它的有效范围其实是个方形,高度和整个导航条是一样的。另外多谢提议,我会换个更显眼的 :)
    toboy
        41
    toboy  
       Mar 4, 2013
    menu弹出的几个按钮,点击没有效果,mac chrome下。
    另外希望支持随机播放等功能,谢谢lz了。
    reorx
        42
    reorx  
    OP
       Mar 4, 2013
    @toboy menu 是预留下一步开发的功能的,这两天找工作,所以耽误了。。做好了一定通知你~
    evilever
        43
    evilever  
       May 16, 2013
    做得真好.
    regent
        44
    regent  
       Aug 13, 2014
    能不能更新一下,发现已经失效了
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   2447 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 77ms · UTC 04:59 · PVG 12:59 · LAX 21:59 · JFK 00:59
    ♥ Do have faith in what you're doing.