这个服务器监控微信小程序，有点意思

[jerrodpoole]

写在前面

想写一个服务器监控的网页供自己用，突发奇想能不能用小程序实现。然而遇到了一些问题，众所周知小程序请求地址必须在开发信息中手动报备并且要求域名备案。而我想实现的是可以动态添加节点，并且通过小程序直接连接到服务器，不经过第三方服务器。琢磨了一段时间做了这个，可以实现小程序和服务器的点对点连接。

特点

• 直接通过小程序和服务器的点对点连接，数据不经过第三方中转
• 不要求服务器域名备案，可以直接使用 ip，甚至局域网地址
• 看起来还挺好看的，如果不符合你的审美，可以自定义显示样式

原理

这是一个黑魔法（ hhh 开玩笑

原理很简单，是巧妙运用了小程序 image 组件的 bindload 接口，当图片加载成功时会返回图片的宽和高。也就是说一个图片能够返回两个数值，前后端约定好请求 API 后可以动态创建 image 获取一系列数值。

注意这个接口是不要求图片地址是备案域名，不用在小程序开发信息中报备。但是这种信息传递方式比较低下，只适合传递少量的信息，但是对这个需求来说足够了。

但是直接传递大体积的二进制图片很浪费带宽，解决方案是后端动态生成 svg 图片。也就是说，动态返回下面这种形式的文字信息：

<svg width="${width}" height="${height}" xmlns="http://www.w3.org/2000/svg"></svg>

详细的实现可以看这个文件

截图给你

不是所有人都有空去打开小程序，截个图放这里，长这样：

节点列表界面

自定义主题样式界面

小程序二维码和后端 github 地址

扫码或者微信搜索 miniStatus 小程序

后端项目地址：https://github.com/axipo/mini-status

（顺手求个 star

[tmrQAQ]

牛批

[lzdyes]

微信：好家伙

[lzhnull]

牛皮牛皮

[hs0000t]

牛啤

[lazyyz]

厉害了我的楼主

[RiceS]

牛批...

[rrfeng]

感觉应该还有更多办法……其实思路跟 jsonp 差不多吧。
小程序应该可以发很多类型的请求，这些请求里你都可以拼数据进去然后自己解码……

[laydown]

Telegram 的机器人估计更好用，楼主试试？

[falcon05]

感觉要“被修复”了

[nekoyaki]

楼主真是鬼才，，，

[jerrodpoole]

楼上好多表示了 image 接口改动的担忧，如果要求图片地址报备，要修改的小程序可能会有很多。并且这个接口还是有用的，为了这种角度刁钻的玩法改动接口没有必要，个人感觉改动的可能性不大。

[tyrad]

6，不过估计长久不了

[phpfpm]

所以你 dom 是怎么写的？
```

<img src="http://foo.bar.com/hint.svg" bindload="foo">
```
这样吗？这样的图片能被加载出来吗？

换句话说直接显示这样的图片不行吗

[Vegetable]

微信:收到,马上封!

[hereIsChen]

厉害了，还有这种操作

[putaozhenhaochi]

够骚。已 star

[hereIsChen]

哦，对了，可以用小程序的云开发，也能去请求其他服务器的内容
云端的请求时没有限制域名的

[pakro888]

厉害了，牛逼

[huage2580]

是你吗 秀儿

[m0cha]

想法新奇，学到了