umami
umami copied to clipboard
umami-software
Get public umamic statistics more convenient
Describe the feature or enhancement
Thank you for your hard work. Umami is very good tool, I love it.
I maintain a public GitHub repository for my blog, where I aim to display the reading and visitor counts for each article. While the Umami site page can provide detailed statistics at https://umami.ovvv.top/share/BH4jm8X6bYFS2b7X/test
In my view, public Umami statistics should offer an alternative, more convenient way to access data(like get public data without need of token). Hope you could consider this.
I have actually done that using cloudflare workers to fetch the data I need and display on a page. Take a look here: https://github.com/Lisbon-Collective/umami-transparency
Hope it helps.
Technically, it already does and the implementation is up to us. I used CloudFlare workers because it allowed me to keep the login credentials away from prying eyes.
I never really looked at the roadmap for umami, but I like the way the project has been delivering a good alternative in Web Analytics.
Watch my blog here, I resolve this problem.
https://blog.ovvv.top/posts/4259ee82/
We could create a View Only user，so we could use its token to get data on front html.
code here
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div style="text-align:center;">
<h1>Umami 网站统计</h1>
<span>总访问量 <span id="umami-site-pv"></span> 次</span>
<span>总访客数 <span id="umami-site-uv"></span> 人</span>
</div>
<script>
// 从配置文件中获取 umami 的配置
const website_id = 'xxx';
// 拼接请求地址
const request_url = 'https://xxx.com' + '/api/websites/' + website_id + '/stats';
const start_time = new Date('2024-01-01').getTime();
const end_time = new Date().getTime();
const token = 'xxxxxx';
// 检查配置是否为空
if (!website_id) {
throw new Error("Umami website_id is empty");
}
if (!request_url) {
throw new Error("Umami request_url is empty");
}
if (!start_time) {
throw new Error("Umami start_time is empty");
}
if (!token) {
throw new Error("Umami token is empty");
}
const params = new URLSearchParams({
startAt: start_time,
endAt: end_time,
});
const request_header = {
method: "GET",
headers: {
"Content-Type": "application/json",
"Authorization": "Bearer " + token,
},
};
async function allStats() {
try {
const response = await fetch(`${request_url}?${params}`, request_header);
const data = await response.json();
const uniqueVisitors = data.uniques.value; // 获取独立访客数
const pageViews = data.pageviews.value; // 获取页面浏览量
let ele1 = document.querySelector("#umami-site-pv")
if (ele1) {
ele1.textContent = pageViews; // 设置页面浏览量
}
let ele2 = document.querySelector("#umami-site-uv")
if (ele2) {
ele2.textContent = uniqueVisitors;
}
console.log(uniqueVisitors, pageViews);
console.log(data);
return data;
} catch (error) {
console.error(error);
return "-1";
}
}
allStats();
</script>
</body>
</html>
@mobeicanyue I missed that there was a view-only option for users. Thank you for taking the time to write out the blog post.
My Umami fork enables this feature, as well as some other quality of life changes. Specifically relevant is:
- API requests do not require a date to be set (https://github.com/boehs/miami/commit/1ad06bafae0b5a2fd7216326d09acab35bc76a2a)
- There is no cors on the share API (https://github.com/boehs/miami/commit/cb13a6b46aa69bb6d201ef160cdde0c261c6a257)
- Share IDs are the tokens, so an additional request is not needed (https://github.com/boehs/miami/commit/59cdff8564ac89e62e46d17cd4f9bec973b94e33)
This means that it can be queried like this:
https://github.com/boehs/site/blob/73083b1ab6e5430b635fa0e967685ba68aa45c9e/src/scripts/infoot.ts#L6-L31
You can see it in usage by visiting any page on my blog (https://boehs.org/in/blog), and you can see it deployed here or here
You should note that I am slowly diverging from Umami in my fork as I have no interest in teams functionality or mysql.
