1、基于 Aplayer & MetingJS嵌入部件

来源:simple-notion-widgets

例子:
<https://simple-notion-widgets.vercel.app/music-player/?server=tencent&type=playlist&id=7965525792>

图片:

Untitled

【⚠️:vercel地址中国大陆已被墙,请尽量嵌入自己托管的静态页面】

2、苹果音乐嵌入:

<https://embed.music.apple.com/cn/playlist/a-list-%E5%9B%BD%E8%AF%AD%E6%B5%81%E8%A1%8C/pl.beb783da7712481fbeed35be144bd48c>"></iframe>

uTools_1664685127261.png

https://embed.music.apple.com/cn/playlist/a-list-%E5%9B%BD%E8%AF%AD%E6%B5%81%E8%A1%8C/pl.beb783da7712481fbeed35be144bd48c"></iframe>

3,DIY静态页面嵌入

https://rcy1314.github.io/music-player/

示例:

<!DOCTYPE html>
<html>
  <head>
	<meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="keywords" content="网易云" />
    <meta name="description" content="网易云。" />
    <!-- Open Graph on SEO -->
    <meta property="og:title" content="网易云" />
    <meta property="og:type" content="website" />
    <meta property="og:image" content="<http://p3.music.126.net/tBTNafgjNnTL1KlZMt7lVA==/18885211718935735.jpg>" />
    <meta property="og:url" content="<https://music.yunair.cn>" />    
    <meta property="og:site_name" content="网易云"/>
	<title>网易云音乐</title>
    <link rel="stylesheet" href="<https://cdn.staticfile.org/bootstrap/4.6.0/css/bootstrap.min.css>">
    <link rel="stylesheet" href="<https://fastly.jsdelivr.net/npm/[email protected]/dist/css/mdui.min.css>" />
    <link rel="stylesheet" href="<https://cdnjs.cloudflare.com/ajax/libs/layui/2.7.6/css/layui.css>">
    <link rel="shortcut icon" href="<https://s1.music.126.net/style/favicon.ico?v20180823>" />
  </head>
  <body class="0" style="overflow:hidden;">
    <div class="music">
		<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=100% height=86 src="<https://music.163.com/outchain/player?type=2&id=1889103238>
  &auto=&height=66"></iframe>
	  </div>
	  
    
    <div class="debug"><hr/>
      <h5 class="mdui-text-color-white" style="text-align:center;">
        [0]ID:1889103238
      </h5>
    </div>
  
  
  <script src="<https://fastly.jsdelivr.net/npm/[email protected]/dist/js/mdui.min.js>"></script>
  </body><!-- 加载耗时:48 MS--></html>

4,DIY本地化引入静态页面

音乐馆 | NOISE

https://rcy1314.github.io/musicplayer/

5、使用notionpet服务创建小组件

官方:https://notion.pet

NotionPet(widget)-丰富的嵌入式小组件库、动态图标库、可视化图表库