直接在动态首页展示所有的正在直播名单,而不是默认10个
< Valutazione su B站动态首页展示所有正在直播列表
看来作者已经放弃,在忍了这个不痛不痒的小问题半年后终于忍不住,在改完自己的脚本后顺手改了,有需要者自取。作者要用的话记得改下版本号,不然我还接收不到更新。
// ==UserScript==
// @name B站动态首页展示所有正在直播列表
// @namespace http://tampermonkey.net/
// @version 0.2.5.alpha
// @description 直接在动态首页展示所有的正在直播名单,而不是默认10个
// @author tuntun, fixed by Laster2800
// @noframes
// @match https://t.bilibili.com/*
// @icon https://www.google.com/s2/favicons?domain=bilibili.com
// @grant GM_addStyle
// @license MIT
// ==/UserScript==
(function () {
'use strict';
GM_addStyle(`
.bili-dyn-live-users {
max-height: calc(100vh - 276px);
overflow-y: overlay;
}
.bili-dyn-live-users::-webkit-scrollbar {
width: 10px; /*滚动条的宽度*/
height: 8px; /*滚动条的高度*/
opacity: 0;
}
.bili-dyn-live-users::-webkit-scrollbar-track-piece {
background-color: #fff; /*滚动条的背景颜色*/
-webkit-border-radius: 0; /*滚动条的圆角宽度*/
opacity: 0;
}
.bili-dyn-live-users::-webkit-scrollbar-thumb {
height: 50px;
background-color: #ccc;
-webkit-border-radius: 4px;
outline: 2px solid #fff;
outline-offset: -2px;
border: 2px solid #fff;
display: none;
}
.bili-dyn-live-users::-webkit-scrollbar-thumb:hover {
background-color: #9f9f9f;
}
.bili-dyn-live-users:hover::-webkit-scrollbar-thumb {
display: block;
}
.bili-dyn-live-users::-webkit-scrollbar-track {
display: none;
}
.bili-dyn-live-users::-webkit-scrollbar-track-piece {
display: none;
}
`)
const API = {
// 封装get方法
Get: async (props) => {
const { url: baseUrl, params = {} } = props;
let pStr = Object.keys(params).map((key) => {
return `${key}=${params[key]}`;
}).join('&');
let url = `${baseUrl}${pStr !== '' ? '?' : ''}${pStr}`;
try {
let res = await fetch(url, {
credentials: "include"
});
return (await res.json()).data;
} catch (error) {
console.error('Get Error', error);
}
},
// 通过关键词获取视频数据
getLiver: async (num = 0) => {
try {
let params = {};
if (num !== 0) {
params = {
size: num
}
}
let res = await API.Get({
url: 'https://api.vc.bilibili.com/dynamic_svr/v1/dynamic_svr/w_live_users',
params,
});
return res;
} catch (error) {
console.log('getLiver', error);
}
},
getCard: async (mid) => {
try {
let res = await API.Get({
url: 'https://api.bilibili.com/x/web-interface/card',
params: {
mid,
photo: 'true',
},
});
return res;
} catch (error) {
console.log('getCard', error);
}
}
}
const Tool = {
// 大数转万
formatBigNumber: (num) => {
return num > 10000 ? `${(num / 10000).toFixed(2)}万` : num
},
// 字符串转DOM
s2d: (string) => {
return new DOMParser().parseFromString(string, 'text/html').body
.childNodes[0]
},
}
const getListItemTemplete = (prop) => {
return `
<div class="bili-dyn-live-users__item">
<a href="${prop.link}" target="_blank" style="display: flex">
<div class="bili-dyn-live-users__item__left">
<div class="bili-dyn-live-users__item__face-container">
<div class="bili-dyn-live-users__item__face">
<div class="bili-awesome-img" style="background-image: url(${prop.face.slice(6)}@47w_47h_1c.webp);">
</div>
</div>
</div>
</div>
<div class="bili-dyn-live-users__item__right">
<div class="bili-dyn-live-users__item__uname bili-ellipsis">
${prop.uname}
</div>
<div class="bili-dyn-live-users__item__title bili-ellipsis">
${prop.title}
</div>
</div>
</a>
</div>
`
}
const getCardTemplete = async (params) => {
const {mid, x, y} = params;
let data = await API.getCard(mid);
let card = data.card;
return `
<div data-v-6c7ff250="" class="userinfo-wrapper" style="top: ${x}px; left: ${y}px">
<div data-v-1b335720="" data-v-6c7ff250="" class="userinfo-content">
<!---->
<div data-v-1b335720="" class="bg" style="
background-image: url('${data.space.l_img.slice(5)}@120h.webp');
"></div>
<a data-v-1b335720="" href="//space.bilibili.com/${mid}/dynamic" target="_blank" class="face">
<img
data-v-1b335720="" src="${card.face.slice(5)}@50w_50h_1c.webp" />
${card.official_verify.type !== -1 ? `<div data-v-1b335720="" class="verify-box type-${card.official_verify.type}"></div>` : ''}
</a>
<div data-v-1b335720="" class="info">
<p data-v-1b335720="" class="user">
<a data-v-1b335720="" target="_blank" href="//space.bilibili.com/${mid}/dynamic" class="name ${card.vip.status === 0 ? '' : 'vip'}"
${card.vip.status === 0 ? '' : 'style="color: rgb(251, 114, 153)"'}>${card.name}</a>
<!----><a data-v-1b335720="" target="_blank" href="//www.bilibili.com/html/help.html#k_5"><img
data-v-1b335720=""
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAI+SURBVHgB7ZcxbNNAFIb/M0lKsSNgadaSmVZstExIBQmkimaFDgixIhqYEDMgJpoCY1GnlhkhYAkrYu8e5mRBiDptCM31Xlq7cc7xpXGU1NL7Flt353vvv3v33hlgGIZhGIZhEovAGPizeHtFShQxIBJYu/jlW4neUxgDyoGCWrppDIiAXFKPoIDfi7euW8K6jxEgIadJBWFdykPYtvmbWhWtWk1r9wUIiFUp5RWMEHI++/Z93+N3Hj/C/q9KcA7/TeICRkw/Kx8Y7+jjrbBJs+sbOP/5K+xXr2Fisvi0PTb7YSPUIWsq157PWXuHzJ0CBkW6LlrVqtauHWJhO7ByucPOmVmYSF2e8R09k8/j//Z2oD+9cONoPtXftf2dtFSM/334ACfFQsJJvICx1IEwKHQn7i737KcQa34va+2nSICNs/eWI8e4SkT3GeMQGhaUJps/f2jt6blrkfViqAJSV+e1LabU2g/S3cFuaVWfc302UkDsECLDHhNLhcBBpCKXnps/HlutYdjEFlB/+SJQIekgUvEiIRn19KAMsvdxE8PGGEKTxSdaG8VrY2vzsLyrzOA+f9a+dngV/Jxa+U7I+XrpDaKgNBpmSzgOYgnILNwMbW+Wy/7NMEyER0Ot+t6WeeUpznvZimLgEOq+GXoiOsPJ6HzdRVy0HSBHdtV2i6lcz48odLqzjfctiaAz0KtydrJfqRhtmWyGhtA/g+EoyPHGCQ5rHFuEL4B+lIWUK0gAEuITGIZhGIZhmORzAFVa0dNZxTNHAAAAAElFTkSuQmCC"
class="level" /></a>
<span data-v-1b335720="" class="vip-label" style="
background-color: rgb(251, 114, 153);
color: rgb(255, 255, 255);
"><span data-v-1b335720="" class="label-size">年度大会员</span></span>
</p>
<p data-v-1b335720="" class="social">
<a data-v-1b335720="" href="//space.bilibili.com/7706705/fans/follow" target="_blank"><span data-v-1b335720=""
class="follow">281</span><span data-v-1b335720="" class="label">关注</span></a><a data-v-1b335720=""
href="//space.bilibili.com/7706705/fans/fans" target="_blank"><span data-v-1b335720=""
class="fans">48.5万</span><span data-v-1b335720="" class="label">粉丝</span></a><span data-v-1b335720=""><span
data-v-1b335720="" class="like">202.3万</span><span data-v-1b335720="" class="label">获赞</span></span>
</p>
<p data-v-1b335720="" class="verify-desc">
<i data-v-1b335720="" class="verify-icon type--0"></i><span data-v-1b335720="">bilibili个人认证:bilibili
直播高能主播</span>
</p>
<p data-v-1b335720="" class="sign">
${card.sign}
</p>
</div>
<div data-v-1b335720="" class="btn-box">
<a data-v-1b335720="" class="like liked"><span data-v-1b335720="">已关注</span></a><a data-v-1b335720=""
href="//message.bilibili.com/#whisper/mid7706705" target="_blank" class="message">发消息</a>
</div>
</div>
</div>
`
}
const init = async () => {
const liveUpListDom = document.querySelector('.bili-dyn-live-users__body');
const allLiver = await API.getLiver((await API.getLiver()).count);
const items = allLiver.items ?? []
liveUpListDom.textContent = ''
items.forEach(item => liveUpListDom.append(Tool.s2d(getListItemTemplete(item))));
document.querySelector('.bili-dyn-live-users__title span').innerHTML = `(${items.length})`
}
const addRefleshBtn = () => {
let header = document.querySelector('.bili-dyn-live-users__header');
if (!header) {
const left = document.querySelector('.bili-dyn-home--member .left')
left.insertAdjacentHTML('beforeend', '<section class="sticky"><div class="bili-dyn-live-users"><div class="bili-dyn-live-users__header"><div class="bili-dyn-live-users__title"> 正在直播 <span>(0)</span></div> <div class="bili-dyn-live-users__more"> 更多 </div></div> <div class="bili-dyn-live-users__body"></div></div></section>')
header = document.querySelector('.bili-dyn-live-users__header');
header._fake = true
}
const more = document.querySelector('.bili-dyn-live-users__more');
if (header._fake) {
more.addEventListener('click', () => window.open('https://link.bilibili.com/p/center/index#/user-center/follow/1'))
}
const refleshBtn = Tool.s2d(`
<button style="background: white; color: #99a2aa; cursor: pointer; border: #99a2aa;font-size: 12px;">刷新</button>
`);
try {
header.insertBefore(refleshBtn, more);
refleshBtn.addEventListener('click', async () => {
refleshBtn.innerHTML = '正在刷新';
await init();
refleshBtn.innerHTML = '刷新';
});
refleshBtn.onmouseover = () => {
refleshBtn.style.color = '#00a1d6';
}
refleshBtn.onmouseout = () => {
refleshBtn.style.color = '#99a2aa';
}
} catch (error) {
console.log(error);
}
}
window.addEventListener(
'load',
() => {
addRefleshBtn();
init();
},
)
})();
兄弟,现在似乎头像显示不出来了
我找了一个差不多的,Bilibili Evolved脚本里的直播信息扩充插件,但是只能显示十个且没有刷新按钮
头像显示不出+1,其他版本的也尝试了
随便改了改,暂且能用的程度,稳定性堪忧。现在属于一坨()的状态,最好来个人把它重新做一下。
// ==UserScript==
// @name B站动态首页展示所有正在直播列表
// @namespace http://tampermonkey.net/
// @version 0.2.5.alpha.1
// @description 直接在动态首页展示所有的正在直播名单,而不是默认10个
// @author tuntun, fixed by Laster2800
// @noframes
// @match https://t.bilibili.com/*
// @icon https://www.google.com/s2/favicons?domain=bilibili.com
// @grant GM_addStyle
// @license MIT
// ==/UserScript==
(function () {
'use strict';
GM_addStyle(`
.bili-dyn-live-users {
max-height: calc(100vh - 276px);
overflow-y: overlay;
}
.bili-dyn-live-users::-webkit-scrollbar {
width: 10px; /*滚动条的宽度*/
height: 8px; /*滚动条的高度*/
opacity: 0;
}
.bili-dyn-live-users::-webkit-scrollbar-track-piece {
background-color: #fff; /*滚动条的背景颜色*/
-webkit-border-radius: 0; /*滚动条的圆角宽度*/
opacity: 0;
}
.bili-dyn-live-users::-webkit-scrollbar-thumb {
height: 50px;
background-color: #ccc;
-webkit-border-radius: 4px;
outline: 2px solid #fff;
outline-offset: -2px;
border: 2px solid #fff;
display: none;
}
.bili-dyn-live-users::-webkit-scrollbar-thumb:hover {
background-color: #9f9f9f;
}
.bili-dyn-live-users:hover::-webkit-scrollbar-thumb {
display: block;
}
.bili-dyn-live-users::-webkit-scrollbar-track {
display: none;
}
.bili-dyn-live-users::-webkit-scrollbar-track-piece {
display: none;
}
`)
const API = {
// 封装get方法
Get: async (props) => {
const { url: baseUrl, params = {} } = props;
let pStr = Object.keys(params).map((key) => {
return `${key}=${params[key]}`;
}).join('&');
let url = `${baseUrl}${pStr !== '' ? '?' : ''}${pStr}`;
try {
let res = await fetch(url, {
credentials: "include"
});
return (await res.json()).data;
} catch (error) {
console.error('Get Error', error);
}
},
// 通过关键词获取视频数据
getLiver: async (num = 0) => {
try {
let params = {};
if (num !== 0) {
params = {
size: num
}
}
let res = await API.Get({
url: 'https://api.vc.bilibili.com/dynamic_svr/v1/dynamic_svr/w_live_users',
params,
});
return res;
} catch (error) {
console.log('getLiver', error);
}
},
getCard: async (mid) => {
try {
let res = await API.Get({
url: 'https://api.bilibili.com/x/web-interface/card',
params: {
mid,
photo: 'true',
},
});
return res;
} catch (error) {
console.log('getCard', error);
}
}
}
const Tool = {
// 大数转万
formatBigNumber: (num) => {
return num > 10000 ? `${(num / 10000).toFixed(2)}万` : num
},
// 字符串转DOM
s2d: (string) => {
return new DOMParser().parseFromString(string, 'text/html').body
.childNodes[0]
},
}
const getListItemTemplete = (prop) => {
return `
<a class="bili-dyn-live-users__item" href="${prop.link}" target="_blank">
<div class="bili-dyn-live-users__item__left">
<div class="bili-dyn-live-users__item__face-container">
<div class="bili-dyn-live-users__item__face">
<div class="b-img--face b-img">
<picture class="b-img__inner">
<source type="image/avif" srcset="${prop.face.slice(6)}@76w_76h_!web-dynamic.avif">
<source type="image/webp" srcset="${prop.face.slice(6)}@76w_76h_!web-dynamic.webp">
<img src="${prop.face.slice(6)}@76w_76h_!web-dynamic.webp" loading="lazy" onload="bmgCmptOnload(this)">
</picture>
</div>
</div>
</div>
</div>
<div class="bili-dyn-live-users__item__right">
<div class="bili-dyn-live-users__item__uname bili-ellipsis">${prop.uname}</div>
<div class="bili-dyn-live-users__item__title bili-ellipsis">${prop.title}</div>
</div>
</a>
`
}
const getCardTemplete = async (params) => {
const {mid, x, y} = params;
let data = await API.getCard(mid);
let card = data.card;
return `
<div data-v-6c7ff250="" class="userinfo-wrapper" style="top: ${x}px; left: ${y}px">
<div data-v-1b335720="" data-v-6c7ff250="" class="userinfo-content">
<!---->
<div data-v-1b335720="" class="bg" style="
background-image: url('${data.space.l_img.slice(5)}@120h.webp');
"></div>
<a data-v-1b335720="" href="//space.bilibili.com/${mid}/dynamic" target="_blank" class="face">
<img
data-v-1b335720="" src="${card.face.slice(5)}@50w_50h_1c.webp" />
${card.official_verify.type !== -1 ? `<div data-v-1b335720="" class="verify-box type-${card.official_verify.type}"></div>` : ''}
</a>
<div data-v-1b335720="" class="info">
<p data-v-1b335720="" class="user">
<a data-v-1b335720="" target="_blank" href="//space.bilibili.com/${mid}/dynamic" class="name ${card.vip.status === 0 ? '' : 'vip'}"
${card.vip.status === 0 ? '' : 'style="color: rgb(251, 114, 153)"'}>${card.name}</a>
<!----><a data-v-1b335720="" target="_blank" href="//www.bilibili.com/html/help.html#k_5"><img
data-v-1b335720=""
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAI+SURBVHgB7ZcxbNNAFIb/M0lKsSNgadaSmVZstExIBQmkimaFDgixIhqYEDMgJpoCY1GnlhkhYAkrYu8e5mRBiDptCM31Xlq7cc7xpXGU1NL7Flt353vvv3v33hlgGIZhGIZhEovAGPizeHtFShQxIBJYu/jlW4neUxgDyoGCWrppDIiAXFKPoIDfi7euW8K6jxEgIadJBWFdykPYtvmbWhWtWk1r9wUIiFUp5RWMEHI++/Z93+N3Hj/C/q9KcA7/TeICRkw/Kx8Y7+jjrbBJs+sbOP/5K+xXr2Fisvi0PTb7YSPUIWsq157PWXuHzJ0CBkW6LlrVqtauHWJhO7ByucPOmVmYSF2e8R09k8/j//Z2oD+9cONoPtXftf2dtFSM/334ACfFQsJJvICx1IEwKHQn7i737KcQa34va+2nSICNs/eWI8e4SkT3GeMQGhaUJps/f2jt6blrkfViqAJSV+e1LabU2g/S3cFuaVWfc302UkDsECLDHhNLhcBBpCKXnps/HlutYdjEFlB/+SJQIekgUvEiIRn19KAMsvdxE8PGGEKTxSdaG8VrY2vzsLyrzOA+f9a+dngV/Jxa+U7I+XrpDaKgNBpmSzgOYgnILNwMbW+Wy/7NMEyER0Ot+t6WeeUpznvZimLgEOq+GXoiOsPJ6HzdRVy0HSBHdtV2i6lcz48odLqzjfctiaAz0KtydrJfqRhtmWyGhtA/g+EoyPHGCQ5rHFuEL4B+lIWUK0gAEuITGIZhGIZhmORzAFVa0dNZxTNHAAAAAElFTkSuQmCC"
class="level" /></a>
<span data-v-1b335720="" class="vip-label" style="
background-color: rgb(251, 114, 153);
color: rgb(255, 255, 255);
"><span data-v-1b335720="" class="label-size">年度大会员</span></span>
</p>
<p data-v-1b335720="" class="social">
<a data-v-1b335720="" href="//space.bilibili.com/7706705/fans/follow" target="_blank"><span data-v-1b335720=""
class="follow">281</span><span data-v-1b335720="" class="label">关注</span></a><a data-v-1b335720=""
href="//space.bilibili.com/7706705/fans/fans" target="_blank"><span data-v-1b335720=""
class="fans">48.5万</span><span data-v-1b335720="" class="label">粉丝</span></a><span data-v-1b335720=""><span
data-v-1b335720="" class="like">202.3万</span><span data-v-1b335720="" class="label">获赞</span></span>
</p>
<p data-v-1b335720="" class="verify-desc">
<i data-v-1b335720="" class="verify-icon type--0"></i><span data-v-1b335720="">bilibili个人认证:bilibili
直播高能主播</span>
</p>
<p data-v-1b335720="" class="sign">
${card.sign}
</p>
</div>
<div data-v-1b335720="" class="btn-box">
<a data-v-1b335720="" class="like liked"><span data-v-1b335720="">已关注</span></a><a data-v-1b335720=""
href="//message.bilibili.com/#whisper/mid7706705" target="_blank" class="message">发消息</a>
</div>
</div>
</div>
`
}
const init = async () => {
const liveUpListDom = document.querySelector('.bili-dyn-live-users__body');
const allLiver = await API.getLiver((await API.getLiver()).count);
const items = allLiver.items ?? []
liveUpListDom.textContent = ''
items.forEach(item => liveUpListDom.append(Tool.s2d(getListItemTemplete(item))));
document.querySelector('.bili-dyn-live-users__title span').innerHTML = `(${items.length})`
}
const addRefleshBtn = () => {
let header = document.querySelector('.bili-dyn-live-users__header');
if (!header) {
const left = document.querySelector('.bili-dyn-home--member .left')
left.insertAdjacentHTML('beforeend', '<section class="sticky"><div class="bili-dyn-live-users"><div class="bili-dyn-live-users__header"><div class="bili-dyn-live-users__title"> 正在直播 <span>(0)</span></div> <div class="bili-dyn-live-users__more"> 更多 </div></div> <div class="bili-dyn-live-users__body"></div></div></section>')
header = document.querySelector('.bili-dyn-live-users__header');
header._fake = true
}
const more = document.querySelector('.bili-dyn-live-users__more');
if (header._fake) {
more.addEventListener('click', () => window.open('https://link.bilibili.com/p/center/index#/user-center/follow/1'))
}
const refleshBtn = Tool.s2d(`
<button style="background: white; color: #99a2aa; cursor: pointer; border: #99a2aa;font-size: 12px;">刷新</button>
`);
try {
header.insertBefore(refleshBtn, more);
refleshBtn.addEventListener('click', async () => {
refleshBtn.innerHTML = '正在刷新';
await init();
refleshBtn.innerHTML = '刷新';
});
refleshBtn.onmouseover = () => {
refleshBtn.style.color = '#00a1d6';
}
refleshBtn.onmouseout = () => {
refleshBtn.style.color = '#99a2aa';
}
} catch (error) {
console.log(error);
}
}
window.addEventListener(
'load',
() => setTimeout(() => {
addRefleshBtn();
init();
}, 2000)
)
})();
原来不止我一个人头像显示不出,这个脚本很好用的,头像只是小问题,当然能解决了最好
用了下上面恢复头像的代码,现在在直播列表中移到头像上没有用户卡片显示,这代码里只有个半成品,只能用getCard获取数据,应该是没想到要怎么显示出来,官方的代码是用mouseenter中的js脚本来实现的,但点进去那段代码实在是看不懂,逆向太麻烦了...
又不行了,再瞎改改:
// ==UserScript==
// @name B站动态首页展示所有正在直播列表
// @namespace http://tampermonkey.net/
// @version 0.2.5.alpha.6
// @description 直接在动态首页展示所有的正在直播名单,而不是默认10个
// @author tuntun, fixed by Laster2800
// @noframes
// @match https://t.bilibili.com/*
// @icon https://www.google.com/s2/favicons?domain=bilibili.com
// @grant GM_addStyle
// @license MIT
// ==/UserScript==
(function () {
'use strict';
GM_addStyle(`
.bili-dyn-live-users {
max-height: calc(100vh - 276px);
overflow-y: overlay;
}
.bili-dyn-live-users::-webkit-scrollbar {
width: 10px; /*滚动条的宽度*/
height: 8px; /*滚动条的高度*/
opacity: 0;
}
.bili-dyn-live-users::-webkit-scrollbar-track-piece {
background-color: #fff; /*滚动条的背景颜色*/
-webkit-border-radius: 0; /*滚动条的圆角宽度*/
opacity: 0;
}
.bili-dyn-live-users::-webkit-scrollbar-thumb {
height: 50px;
background-color: #ccc;
-webkit-border-radius: 4px;
outline: 2px solid #fff;
outline-offset: -2px;
border: 2px solid #fff;
display: none;
}
.bili-dyn-live-users::-webkit-scrollbar-thumb:hover {
background-color: #9f9f9f;
}
.bili-dyn-live-users:hover::-webkit-scrollbar-thumb {
display: block;
}
.bili-dyn-live-users::-webkit-scrollbar-track {
display: none;
}
.bili-dyn-live-users::-webkit-scrollbar-track-piece {
display: none;
}
`)
const API = {
// 封装get方法
Get: async (props) => {
const { url: baseUrl, params = {} } = props;
let pStr = Object.keys(params).map((key) => {
return `${key}=${params[key]}`;
}).join('&');
let url = `${baseUrl}${pStr !== '' ? '?' : ''}${pStr}`;
try {
let res = await fetch(url, {
credentials: "include"
});
return (await res.json()).data;
} catch (error) {
console.error('Get Error', error);
}
},
// 通过关键词获取视频数据
getLiver: async () => {
try {
const res = await API.Get({ url: 'https://api.bilibili.com/x/polymer/web-dynamic/v1/portal' });
return res.live_users;
} catch (error) {
console.log('getLiver', error);
}
},
getCard: async (mid) => {
try {
let res = await API.Get({
url: 'https://api.bilibili.com/x/web-interface/card',
params: {
mid,
photo: 'true',
},
});
return res;
} catch (error) {
console.log('getCard', error);
}
}
}
const Tool = {
// 大数转万
formatBigNumber: (num) => {
return num > 10000 ? `${(num / 10000).toFixed(2)}万` : num
},
// 字符串转DOM
s2d: (string) => {
return new DOMParser().parseFromString(string, 'text/html').body
.childNodes[0]
},
}
const getListItemTemplate = (prop) => {
return `<div class="bili-dyn-live-users__container"><a href="${prop.jump_url}" target="_blank"><div class="bili-dyn-live-users__item-container"><div class="bili-dyn-live-users__item"><div class="bili-dyn-live-users__item__left"><div class="bili-dyn-live-users__item__face"><div class="b-img--face b-img"><picture class="b-img__inner"><source type="image/avif" srcset="${prop.face}@96w_96h_!web-dynamic.avif"><source type="image/webp" srcset="${prop.face}@96w_96h_!web-dynamic.webp"><img src="${prop.face}@96w_96h_!web-dynamic.webp" loading="lazy" onload="bmgCmptOnload(this)" onerror="bmgCmptOnerror(this)"></picture></div></div> <div class="bili-dyn-live-users__item__living"></div></div> <div class="bili-dyn-live-users__item__right"><div class="bili-dyn-live-users__item__uname bili-ellipsis">${prop.uname}</div> <div class="bili-dyn-live-users__item__title bili-ellipsis">${prop.title}</div></div></div></div></a></div>`
}
const getCardTemplete = async (params) => {
const {mid, x, y} = params;
let data = await API.getCard(mid);
let card = data.card;
return `
<div data-v-6c7ff250="" class="userinfo-wrapper" style="top: ${x}px; left: ${y}px">
<div data-v-1b335720="" data-v-6c7ff250="" class="userinfo-content">
<!---->
<div data-v-1b335720="" class="bg" style="
background-image: url('${data.space.l_img.slice(5)}@120h.webp');
"></div>
<a data-v-1b335720="" href="//space.bilibili.com/${mid}/dynamic" target="_blank" class="face">
<img
data-v-1b335720="" src="${card.face.slice(5)}@50w_50h_1c.webp" />
${card.official_verify.type !== -1 ? `<div data-v-1b335720="" class="verify-box type-${card.official_verify.type}"></div>` : ''}
</a>
<div data-v-1b335720="" class="info">
<p data-v-1b335720="" class="user">
<a data-v-1b335720="" target="_blank" href="//space.bilibili.com/${mid}/dynamic" class="name ${card.vip.status === 0 ? '' : 'vip'}"
${card.vip.status === 0 ? '' : 'style="color: rgb(251, 114, 153)"'}>${card.name}</a>
<!----><a data-v-1b335720="" target="_blank" href="//www.bilibili.com/html/help.html#k_5"><img
data-v-1b335720=""
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAI+SURBVHgB7ZcxbNNAFIb/M0lKsSNgadaSmVZstExIBQmkimaFDgixIhqYEDMgJpoCY1GnlhkhYAkrYu8e5mRBiDptCM31Xlq7cc7xpXGU1NL7Flt353vvv3v33hlgGIZhGIZhEovAGPizeHtFShQxIBJYu/jlW4neUxgDyoGCWrppDIiAXFKPoIDfi7euW8K6jxEgIadJBWFdykPYtvmbWhWtWk1r9wUIiFUp5RWMEHI++/Z93+N3Hj/C/q9KcA7/TeICRkw/Kx8Y7+jjrbBJs+sbOP/5K+xXr2Fisvi0PTb7YSPUIWsq157PWXuHzJ0CBkW6LlrVqtauHWJhO7ByucPOmVmYSF2e8R09k8/j//Z2oD+9cONoPtXftf2dtFSM/334ACfFQsJJvICx1IEwKHQn7i737KcQa34va+2nSICNs/eWI8e4SkT3GeMQGhaUJps/f2jt6blrkfViqAJSV+e1LabU2g/S3cFuaVWfc302UkDsECLDHhNLhcBBpCKXnps/HlutYdjEFlB/+SJQIekgUvEiIRn19KAMsvdxE8PGGEKTxSdaG8VrY2vzsLyrzOA+f9a+dngV/Jxa+U7I+XrpDaKgNBpmSzgOYgnILNwMbW+Wy/7NMEyER0Ot+t6WeeUpznvZimLgEOq+GXoiOsPJ6HzdRVy0HSBHdtV2i6lcz48odLqzjfctiaAz0KtydrJfqRhtmWyGhtA/g+EoyPHGCQ5rHFuEL4B+lIWUK0gAEuITGIZhGIZhmORzAFVa0dNZxTNHAAAAAElFTkSuQmCC"
class="level" /></a>
<span data-v-1b335720="" class="vip-label" style="
background-color: rgb(251, 114, 153);
color: rgb(255, 255, 255);
"><span data-v-1b335720="" class="label-size">年度大会员</span></span>
</p>
<p data-v-1b335720="" class="social">
<a data-v-1b335720="" href="//space.bilibili.com/7706705/fans/follow" target="_blank"><span data-v-1b335720=""
class="follow">281</span><span data-v-1b335720="" class="label">关注</span></a><a data-v-1b335720=""
href="//space.bilibili.com/7706705/fans/fans" target="_blank"><span data-v-1b335720=""
class="fans">48.5万</span><span data-v-1b335720="" class="label">粉丝</span></a><span data-v-1b335720=""><span
data-v-1b335720="" class="like">202.3万</span><span data-v-1b335720="" class="label">获赞</span></span>
</p>
<p data-v-1b335720="" class="verify-desc">
<i data-v-1b335720="" class="verify-icon type--0"></i><span data-v-1b335720="">bilibili个人认证:bilibili
直播高能主播</span>
</p>
<p data-v-1b335720="" class="sign">
${card.sign}
</p>
</div>
<div data-v-1b335720="" class="btn-box">
<a data-v-1b335720="" class="like liked"><span data-v-1b335720="">已关注</span></a><a data-v-1b335720=""
href="//message.bilibili.com/#whisper/mid7706705" target="_blank" class="message">发消息</a>
</div>
</div>
</div>
`
}
const init = async () => {
const liveUpListDom = document.querySelector('.bili-dyn-live-users__body');
const allLiver = await API.getLiver();
const items = allLiver.items ?? []
liveUpListDom.textContent = ''
items.forEach(item => liveUpListDom.append(Tool.s2d(getListItemTemplate(item))));
document.querySelector('.bili-dyn-live-users__title span').innerHTML = `${items.length}`
}
const addRefleshBtn = () => {
let header = document.querySelector('.bili-dyn-live-users__header');
if (!header) {
const left = document.querySelector('.bili-dyn-home--member .left')
left.insertAdjacentHTML('beforeend', '<section class="sticky"><div class="bili-dyn-live-users"><div class="bili-dyn-live-users__header"><div class="bili-dyn-live-users__title"> 直播 <span>0</span></div> <div class="bili-dyn-live-users__more"> 更多 </div></div> <div class="bili-dyn-live-users__body"></div></div></section>')
header = document.querySelector('.bili-dyn-live-users__header');
header._fake = true
}
const more = document.querySelector('.bili-dyn-live-users__more');
if (header._fake) {
more.addEventListener('click', () => window.open('https://link.bilibili.com/p/center/index#/user-center/follow/1'))
}
const refleshBtn = Tool.s2d(`
<button style="background:white;color:#9499a0;cursor:pointer;border:none;font-size:13px">刷新</button>
`);
try {
header.insertBefore(refleshBtn, more);
refleshBtn.addEventListener('click', async () => {
refleshBtn.innerHTML = '. . .';
await init();
refleshBtn.innerHTML = '刷新';
});
refleshBtn.onmouseover = () => {
refleshBtn.style.color = '#00a1d6';
}
refleshBtn.onmouseout = () => {
refleshBtn.style.color = '#99a2aa';
}
} catch (error) {
console.log(error);
}
}
window.addEventListener(
'load',
() => setTimeout(() => {
addRefleshBtn();
init();
}, 2000)
)
})();
感谢分享!
如果这个不能用了,也找到了替补
脚本 Bilibili Evolved 中有一个“直播信息扩充”的功能可以用。
又不行了,再瞎改改:
// ==UserScript== // @name B站动态首页展示所有正在直播列表 // @namespace http://tampermonkey.net/ // @version 0.2.5.alpha.6 // @description 直接在动态首页展示所有的正在直播名单,而不是默认10个 // @author tuntun, fixed by Laster2800 // @noframes // @match https://t.bilibili.com/* // @icon https://www.google.com/s2/favicons?domain=bilibili.com // @grant GM_addStyle // @license MIT // ==/UserScript== (function () { 'use strict'; GM_addStyle(` .bili-dyn-live-users { max-height: calc(100vh - 276px); overflow-y: overlay; } .bili-dyn-live-users::-webkit-scrollbar { width: 10px; /*滚动条的宽度*/ height: 8px; /*滚动条的高度*/ opacity: 0; } .bili-dyn-live-users::-webkit-scrollbar-track-piece { background-color: #fff; /*滚动条的背景颜色*/ -webkit-border-radius: 0; /*滚动条的圆角宽度*/ opacity: 0; } .bili-dyn-live-users::-webkit-scrollbar-thumb { height: 50px; background-color: #ccc; -webkit-border-radius: 4px; outline: 2px solid #fff; outline-offset: -2px; border: 2px solid #fff; display: none; } .bili-dyn-live-users::-webkit-scrollbar-thumb:hover { background-color: #9f9f9f; } .bili-dyn-live-users:hover::-webkit-scrollbar-thumb { display: block; } .bili-dyn-live-users::-webkit-scrollbar-track { display: none; } .bili-dyn-live-users::-webkit-scrollbar-track-piece { display: none; } `) const API = { // 封装get方法 Get: async (props) => { const { url: baseUrl, params = {} } = props; let pStr = Object.keys(params).map((key) => { return `${key}=${params[key]}`; }).join('&'); let url = `${baseUrl}${pStr !== '' ? '?' : ''}${pStr}`; try { let res = await fetch(url, { credentials: "include" }); return (await res.json()).data; } catch (error) { console.error('Get Error', error); } }, // 通过关键词获取视频数据 getLiver: async () => { try { const res = await API.Get({ url: 'https://api.bilibili.com/x/polymer/web-dynamic/v1/portal' }); return res.live_users; } catch (error) { console.log('getLiver', error); } }, getCard: async (mid) => { try { let res = await API.Get({ url: 'https://api.bilibili.com/x/web-interface/card', params: { mid, photo: 'true', }, }); return res; } catch (error) { console.log('getCard', error); } } } const Tool = { // 大数转万 formatBigNumber: (num) => { return num > 10000 ? `${(num / 10000).toFixed(2)}万` : num }, // 字符串转DOM s2d: (string) => { return new DOMParser().parseFromString(string, 'text/html').body .childNodes[0] }, } const getListItemTemplate = (prop) => { return `<div class="bili-dyn-live-users__container"><a href="${prop.jump_url}" target="_blank"><div class="bili-dyn-live-users__item-container"><div class="bili-dyn-live-users__item"><div class="bili-dyn-live-users__item__left"><div class="bili-dyn-live-users__item__face"><div class="b-img--face b-img"><picture class="b-img__inner"><source type="image/avif" srcset="${prop.face}@96w_96h_!web-dynamic.avif"><source type="image/webp" srcset="${prop.face}@96w_96h_!web-dynamic.webp"><img src="${prop.face}@96w_96h_!web-dynamic.webp" loading="lazy" onload="bmgCmptOnload(this)" onerror="bmgCmptOnerror(this)"></picture></div></div> <div class="bili-dyn-live-users__item__living"></div></div> <div class="bili-dyn-live-users__item__right"><div class="bili-dyn-live-users__item__uname bili-ellipsis">${prop.uname}</div> <div class="bili-dyn-live-users__item__title bili-ellipsis">${prop.title}</div></div></div></div></a></div>` } const getCardTemplete = async (params) => { const {mid, x, y} = params; let data = await API.getCard(mid); let card = data.card; return ` <div data-v-6c7ff250="" class="userinfo-wrapper" style="top: ${x}px; left: ${y}px"> <div data-v-1b335720="" data-v-6c7ff250="" class="userinfo-content"> <!----> <div data-v-1b335720="" class="bg" style=" background-image: url('${data.space.l_img.slice(5)}@120h.webp'); "></div> <a data-v-1b335720="" href="//space.bilibili.com/${mid}/dynamic" target="_blank" class="face"> <img data-v-1b335720="" src="${card.face.slice(5)}@50w_50h_1c.webp" /> ${card.official_verify.type !== -1 ? `<div data-v-1b335720="" class="verify-box type-${card.official_verify.type}"></div>` : ''} </a> <div data-v-1b335720="" class="info"> <p data-v-1b335720="" class="user"> <a data-v-1b335720="" target="_blank" href="//space.bilibili.com/${mid}/dynamic" class="name ${card.vip.status === 0 ? '' : 'vip'}" ${card.vip.status === 0 ? '' : 'style="color: rgb(251, 114, 153)"'}>${card.name}</a> <!----><a data-v-1b335720="" target="_blank" href="//www.bilibili.com/html/help.html#k_5"><img data-v-1b335720="" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAI+SURBVHgB7ZcxbNNAFIb/M0lKsSNgadaSmVZstExIBQmkimaFDgixIhqYEDMgJpoCY1GnlhkhYAkrYu8e5mRBiDptCM31Xlq7cc7xpXGU1NL7Flt353vvv3v33hlgGIZhGIZhEovAGPizeHtFShQxIBJYu/jlW4neUxgDyoGCWrppDIiAXFKPoIDfi7euW8K6jxEgIadJBWFdykPYtvmbWhWtWk1r9wUIiFUp5RWMEHI++/Z93+N3Hj/C/q9KcA7/TeICRkw/Kx8Y7+jjrbBJs+sbOP/5K+xXr2Fisvi0PTb7YSPUIWsq157PWXuHzJ0CBkW6LlrVqtauHWJhO7ByucPOmVmYSF2e8R09k8/j//Z2oD+9cONoPtXftf2dtFSM/334ACfFQsJJvICx1IEwKHQn7i737KcQa34va+2nSICNs/eWI8e4SkT3GeMQGhaUJps/f2jt6blrkfViqAJSV+e1LabU2g/S3cFuaVWfc302UkDsECLDHhNLhcBBpCKXnps/HlutYdjEFlB/+SJQIekgUvEiIRn19KAMsvdxE8PGGEKTxSdaG8VrY2vzsLyrzOA+f9a+dngV/Jxa+U7I+XrpDaKgNBpmSzgOYgnILNwMbW+Wy/7NMEyER0Ot+t6WeeUpznvZimLgEOq+GXoiOsPJ6HzdRVy0HSBHdtV2i6lcz48odLqzjfctiaAz0KtydrJfqRhtmWyGhtA/g+EoyPHGCQ5rHFuEL4B+lIWUK0gAEuITGIZhGIZhmORzAFVa0dNZxTNHAAAAAElFTkSuQmCC" class="level" /></a> <span data-v-1b335720="" class="vip-label" style=" background-color: rgb(251, 114, 153); color: rgb(255, 255, 255); "><span data-v-1b335720="" class="label-size">年度大会员</span></span> </p> <p data-v-1b335720="" class="social"> <a data-v-1b335720="" href="//space.bilibili.com/7706705/fans/follow" target="_blank"><span data-v-1b335720="" class="follow">281</span><span data-v-1b335720="" class="label">关注</span></a><a data-v-1b335720="" href="//space.bilibili.com/7706705/fans/fans" target="_blank"><span data-v-1b335720="" class="fans">48.5万</span><span data-v-1b335720="" class="label">粉丝</span></a><span data-v-1b335720=""><span data-v-1b335720="" class="like">202.3万</span><span data-v-1b335720="" class="label">获赞</span></span> </p> <p data-v-1b335720="" class="verify-desc"> <i data-v-1b335720="" class="verify-icon type--0"></i><span data-v-1b335720="">bilibili个人认证:bilibili 直播高能主播</span> </p> <p data-v-1b335720="" class="sign"> ${card.sign} </p> </div> <div data-v-1b335720="" class="btn-box"> <a data-v-1b335720="" class="like liked"><span data-v-1b335720="">已关注</span></a><a data-v-1b335720="" href="//message.bilibili.com/#whisper/mid7706705" target="_blank" class="message">发消息</a> </div> </div> </div> ` } const init = async () => { const liveUpListDom = document.querySelector('.bili-dyn-live-users__body'); const allLiver = await API.getLiver(); const items = allLiver.items ?? [] liveUpListDom.textContent = '' items.forEach(item => liveUpListDom.append(Tool.s2d(getListItemTemplate(item)))); document.querySelector('.bili-dyn-live-users__title span').innerHTML = `${items.length}` } const addRefleshBtn = () => { let header = document.querySelector('.bili-dyn-live-users__header'); if (!header) { const left = document.querySelector('.bili-dyn-home--member .left') left.insertAdjacentHTML('beforeend', '<section class="sticky"><div class="bili-dyn-live-users"><div class="bili-dyn-live-users__header"><div class="bili-dyn-live-users__title"> 直播 <span>0</span></div> <div class="bili-dyn-live-users__more"> 更多 </div></div> <div class="bili-dyn-live-users__body"></div></div></section>') header = document.querySelector('.bili-dyn-live-users__header'); header._fake = true } const more = document.querySelector('.bili-dyn-live-users__more'); if (header._fake) { more.addEventListener('click', () => window.open('https://link.bilibili.com/p/center/index#/user-center/follow/1')) } const refleshBtn = Tool.s2d(` <button style="background:white;color:#9499a0;cursor:pointer;border:none;font-size:13px">刷新</button> `); try { header.insertBefore(refleshBtn, more); refleshBtn.addEventListener('click', async () => { refleshBtn.innerHTML = '. . .'; await init(); refleshBtn.innerHTML = '刷新'; }); refleshBtn.onmouseover = () => { refleshBtn.style.color = '#00a1d6'; } refleshBtn.onmouseout = () => { refleshBtn.style.color = '#99a2aa'; } } catch (error) { console.log(error); } } window.addEventListener( 'load', () => setTimeout(() => { addRefleshBtn(); init(); }, 2000) ) })();
大佬,显示数量只有30个,请问要怎样改
没有人直播时,刷新会出错