在网页部署代码，把memos最近几条滚动展示在网页最上方。
API
使用了最新的memos v0.22.2
https://m.qs100371.vip/api/v1/memos?pageSize=5&filter=visibilities==['PUBLIC']&creator=='users/2'
其中
pageSize为查询的memo个数，
users/2为查询的用户UID。
部署代码
粘贴到网页<body>之后
<!--add memos-->
<div id="bber-talk"></div>
<script>
document.addEventListener("DOMContentLoaded", function() {
var e = document.querySelector("#bber-talk");
e && (fetchAndRenderMemos(), moment.locale("zh-CN"));
function fetchAndRenderMemos() {
var url = "https://m.qs100371.vip/api/v1/memos?pageSize=5&filter=visibilities==['PUBLIC']&creator=='users/2'";
fetch(url)
.then(response => response.json())
.then(data => {
var memosList = data.memos;
var contentHTML = memosList.map(memo => {
var createTime = memo.createTime;
var timeFromNow = moment(createTime).fromNow();
var content = memo.content;
var uid = memo.uid;
// Process content strings
var processedContent = content.replace(/!\[.*?\]\((.*?)\)/g, function(match, imageUrl) {
var cleanUrl = imageUrl.split(/[?#]/)[0];
return `<a href="${cleanUrl}" target="_blank">🌅</a>`;
}).replace(/\[(.*?)\]\((.*?)\)/g, function(match, linkText, url) {
var extension = url.split('.').pop().split(/[?#]/)[0];
var cleanUrl = url.split(/[?#]/)[0];
return /(jpg|jpeg|png|gif|bmp|webp|svg)/i.test(extension)
? `<a href="${cleanUrl}" target="_blank">🌅</a>`
: `<a href="${url}" target="_blank">${linkText} 🔗</a>`;
});
// Add externalLink from resources if it's an image
if (memo.resources) {
memo.resources.forEach(resource => {
if (resource.externalLink) {
var cleanExternalLink = resource.externalLink.split(/[?#]/)[0];
if (/(jpg|jpeg|png|gif|bmp|webp|svg)/i.test(cleanExternalLink.split('.').pop())) {
processedContent += ` <a href="${cleanExternalLink}" target="_blank">🌅</a>`;
}
}
});
}
return `<li class="item">💬 <a href="https://m.qs100371.vip/m/${uid}" target="_blank"><span class="datetime">${timeFromNow}</span>：${processedContent}</a></li>`;
}).join('');
var finalHTML = `<div class="talk-wrap"><ul class="talk-list">${contentHTML}</ul></div>`;
e && (e.innerHTML = finalHTML);
// Regularly move the first item to the end
setInterval(function() {
var itemList = document.querySelector(".talk-list");
if (itemList) {
var items = itemList.querySelectorAll(".item");
if (items.length > 0) {
itemList.appendChild(items[0]);
}
}
}, 2000);
})
.catch(error => console.error('Error fetching memos:', error));
}
});
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>
<style>.talk-list .item{display:none}.talk-list .item:nth-child(1){display:block}</style>
<script src="https://momentjs.cn/downloads/moment-with-locales.js"></script>
<!-- add memos-->
删掉💬后面的a标签可以去掉链接进入功能。
