Power BI添加访客留言功能、指标异常自动推送预警功能
无论是发布到公共Web端的、还是公司内部的Power BI报告，甚至是分享给别人的pbix文件，我们都可以添加这样一个访客留言系统：
访客添加留言信息后，点击提交：
管理员在后台就可以收到这样的信息：
也可以自动获取用户名，只输入评论信息：
实现原理是Power BI借助HTML+JS推送信息到flomo（一款笔记服务）。推送的信息在flomo网页端、手机端、微信端都可以查看。
实现过程仅需一个度量值。首先在flomo后台获取API Key：
官网/
把API Key放入下方的度量值第106行：
代码语言：javascript代码运行次数：0运行复制访客留言系统 =
"<!DOCTYPE html>
<html lang='zh-CN'>
<head>
<meta charset='UTF-8'>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<title>访客留言</title>
<style>
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
max-width: 600px;
margin: 0 auto;
padding: 20px;
color: #333;
line-height: 1.6;
}
h1 {
color: #1a73e8;
text-align: center;
}
.form-group {
margin-bottom: 20px;
}
label {
display: block;
margin-bottom: 8px;
font-weight: 500;
}
input, textarea {
width: 100%;
padding: 10px;
border: 1px solid #ddd;
border-radius: 4px;
font-family: inherit;
font-size: 16px;
}
textarea {
min-height: 120px;
resize: vertical;
}
button {
background-color: #1a73e8;
color: white;
border: none;
padding: 10px 20px;
border-radius: 4px;
font-size: 16px;
cursor: pointer;
width: 100%;
}
button:hover {
background-color: #0d5bba;
}
#response {
margin-top: 20px;
padding: 15px;
border-radius: 4px;
display: none;
}
.success {
background-color: #e6f7e6;
color: #2e7d32;
border: 1px solid #c8e6c9;
}
.error {
background-color: #ffebee;
color: #c62828;
border: 1px solid #ffcdd2;
}
</style>
</head>
<body>
<h1>访客留言</h1>
<div class='form-group'>
<label for='nickname'>昵称：</label>
<input type='text' id='nickname' placeholder='请输入您的昵称'>
</div>
<div class='form-group'>
<label for='comment'>评论：</label>
<textarea id='comment' placeholder='请输入您的评论'></textarea>
</div>
<button id='submitBtn'>提交</button>
<div id='response'></div>
<script>
document.getElementById('submitBtn').addEventListener('click', function() {
const nickname = document.getElementById('nickname').value.trim();
const comment = document.getElementById('comment').value.trim();
const responseDiv = document.getElementById('response');
if (!nickname || !comment) {
responseDiv.textContent = '请填写昵称和评论内容';
responseDiv.className = 'error';
responseDiv.style.display = 'block';
return;
}
const data = {
content: `${nickname}：${comment} #访客评论`
};
fetch('你的API Key', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(data)
})
.then(response => {
if (response.ok) {
return response.json();
}
throw new Error('网络响应不正常');
})
.then(data => {
responseDiv.textContent = '提交成功！';
responseDiv.className = 'success';
responseDiv.style.display = 'block';
document.getElementById('nickname').value = '';
document.getElementById('comment').value = '';
})
.catch(error => {
responseDiv.textContent = '提交失败: ' + error.message;
responseDiv.className = 'error';
responseDiv.style.display = 'block';
console.error('Error:', error);
});
});
</script>
</body>
</html>"把度量值放入HTML Content视觉对象，就可以愉快的玩耍了：
公司内部使用时，可以把用户昵称输入去掉，换成当前用户名。
除了用作用户留言，还可以结合当前模型数据，当指标触发预警值时，自动把信息推送给flomo：
需要说明的是，为了防止异常，flomo对API有发送限制，每天最多100条。
其他的笔记服务商如果也有类似的API推送功能，读者也可以尝试。
本文参与 腾讯云自媒体同步曝光计划，分享自微信公众号。原始发表：2025-03-30，如有侵权请联系 cloudcommunity@tencent 删除系统异常bi笔记推送