Feature: OpenWRT service widget (#2782)
* Feat: OpenWRT widget implementation * Update proxy.js * fixes from review --------- Co-authored-by: shamoon <4887959+shamoon@users.noreply.github.com>pull/2787/head
parent
d20cdbb9ab
commit
86740c6d7b
@ -0,0 +1,54 @@
|
||||
---
|
||||
title: OpenWRT
|
||||
description: OpenWRT widget configuration
|
||||
---
|
||||
|
||||
Learn more about [OpenWRT](https://openwrt.org/).
|
||||
|
||||
Provides information from OpenWRT
|
||||
|
||||
```yaml
|
||||
widget:
|
||||
type: openwrt
|
||||
url: http://host.or.ip
|
||||
username: homepage
|
||||
password: pass
|
||||
interfaceName: eth0 # optional
|
||||
```
|
||||
|
||||
## Interface
|
||||
|
||||
Setting `interfaceName` (e.g. eth0) will display information for that particular device, otherwise the widget will display general system info.
|
||||
|
||||
## Authorization
|
||||
|
||||
In order for homepage to access the OpenWRT RPC endpoints you will need to [create an ACL](https://openwrt.org/docs/techref/ubus#acls) and [new user](https://openwrt.org/docs/techref/ubus#authentication) in OpenWRT.
|
||||
|
||||
Create an ACL named `homepage.json` in `/usr/share/rpcd/acl.d/`, the following permissions will suffice:
|
||||
|
||||
```
|
||||
{
|
||||
"homepage": {
|
||||
"description": "Homepage widget",
|
||||
"read": {
|
||||
"ubus": {
|
||||
"network.interface.wan": ["status"],
|
||||
"network.interface.lan": ["status"],
|
||||
"network.device": ["status"]
|
||||
"system": ["info"]
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Then add a user that will use that ACL in `/etc/config/rpc`:
|
||||
|
||||
```config login
|
||||
option username 'homepage'
|
||||
option password '<password>'
|
||||
list read homepage
|
||||
list write '*'
|
||||
```
|
||||
|
||||
This username and password will be used in Homepage's services.yaml to grant access.
|
@ -0,0 +1,9 @@
|
||||
import Interface from "./methods/interface";
|
||||
import System from "./methods/system";
|
||||
|
||||
export default function Component({ service }) {
|
||||
if (service.widget.interfaceName) {
|
||||
return <Interface service={service} />;
|
||||
}
|
||||
return <System service={service} />;
|
||||
}
|
@ -0,0 +1,37 @@
|
||||
import { useTranslation } from "next-i18next";
|
||||
|
||||
import useWidgetAPI from "utils/proxy/use-widget-api";
|
||||
import Container from "components/services/widget/container";
|
||||
import Block from "components/services/widget/block";
|
||||
|
||||
export default function Component({ service }) {
|
||||
const { t } = useTranslation();
|
||||
const { data, error } = useWidgetAPI(service.widget);
|
||||
|
||||
if (error) {
|
||||
return <Container service={service} error={error} />;
|
||||
}
|
||||
|
||||
if (!data) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const { up, bytesTx, bytesRx } = data;
|
||||
|
||||
return (
|
||||
<Container service={service}>
|
||||
<Block
|
||||
label="widget.status"
|
||||
value={
|
||||
up ? (
|
||||
<span className="text-green-500">{t("openwrt.up")}</span>
|
||||
) : (
|
||||
<span className="text-red-500">{t("openwrt.down")}</span>
|
||||
)
|
||||
}
|
||||
/>
|
||||
<Block label="openwrt.bytesTx" value={t("common.bytes", { value: bytesTx })} />
|
||||
<Block label="openwrt.bytesRx" value={t("common.bytes", { value: bytesRx })} />
|
||||
</Container>
|
||||
);
|
||||
}
|
@ -0,0 +1,27 @@
|
||||
import { useTranslation } from "next-i18next";
|
||||
|
||||
import useWidgetAPI from "utils/proxy/use-widget-api";
|
||||
import Container from "components/services/widget/container";
|
||||
import Block from "components/services/widget/block";
|
||||
|
||||
export default function Component({ service }) {
|
||||
const { t } = useTranslation();
|
||||
const { data, error } = useWidgetAPI(service.widget);
|
||||
|
||||
if (error) {
|
||||
return <Container service={service} error={error} />;
|
||||
}
|
||||
|
||||
if (!data) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const { uptime, cpuLoad } = data;
|
||||
|
||||
return (
|
||||
<Container service={service}>
|
||||
<Block label="openwrt.uptime" value={t("common.uptime", { value: uptime })} />
|
||||
<Block label="openwrt.cpuLoad" value={cpuLoad} />
|
||||
</Container>
|
||||
);
|
||||
}
|
@ -0,0 +1,128 @@
|
||||
import { sendJsonRpcRequest } from "utils/proxy/handlers/jsonrpc";
|
||||
import { formatApiCall } from "utils/proxy/api-helpers";
|
||||
import getServiceWidget from "utils/config/service-helpers";
|
||||
import createLogger from "utils/logger";
|
||||
import widgets from "widgets/widgets";
|
||||
|
||||
const PROXY_NAME = "OpenWRTProxyHandler";
|
||||
const logger = createLogger(PROXY_NAME);
|
||||
const LOGIN_PARAMS = ["00000000000000000000000000000000", "session", "login"];
|
||||
const RPC_METHOD = "call";
|
||||
|
||||
let authToken = "00000000000000000000000000000000";
|
||||
|
||||
const PARAMS = {
|
||||
system: ["system", "info", {}],
|
||||
device: ["network.device", "status", {}],
|
||||
};
|
||||
|
||||
async function getWidget(req) {
|
||||
const { group, service } = req.query;
|
||||
|
||||
if (!group || !service) {
|
||||
logger.debug("Invalid or missing service '%s' or group '%s'", service, group);
|
||||
return null;
|
||||
}
|
||||
|
||||
const widget = await getServiceWidget(group, service);
|
||||
|
||||
if (!widget) {
|
||||
logger.debug("Invalid or missing widget for service '%s' in group '%s'", service, group);
|
||||
return null;
|
||||
}
|
||||
|
||||
return widget;
|
||||
}
|
||||
|
||||
function isUnauthorized(data) {
|
||||
const json = JSON.parse(data.toString());
|
||||
return json?.error?.code === -32002;
|
||||
}
|
||||
|
||||
async function login(url, username, password) {
|
||||
const response = await sendJsonRpcRequest(url, RPC_METHOD, [...LOGIN_PARAMS, { username, password }]);
|
||||
|
||||
if (response[0] === 200) {
|
||||
const responseData = JSON.parse(response[2]);
|
||||
authToken = responseData[1].ubus_rpc_session;
|
||||
}
|
||||
|
||||
return response;
|
||||
}
|
||||
|
||||
async function fetchInterface(url, interfaceName) {
|
||||
const [, contentType, data] = await sendJsonRpcRequest(url, RPC_METHOD, [authToken, ...PARAMS.device]);
|
||||
if (isUnauthorized(data)) {
|
||||
return [401, contentType, data];
|
||||
}
|
||||
const response = JSON.parse(data.toString())[1];
|
||||
const networkInterface = response[interfaceName];
|
||||
if (!networkInterface) {
|
||||
return [404, contentType, { error: "Interface not found" }];
|
||||
}
|
||||
|
||||
const interfaceInfo = {
|
||||
up: networkInterface.up,
|
||||
bytesRx: networkInterface.statistics.rx_bytes,
|
||||
bytesTx: networkInterface.statistics.tx_bytes,
|
||||
};
|
||||
return [200, contentType, interfaceInfo];
|
||||
}
|
||||
|
||||
async function fetchSystem(url) {
|
||||
const [, contentType, data] = await sendJsonRpcRequest(url, RPC_METHOD, [authToken, ...PARAMS.system]);
|
||||
if (isUnauthorized(data)) {
|
||||
return [401, contentType, data];
|
||||
}
|
||||
const systemResponse = JSON.parse(data.toString())[1];
|
||||
const response = {
|
||||
uptime: systemResponse.uptime,
|
||||
cpuLoad: systemResponse.load[1],
|
||||
};
|
||||
return [200, contentType, response];
|
||||
}
|
||||
|
||||
async function fetchData(url, widget) {
|
||||
let response;
|
||||
if (widget.interfaceName) {
|
||||
response = await fetchInterface(url, widget.interfaceName);
|
||||
} else {
|
||||
response = await fetchSystem(url);
|
||||
}
|
||||
return response;
|
||||
}
|
||||
|
||||
export default async function proxyHandler(req, res) {
|
||||
const { group, service } = req.query;
|
||||
|
||||
if (!group || !service) {
|
||||
logger.debug("Invalid or missing service '%s' or group '%s'", service, group);
|
||||
return res.status(400).json({ error: "Invalid proxy service type" });
|
||||
}
|
||||
|
||||
const widget = await getWidget(req);
|
||||
|
||||
if (!widget) {
|
||||
logger.debug("Invalid or missing widget for service '%s' in group '%s'", service, group);
|
||||
return res.status(400).json({ error: "Invalid proxy service type" });
|
||||
}
|
||||
|
||||
const api = widgets?.[widget.type]?.api;
|
||||
const url = new URL(formatApiCall(api, { ...widget }));
|
||||
|
||||
let [status, , data] = await fetchData(url, widget);
|
||||
|
||||
if (status === 401) {
|
||||
const [loginStatus, , loginData] = await login(url, widget.username, widget.password);
|
||||
if (loginStatus !== 200) {
|
||||
return res.status(loginStatus).end(loginData);
|
||||
}
|
||||
[status, , data] = await fetchData(url, widget);
|
||||
|
||||
if (status === 401) {
|
||||
return res.status(401).json({ error: "Unauthorized" });
|
||||
}
|
||||
}
|
||||
|
||||
return res.status(200).end(JSON.stringify(data));
|
||||
}
|
@ -0,0 +1,8 @@
|
||||
import proxyHandler from "./proxy";
|
||||
|
||||
const widget = {
|
||||
api: "{url}/ubus",
|
||||
proxyHandler,
|
||||
};
|
||||
|
||||
export default widget;
|
Loading…
Reference in new issue