• 请不要在回答技术问题时复制粘贴 AI 生成的内容
qianji201712
V2EX  ›  程序员

五分钟撸了一个写代码听雨声的小站

  •  8
     
  •   qianji201712 ·
    litang0908 · Mar 28, 2019 · 26754 views
    This topic created in 2628 days ago, the information mentioned may be changed or developed.

    网站地址 http://rain.xxoojoke.com/ 功能:播放雨声+钢琴音

    雨声是网上找的,其实我一直有听下雨声的习惯,听了很多回后发现,这个雨声其实是最舒服最自然的,所以就驾到站点了。 另外,钢琴是 《 In Autumn, the Leaves Came to Our House 》 估计大家也都听过。

    之所以做这个,是发现这个雨声和钢琴搭配很完美,基本上我一周全天都在一起听,午休也听,很容易放松下来,这个雨声听着听着会让人恍惚真感觉在下雨。

    前段时间由于工作关系,每天很焦虑,晚上经常失眠,就听这个助眠,欢迎大家体验。

    目前雨声和钢琴都是固定的,因为没有找到比这两者更完美结合的了。

    Supplement 1  ·  Mar 29, 2019

    附上音乐链接 https://music.163.com/#/song?id=17746129
    作者 Fariborz Lachini 大师 大师照片

    关于版权: 这个音乐目前没有找到版权信息,我去各大音乐网站搜索,发现都有这首钢琴曲,如果真的侵权,我会立即更改的。

    这个小站本来只是玩玩,没想到收到这么多的反馈,我继续改进改进,感谢大家!

    Supplement 2  ·  Mar 30, 2019
    再补充一下:
    刚刚更新了一下小站,增加了停止播放时的声音逐渐变小效果。
    有好几个朋友问我这个小站怎么建的,其实做 Web 开发的大佬们都知道,这种功能简单的网站,分分钟就撸出来了。
    用的都是最基本的 HTML 语法和 JS,播放音乐控件是 HTML 自带的 <audio> 标签,唯一需要处理的就是点击按钮进行播放 /暂停,以及暂停时的声音逐渐变小处理。
    这个小站几乎用不了什么配置,服务器是阿里云的( 2 核 4G ),就是一个静态网页而已,我是做 Android 开发的,Web 端开发能力只停留在 Google+Copy 阶段。
    只希望这个小站可以给大家带来帮助~
    231 replies    2020-10-18 23:11:09 +08:00
    1  2  3  
    SuperMild
        101
    SuperMild  
       Mar 29, 2019
    非常完美
    Veigar
        102
    Veigar  
       Mar 29, 2019
    写代码 我还是喜欢搭配 咚词哒词的音乐,能提高键盘敲击速度 比如说 http://www.djhik.com
    conge
        103
    conge  
    PRO
       Mar 29, 2019   ❤️ 5
    我听雨声不行
    总感觉是锅上煎着什么东西,听着饿
    ericgui
        104
    ericgui  
       Mar 29, 2019
    前段时间由于工作关系,每天很焦虑,晚上经常失眠,就听这个助眠,欢迎大家体验。


    终极助眠方式还是不工作;
    herozzm
        105
    herozzm  
       Mar 29, 2019 via iPhone
    直接提供音乐下其实更合适啊
    这种没有必要用网页
    hiyouli
        106
    hiyouli  
       Mar 29, 2019
    好了,收藏此贴。这里有各种雨声。哈哈哈。感谢楼主。
    ThomasZ
        107
    ThomasZ  
       Mar 29, 2019 via Android
    尝试一下篝火➕小雨➕微风的组合
    RealGM
        108
    RealGM  
       Mar 29, 2019
    关键是 5 分钟就撸出来了
    bobyang
        109
    bobyang  
       Mar 29, 2019 via Android
    还真是很好听,谢谢
    artSYM
        110
    artSYM  
       Mar 29, 2019
    美美哒。
    wolfie
        111
    wolfie  
       Mar 29, 2019
    忧伤的画面感。
    Aliceiyi
        112
    Aliceiyi  
       Mar 29, 2019
    @conge 哈哈哈
    samaxu
        113
    samaxu  
       Mar 29, 2019
    楼主是开发 钱迹 的嘛 我给个好评
    sarlanori
        114
    sarlanori  
       Mar 29, 2019
    雨声和钢琴确实最配,当年第一次听到《雨的印记》时真的被惊到了
    blurh11E27
        115
    blurh11E27  
       Mar 29, 2019
    哇 不错
    Cyron
        116
    Cyron  
       Mar 29, 2019   ❤️ 1
    DanielGuo
        117
    DanielGuo  
       Mar 29, 2019
    可真是个小天才呢
    e5c4p3r
        118
    e5c4p3r  
       Mar 29, 2019 via iPhone
    感谢分享,很好听
    qianji201712
        119
    qianji201712  
    OP
       Mar 29, 2019 via Android
    @conge 秀儿,你先坐下🤔
    qianji201712
        120
    qianji201712  
    OP
       Mar 29, 2019 via Android
    @herozzm 其实主要是我白天在公司写代码使用
    qianji201712
        121
    qianji201712  
    OP
       Mar 29, 2019 via Android
    @hiyouli 哈哈,等我再拓展拓展
    qianji201712
        122
    qianji201712  
    OP
       Mar 29, 2019 via Android
    @samaxu 是的哦,多谢大佬🤗
    qianji201712
        123
    qianji201712  
    OP
       Mar 29, 2019 via Android
    @sarlanori 是啊,我听了好久之后,发现这两个搭配太完美了
    qianji201712
        124
    qianji201712  
    OP
       Mar 29, 2019 via Android
    @Cyron 感谢,收藏了
    qianji201712
        125
    qianji201712  
    OP
       Mar 29, 2019 via Android
    @e5c4p3r 等我继续优化一下
    qianji201712
        126
    qianji201712  
    OP
       Mar 29, 2019 via Android
    @13662439966 可以的,就是循环播放的
    zjsxwc
        127
    zjsxwc  
       Mar 29, 2019
    感谢楼主,我把楼主的代码用 hbuilder 打包成安卓 app 省流量,

    http://zjsxwc.github.io/play_rain/playrain_0329091541.apk
    2h4dl
        128
    2h4dl  
       Mar 29, 2019
    听雨声会让人感到平静,尤其是燥热的夏天。
    lazydog
        129
    lazydog  
       Mar 29, 2019 via Android
    很不错,喜欢
    rocyhua
        130
    rocyhua  
       Mar 29, 2019
    很不错的小站,已收录,谢谢 LZ 分享。
    https://www.kunlunqiu.com/91.html
    creanme
        131
    creanme  
       Mar 29, 2019   ❤️ 1
    我把这音乐分享到百度盘了
    链接: https://pan.baidu.com/s/1NtWsUcV1f0NADcCaU1rXPw 提取码: h27j
    dingyaguang117
        132
    dingyaguang117  
       Mar 29, 2019
    BarZu
        133
    BarZu  
       Mar 29, 2019
    收藏了收藏了
    zatoichi
        134
    zatoichi  
       Mar 29, 2019
    言叶之庭的钢琴曲应该很配
    iblessyou
        135
    iblessyou  
       Mar 29, 2019
    各种环境音效 https://asoftmurmur.com/
    我记得以前有个网站,画面是一张夕阳海浪的大壁纸,放海浪声,还有雨声什么的 总共好像 4 个页面 刚找找不到了
    blue0125
        136
    blue0125  
       Mar 29, 2019
    建议 钢琴声>雨声。。。
    想象成 外面小雨,人在钢琴房 coding 的赶脚。。
    feelinglucky
        137
    feelinglucky  
       Mar 29, 2019
    wslzs1999
        138
    wslzs1999  
       Mar 29, 2019
    我也想撸一个,请楼主指导一下
    Mithrandir
        139
    Mithrandir  
       Mar 29, 2019
    点击暂停之后最好有一个 fade out 的过程
    qianji201712
        140
    qianji201712  
    OP
       Mar 29, 2019
    @Mithrandir 收到,再優化一下!
    qianji201712
        141
    qianji201712  
    OP
       Mar 29, 2019
    @wslzs1999 用 HTML 的 audio 控件播放音樂就可以啊
    qianji201712
        142
    qianji201712  
    OP
       Mar 29, 2019
    @feelinglucky 多謝,你這個項目不维护了吗?
    qianji201712
        143
    qianji201712  
    OP
       Mar 29, 2019
    wslzs1999
        144
    wslzs1999  
       Mar 29, 2019
    @jiaotang 怎么联系
    wslzs1999
        145
    wslzs1999  
       Mar 29, 2019
    @zjsxwc 怎么打包成 app
    zhaoyafei
        146
    zhaoyafei  
       Mar 29, 2019
    @iblessyou 你提到的应该是这个站吧 http://rainyscope.com 我经常听
    另外还有一个比较好的 http://virtocean.com/
    exvipplus
        147
    exvipplus  
       Mar 29, 2019
    很喜欢,就是这域名。。。
    Mazexal
        148
    Mazexal  
       Mar 29, 2019
    杭州这边天天下雨, 听雨声都烦死了
    as94boy
        149
    as94boy  
       Mar 29, 2019
    感谢楼主,昨天做一个小功能出偏差了,到今天都沉浸在自我怀疑内心难受的感觉中,听了雨声感觉心情平复了点。
    cooljs
        150
    cooljs  
       Mar 29, 2019
    五分钟?
    allenx
        151
    allenx  
       Mar 29, 2019
    到后面就光听见钢琴声没听到雨声了。。。
    qianji201712
        152
    qianji201712  
    OP
       Mar 29, 2019
    @allenx 好的,可能是那个雨声还没有缓存下来,那个雨声 34 分钟,20M 左右
    qianji201712
        153
    qianji201712  
    OP
       Mar 29, 2019
    @as94boy 多谢喜欢啊,我也是烦躁就听
    lwd219
        154
    lwd219  
       Mar 29, 2019
    @blue0125 是不是罗辑在北欧的那个别墅?旁边的壁炉里火焰正旺,周围方圆十几里一个人荒芜人烟
    zarte
        155
    zarte  
       Mar 29, 2019
    会听腻
    xiaolanger
        156
    xiaolanger  
       Mar 29, 2019
    @conge #103 我本来还没什么感觉。。。过分了啊
    RubyJack
        157
    RubyJack  
       Mar 29, 2019
    noizio 了解一下
    Aloehuang
        158
    Aloehuang  
       Mar 29, 2019 via Android
    @cowap 自己合成吧
    DAM
        159
    DAM  
       Mar 29, 2019 via iPhone
    一个听风就是雨的网站 😏
    arens
        160
    arens  
       Mar 29, 2019
    这个雨声有点燥,和钢琴不是很搭
    itqls
        161
    itqls  
       Mar 29, 2019
    去年听过一个雨声白噪,雨淅淅沥沥的打窗、屋檐,然后还有远处的雷声,找了好久没有找到类似的
    bofei
        162
    bofei  
       Mar 29, 2019
    一直比较喜欢下雨
    不管是睡觉还是学习 听着外面的雨声 心中比较”宁静“
    可惜 北京 长时间没有雨季
    atonku
        163
    atonku  
       Mar 29, 2019
    还是喜欢猴哥!
    qianji201712
        164
    qianji201712  
    OP
       Mar 29, 2019
    @arens 屋外聒噪,屋内安静,自成一片天地
    popvlovs
        165
    popvlovs  
       Mar 29, 2019
    收藏了,比较喜欢把雨声调的比较小
    ostholz
        166
    ostholz  
       Mar 29, 2019
    停不下来
    QAQGan
        167
    QAQGan  
       Mar 29, 2019
    xxoo 还行 手动滑稽
    Aloehuang
        168
    Aloehuang  
       Mar 29, 2019
    未经楼主同意,私下下载了雨声和钢琴声两个音频,合成了一个音频,分享给有需要的 V2er。
    链接: https://pan.baidu.com/s/1WN8yRuYaloL_UMQcOV7XrA
    提取码:il1z
    文件约 47.1MB
    Heanes
        169
    Heanes  
       Mar 29, 2019
    不错不错
    Heanes
        170
    Heanes  
       Mar 29, 2019
    楼主这个域名主站(xxoojoke.com)的 f.u_ck off,非常棒
    qianji201712
        171
    qianji201712  
    OP
       Mar 29, 2019 via Android
    @Aloehuang 优秀!🤔
    qianji201712
        172
    qianji201712  
    OP
       Mar 29, 2019 via Android
    @Heanes 因为之前做过一个搞笑段子类的 Aop,就注册了这个🤗🤗🤗
    huruwo
        173
    huruwo  
       Mar 29, 2019
    郭德纲相声精选 就是笑出声引起同事注意
    Marsss
        174
    Marsss  
       Mar 29, 2019
    简单即美好
    cnzzz
        175
    cnzzz  
       Mar 29, 2019
    run2
        176
    run2  
       Mar 29, 2019
    有意思,两个音频合在一起放的概念很有趣
    ruihe
        177
    ruihe  
       Mar 29, 2019
    强烈推荐这个 https://at-home.ambient-mixer.com ,不仅有各种自然环境声,还有各种场景,影视剧等的背景音,我觉得氛围还不错
    https://i.loli.net/2019/03/29/5c9e25aa7242d.png
    hyyou2010
        178
    hyyou2010  
       Mar 29, 2019
    觉得很棒!
    xabc
        179
    xabc  
       Mar 29, 2019
    @qianji201712 看看 https://rain.xabcloud.com 配色如何 😄
    feelinglucky
        180
    feelinglucky  
       Mar 29, 2019
    @qianji201712 精力有限而且技术栈用得比较老,所以不维护了。
    intmax2147483647
        181
    intmax2147483647  
       Mar 30, 2019
    @arens 你不说我还没感觉出来
    intmax2147483647
        182
    intmax2147483647  
       Mar 30, 2019
    @xabc 既然你一定要我原谅你,那么我就原谅你吧,这个颜色太。。。。
    Trumeet
        183
    Trumeet  
       Mar 30, 2019
    忧伤的画面感 +1
    Trumeet
        184
    Trumeet  
       Mar 30, 2019
    提个建议,增加一个暂停的时候音乐淡出效果,类似网易云。直接停止真的很难受
    6260628
        185
    6260628  
       Mar 30, 2019
    听了会更冷了...
    qianji201712
        186
    qianji201712  
    OP
       Mar 30, 2019 via Android
    @Trumeet 好的,今天就改进一下
    qianji201712
        187
    qianji201712  
    OP
       Mar 30, 2019 via Android
    @DAM 要的就是这效果啊
    dai875939260
        188
    dai875939260  
       Mar 30, 2019
    感谢楼主,我把这个写到谷歌浏览器的扩展( https://github.com/daihy8759/nanguo)里去了
    qianji201712
        189
    qianji201712  
    OP
       Mar 30, 2019
    @dai875939260 欢迎啊
    Arizas
        190
    Arizas  
       Mar 30, 2019
    好听
    shm7
        191
    shm7  
       Mar 30, 2019 via iPhone
    不错。我觉得这个可以给 潮汐 提一个意见了
    hyyou2010
        192
    hyyou2010  
       Mar 30, 2019
    昨晚开了一晚上,挺不错
    dontcrys
        193
    dontcrys  
       Mar 30, 2019
    我最喜欢的雨声 《 Dreamstorm 》 — Dan Gibson
    qianji201712
        194
    qianji201712  
    OP
       Mar 30, 2019
    @shm7 其实我想做它的竞品 ==,不太喜欢潮汐,太臃肿了 :)
    qianji201712
        195
    qianji201712  
    OP
       Mar 30, 2019
    @dontcrys 多谢,收藏了
    qianji201712
        196
    qianji201712  
    OP
       Mar 30, 2019
    @hyyou2010 我现在基本上只要写代码都听它
    qianji201712
        197
    qianji201712  
    OP
       Mar 30, 2019
    @Trumeet 刚刚加了这个效果,不知道体验感觉如何?
    Jeeco
        198
    Jeeco  
       Mar 30, 2019
    @sobigfish ASMR 你听过么
    run2
        199
    run2  
       Mar 30, 2019
    @Jeeco #196 听过,貌似只在某直播上了解过😂
    Trumeet
        200
    Trumeet  
       Mar 31, 2019
    @qianji201712 多谢,效果很棒!
    1  2  3  
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   818 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 163ms · UTC 21:31 · PVG 05:31 · LAX 14:31 · JFK 17:31
    ♥ Do have faith in what you're doing.