Hass/message-pusher
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 4 Wiki Activity

feat: now client part supports multiple channels for the same type (#50)

Browse Source
This commit is contained in:
JustSong
2023-05-06 10:15:18 +08:00
parent 3a8d625201
commit 91725aeba7
16 changed files with 1070 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files
channel/telegram.go
+1 -1
View File
@@ -23,7 +23,7 @@ type telegramMessageResponse struct {
func SendTelegramMessage(message *model.Message, user *model.User, channel_ *model.Channel) error {
// https://core.telegram.org/bots/api#sendmessage
messageRequest := telegramMessageRequest{
ChatId: channel_.AppId,
ChatId: channel_.AccountId,
Text: message.Content,
ParseMode: "markdown",
}
common/utils.go
+5
View File
@@ -12,6 +12,7 @@ import (
"runtime"
"strconv"
"strings"
"time"
)
func OpenBrowser(url string) {
@@ -151,3 +152,7 @@ func Markdown2HTML(markdown string) (HTML string, err error) {
HTML = buf.String()
return
}
func GetTimestamp() int64 {
return time.Now().Unix()
}
controller/channel.go
+12 -2
View File
@@ -94,8 +94,17 @@ func AddChannel(c *gin.Context) {
return
}
cleanChannel := model.Channel{
UserId: c.GetInt("id"),
Name: channel_.Name,
Type: channel_.Type,
UserId: c.GetInt("id"),
Name: channel_.Name,
Description: channel_.Description,
Status: common.ChannelStatusEnabled,
Secret: channel_.Secret,
AppId: channel_.AppId,
AccountId: channel_.AccountId,
URL: channel_.URL,
Other: channel_.Other,
CreatedTime: common.GetTimestamp(),
}
err = cleanChannel.Insert()
if err != nil {
@@ -159,6 +168,7 @@ func UpdateChannel(c *gin.Context) {
// If you add more fields, please also update channel_.Update()
cleanChannel.Type = channel_.Type
cleanChannel.Name = channel_.Name
cleanChannel.Description = channel_.Description
cleanChannel.Secret = channel_.Secret
cleanChannel.AppId = channel_.AppId
cleanChannel.AccountId = channel_.AccountId
controller/message.go
+4
View File
@@ -2,6 +2,7 @@ package controller
import (
"encoding/json"
"errors"
"fmt"
"github.com/gin-gonic/gin"
"message-pusher/channel"
@@ -136,6 +137,9 @@ func pushMessageHelper(c *gin.Context, message *model.Message) {
}
func saveAndSendMessage(user *model.User, message *model.Message, channel_ *model.Channel) error {
if channel_.Status != common.ChannelStatusEnabled {
return errors.New("该渠道已被禁用")
}
message.Link = common.GetUUID()
if message.URL == "" {
message.URL = fmt.Sprintf("%s/message/%s", common.ServerAddress, message.Link)
model/channel.go
+15 -13
View File
@@ -19,16 +19,18 @@ const (
)
type Channel struct {
Id int `json:"id"`
Type string `json:"type" gorm:"type:varchar(32)"`
UserId int `json:"user_id" gorm:"uniqueIndex:name_user_id"`
Name string `json:"name" gorm:"type:varchar(32);uniqueIndex:name_user_id"`
Status int `json:"status" gorm:"default:1"` // enabled, disabled
Secret string `json:"secret"`
AppId string `json:"app_id"`
AccountId string `json:"account_id"`
URL string `json:"url" gorm:"column:url"`
Other string `json:"other"`
Id int `json:"id"`
Type string `json:"type" gorm:"type:varchar(32)"`
UserId int `json:"user_id" gorm:"uniqueIndex:name_user_id"`
Name string `json:"name" gorm:"type:varchar(32);uniqueIndex:name_user_id"`
Description string `json:"description"`
Status int `json:"status" gorm:"default:1"` // enabled, disabled
Secret string `json:"secret"`
AppId string `json:"app_id"`
AccountId string `json:"account_id"`
URL string `json:"url" gorm:"column:url"`
Other string `json:"other"`
CreatedTime int64 `json:"created_time" gorm:"bigint"`
}
func GetChannelById(id int, userId int) (*Channel, error) {
@@ -60,12 +62,12 @@ func GetTokenStoreChannelsByUserId(userId int) (channels []*Channel, err error)
}
func GetChannelsByUserId(userId int, startIdx int, num int) (channels []*Channel, err error) {
err = DB.Where("user_id = ?", userId).Order("id desc").Limit(num).Offset(startIdx).Find(&channels).Error
err = DB.Omit("secret").Where("user_id = ?", userId).Order("id desc").Limit(num).Offset(startIdx).Find(&channels).Error
return channels, err
}
func SearchChannels(userId int, keyword string) (channels []*Channel, err error) {
err = DB.Where("user_id = ?", userId).Select([]string{"id", "name"}).Where("id = ? or name LIKE", keyword, keyword+"%").Find(&channels).Error
err = DB.Omit("secret").Where("user_id = ?", userId).Where("id = ? or name LIKE ?", keyword, keyword+"%").Find(&channels).Error
return channels, err
}
@@ -96,7 +98,7 @@ func (channel *Channel) UpdateStatus(status int) error {
// Update Make sure your token's fields is completed, because this will update non-zero values
func (channel *Channel) Update() error {
var err error
err = DB.Model(channel).Select("type", "name", "secret", "app_id", "account_id", "url", "other").Updates(channel).Error
err = DB.Model(channel).Select("type", "name", "description", "secret", "app_id", "account_id", "url", "other", "status").Updates(channel).Error
return err
}
router/api-router.go
+1 -1
View File
@@ -64,7 +64,7 @@ func SetApiRouter(router *gin.Engine) {
messageRoute.DELETE("/", middleware.RootAuth(), controller.DeleteAllMessages)
messageRoute.DELETE("/:id", middleware.UserAuth(), controller.DeleteMessage)
}
channelRoute := apiRouter.Group("/token")
channelRoute := apiRouter.Group("/channel")
channelRoute.Use(middleware.UserAuth())
{
channelRoute.GET("/", controller.GetAllChannels)
web/src/App.js
+26
View File
@@ -16,6 +16,8 @@ import PasswordResetConfirm from './components/PasswordResetConfirm';
import { UserContext } from './context/User';
import { StatusContext } from './context/Status';
import Message from './pages/Message';
import Channel from './pages/Channel';
import EditChannel from './pages/Channel/EditChannel';
const Home = lazy(() => import('./pages/Home'));
const About = lazy(() => import('./pages/About'));
@@ -107,6 +109,30 @@ function App() {
</Suspense>
}
/>
<Route
path='/channel'
element={
<PrivateRoute>
<Channel />
</PrivateRoute>
}
/>
<Route
path='/channel/edit/:id'
element={
<Suspense fallback={<Loading></Loading>}>
<EditChannel />
</Suspense>
}
/>
<Route
path='/channel/add'
element={
<Suspense fallback={<Loading></Loading>}>
<EditChannel />
</Suspense>
}
/>
<Route
path='/message'
element={
web/src/components/ChannelsTable.js
+333
View File
@@ -0,0 +1,333 @@
import React, { useEffect, useState } from 'react';
import { Button, Form, Label, Pagination, Table } from 'semantic-ui-react';
import { Link } from 'react-router-dom';
import { API, showError, showSuccess } from '../helpers';
import { ITEMS_PER_PAGE } from '../constants';
import { renderChannel, renderTimestamp } from '../helpers/render';
const ChannelsTable = () => {
const [channels, setChannels] = useState([]);
const [loading, setLoading] = useState(true);
const [activePage, setActivePage] = useState(1);
const [searchKeyword, setSearchKeyword] = useState('');
const [searching, setSearching] = useState(false);
const [user, setUser] = useState({ username: '', token: '' });
const loadChannels = async (startIdx) => {
const res = await API.get(`/api/channel/?p=${startIdx}`);
const { success, message, data } = res.data;
if (success) {
if (startIdx === 0) {
setChannels(data);
} else {
let newChannels = channels;
newChannels.push(...data);
setChannels(newChannels);
}
} else {
showError(message);
}
setLoading(false);
};
const onPaginationChange = (e, { activePage }) => {
(async () => {
if (activePage === Math.ceil(channels.length / ITEMS_PER_PAGE) + 1) {
// In this case we have to load more data and then append them.
await loadChannels(activePage - 1);
}
setActivePage(activePage);
})();
};
useEffect(() => {
loadChannels(0)
.then()
.catch((reason) => {
showError(reason);
});
loadUser()
.then()
.catch((reason) => {
showError(reason);
});
}, []);
const manageChannel = async (id, action, idx) => {
let data = { id };
let res;
switch (action) {
case 'delete':
res = await API.delete(`/api/channel/${id}/`);
break;
case 'enable':
data.status = 1;
res = await API.put('/api/channel/?status_only=true', data);
break;
case 'disable':
data.status = 2;
res = await API.put('/api/channel/?status_only=true', data);
break;
}
const { success, message } = res.data;
if (success) {
showSuccess('操作成功完成！');
let channel = res.data.data;
let newChannels = [...channels];
let realIdx = (activePage - 1) * ITEMS_PER_PAGE + idx;
if (action === 'delete') {
newChannels[realIdx].deleted = true;
} else {
newChannels[realIdx].status = channel.status;
}
setChannels(newChannels);
} else {
showError(message);
}
};
const renderStatus = (status) => {
switch (status) {
case 1:
return <Label basic>已启用</Label>;
case 2:
return (
<Label basic color='red'>
已禁用
</Label>
);
default:
return (
<Label basic color='grey'>
未知状态
</Label>
);
}
};
const searchChannels = async () => {
if (searchKeyword === '') {
// if keyword is blank, load files instead.
await loadChannels(0);
setActivePage(1);
return;
}
setSearching(true);
const res = await API.get(`/api/channel/search?keyword=${searchKeyword}`);
const { success, message, data } = res.data;
if (success) {
setChannels(data);
setActivePage(1);
} else {
showError(message);
}
setSearching(false);
};
const handleKeywordChange = async (e, { value }) => {
setSearchKeyword(value.trim());
};
const sortChannel = (key) => {
if (channels.length === 0) return;
setLoading(true);
let sortedChannels = [...channels];
sortedChannels.sort((a, b) => {
return ('' + a[key]).localeCompare(b[key]);
});
if (sortedChannels[0].id === channels[0].id) {
sortedChannels.reverse();
}
setChannels(sortedChannels);
setLoading(false);
};
const loadUser = async () => {
let res = await API.get(`/api/user/self`);
const { success, message, data } = res.data;
if (success) {
setUser(data);
} else {
showError(message);
}
setLoading(false);
};
const test = async (channel) => {
let res = await API.get(
`/push/${user.username}?token=${user.token}&channel=${channel}&title=消息推送服务&description=配置成功！`
);
const { success, message } = res.data;
if (success) {
showSuccess('测试消息已发送');
} else {
showError(message);
}
};
return (
<>
<Form onSubmit={searchChannels}>
<Form.Input
icon='search'
fluid
iconPosition='left'
placeholder='搜索通道的 ID 或名称 ...'
value={searchKeyword}
loading={searching}
onChange={handleKeywordChange}
/>
</Form>
<Table basic>
<Table.Header>
<Table.Row>
<Table.HeaderCell
style={{ cursor: 'pointer' }}
onClick={() => {
sortChannel('id');
}}
>
ID
</Table.HeaderCell>
<Table.HeaderCell
style={{ cursor: 'pointer' }}
onClick={() => {
sortChannel('name');
}}
>
名称
</Table.HeaderCell>
<Table.HeaderCell
style={{ cursor: 'pointer' }}
onClick={() => {
sortChannel('description');
}}
>
备注
</Table.HeaderCell>
<Table.HeaderCell
style={{ cursor: 'pointer' }}
onClick={() => {
sortChannel('type');
}}
>
类型
</Table.HeaderCell>
<Table.HeaderCell
style={{ cursor: 'pointer' }}
onClick={() => {
sortChannel('status');
}}
>
状态
</Table.HeaderCell>
<Table.HeaderCell
style={{ cursor: 'pointer' }}
onClick={() => {
sortChannel('created_time');
}}
>
创建时间
</Table.HeaderCell>
<Table.HeaderCell>操作</Table.HeaderCell>
</Table.Row>
</Table.Header>
<Table.Body>
{channels
.slice(
(activePage - 1) * ITEMS_PER_PAGE,
activePage * ITEMS_PER_PAGE
)
.map((channel, idx) => {
if (channel.deleted) return <></>;
return (
<Table.Row key={channel.id}>
<Table.Cell>{channel.id}</Table.Cell>
<Table.Cell>{channel.name}</Table.Cell>
<Table.Cell>
{channel.description ? channel.description : '无备注信息'}
</Table.Cell>
<Table.Cell>{renderChannel(channel.type)}</Table.Cell>
<Table.Cell>{renderStatus(channel.status)}</Table.Cell>
<Table.Cell>
{renderTimestamp(channel.created_time)}
</Table.Cell>
<Table.Cell>
<div>
<Button
size={'small'}
negative
onClick={() => {
manageChannel(channel.id, 'delete', idx).then();
}}
>
删除
</Button>
<Button
size={'small'}
onClick={() => {
test(channel.name).then();
}}
>
测试
</Button>
<Button
size={'small'}
onClick={() => {
manageChannel(
channel.id,
channel.status === 1 ? 'disable' : 'enable',
idx
).then();
}}
>
{channel.status === 1 ? '禁用' : '启用'}
</Button>
<Button
size={'small'}
as={Link}
to={'/channel/edit/' + channel.id}
>
编辑
</Button>
</div>
</Table.Cell>
</Table.Row>
);
})}
</Table.Body>
<Table.Footer>
<Table.Row>
<Table.HeaderCell colSpan='7'>
<Button
size='small'
as={Link}
to='/channel/add'
loading={loading}
>
添加新的通道
</Button>
<Pagination
floated='right'
activePage={activePage}
onPageChange={onPaginationChange}
size='small'
siblingRange={1}
totalPages={
Math.ceil(channels.length / ITEMS_PER_PAGE) +
(channels.length % ITEMS_PER_PAGE === 0 ? 1 : 0)
}
/>
</Table.HeaderCell>
</Table.Row>
</Table.Footer>
</Table>
</>
);
};
export default ChannelsTable;
web/src/components/Header.js
+5
View File
@@ -18,6 +18,11 @@ const headerButtons = [
to: '/message',
icon: 'mail',
},
{
name: '通道',
to: '/channel',
icon: 'sitemap',
},
{
name: '用户',
to: '/user',
web/src/components/MessagesTable.js
+51 -102
View File
@@ -1,81 +1,16 @@
import React, { useEffect, useRef, useState } from 'react';
import { Button, Form, Label, Modal, Pagination, Table } from 'semantic-ui-react';
import { API, openPage, showError, showSuccess, showWarning, timestamp2string } from '../helpers';
import {
Button,
Form,
Label,
Modal,
Pagination,
Table,
} from 'semantic-ui-react';
import { API, openPage, showError, showSuccess, showWarning } from '../helpers';
import { ITEMS_PER_PAGE } from '../constants';
function renderChannel(channel) {
switch (channel) {
case 'email':
return <Label color='green'>邮件</Label>;
case 'test':
return (
<Label style={{ backgroundColor: '#2cbb00', color: 'white' }}>
微信测试号
</Label>
);
case 'corp_app':
return (
<Label style={{ backgroundColor: '#5fc9ec', color: 'white' }}>
企业微信应用号
</Label>
);
case 'corp':
return (
<Label style={{ backgroundColor: '#019d82', color: 'white' }}>
企业微信群机器人
</Label>
);
case 'lark':
return (
<Label style={{ backgroundColor: '#00d6b9', color: 'white' }}>
飞书群机器人
</Label>
);
case 'ding':
return (
<Label style={{ backgroundColor: '#007fff', color: 'white' }}>
钉钉群机器人
</Label>
);
case 'bark':
return (
<Label style={{ backgroundColor: '#ff3b30', color: 'white' }}>
Bark App
</Label>
);
case 'client':
return (
<Label style={{ backgroundColor: '#121212', color: 'white' }}>
WebSocket 客户端
</Label>
);
case 'telegram':
return (
<Label style={{ backgroundColor: '#29a9ea', color: 'white' }}>
Telegram 机器人
</Label>
);
case 'discord':
return (
<Label style={{ backgroundColor: '#404eed', color: 'white' }}>
Discord 群机器人
</Label>
);
case 'none':
return <Label>无</Label>;
default:
return <Label color='grey'>未知通道</Label>;
}
}
function renderTimestamp(timestamp) {
return (
<>
{timestamp2string(timestamp)}
</>
);
}
import { renderChannel, renderTimestamp } from '../helpers/render';
function renderStatus(status) {
switch (status) {
@@ -119,8 +54,8 @@ const MessagesTable = () => {
title: '消息标题',
description: '消息描述',
content: '消息内容',
link: ''
}); // Message to be viewed
link: '',
}); // Message to be viewed
const [viewModalOpen, setViewModalOpen] = useState(false);
const loadMessages = async (startIdx) => {
@@ -277,7 +212,7 @@ const MessagesTable = () => {
autoRefreshSecondsRef.current = 10;
} else {
autoRefreshSecondsRef.current -= 1;
setAutoRefreshSeconds(autoRefreshSeconds => autoRefreshSeconds - 1); // Important!
setAutoRefreshSeconds((autoRefreshSeconds) => autoRefreshSeconds - 1); // Important!
}
}, 1000);
}
@@ -285,7 +220,6 @@ const MessagesTable = () => {
return () => clearInterval(intervalId);
}, [autoRefresh]);
return (
<>
<Form onSubmit={searchMessages}>
@@ -405,16 +339,26 @@ const MessagesTable = () => {
<Table.Footer>
<Table.Row>
<Table.HeaderCell colSpan='6'>
<Button size='small' loading={loading} onClick={() => {
refresh().then();
}}>
<Button
size='small'
loading={loading}
onClick={() => {
refresh().then();
}}
>
手动刷新
</Button>
<Button size='small' loading={loading} onClick={() => {
setAutoRefresh(!autoRefresh);
setAutoRefreshSeconds(10);
}}>
{autoRefresh ? `自动刷新中（${autoRefreshSeconds} 秒后刷新）` : '自动刷新'}
<Button
size='small'
loading={loading}
onClick={() => {
setAutoRefresh(!autoRefresh);
setAutoRefreshSeconds(10);
}}
>
{autoRefresh
? `自动刷新中（${autoRefreshSeconds} 秒后刷新）`
: '自动刷新'}
</Button>
<Pagination
floated='right'
@@ -431,28 +375,33 @@ const MessagesTable = () => {
</Table.Row>
</Table.Footer>
</Table>
<Modal
size='tiny'
open={viewModalOpen}
>
<Modal size='tiny' open={viewModalOpen}>
<Modal.Header>{message.title ? message.title : '无标题'}</Modal.Header>
<Modal.Content>
{message.description ? <p className={'quote'}>{message.description}</p> : ''}
{message.description ? (
<p className={'quote'}>{message.description}</p>
) : (
''
)}
{message.content ? <p>{message.content}</p> : ''}
</Modal.Content>
<Modal.Actions>
<Button onClick={() => {
if (message.URL) {
openPage(message.URL);
} else {
openPage(`/message/${message.link}`);
}
}}>
<Button
onClick={() => {
if (message.URL) {
openPage(message.URL);
} else {
openPage(`/message/${message.link}`);
}
}}
>
打开
</Button>
<Button onClick={() => {
setViewModalOpen(false);
}}>
<Button
onClick={() => {
setViewModalOpen(false);
}}
>
关闭
</Button>
</Modal.Actions>
web/src/constants/channel.constants.js
+38
View File
@@ -0,0 +1,38 @@
export const CHANNEL_OPTIONS = [
{ key: 'email', text: '邮件', value: 'email', color: '#4285f4' },
{ key: 'test', text: '微信测试号', value: 'test', color: '#2cbb00' },
{
key: 'corp_app',
text: '企业微信应用号',
value: 'corp_app',
color: '#5fc9ec',
},
{ key: 'corp', text: '企业微信群机器人', value: 'corp', color: '#019d82' },
{ key: 'lark', text: '飞书群机器人', value: 'lark', color: '#00d6b9' },
{ key: 'ding', text: '钉钉群机器人', value: 'ding', color: '#007fff' },
{ key: 'bark', text: 'Bark App', value: 'bark', color: '#ff3b30' },
{
key: 'client',
text: 'WebSocket 客户端',
value: 'client',
color: '#121212',
},
{
key: 'telegram',
text: 'Telegram 机器人',
value: 'telegram',
color: '#29a9ea',
},
{
key: 'discord',
text: 'Discord 群机器人',
value: 'discord',
color: '#404eed',
},
{
key: 'none',
text: '不推送',
value: 'none',
color: '#808080',
},
];
web/src/constants/index.js
+2 -1
View File
@@ -1,3 +1,4 @@
export * from './toast.constants';
export * from './user.constants';
export * from './common.constant';
export * from './common.constant';
export * from './channel.constants';
web/src/helpers/render.js
+32
View File
@@ -0,0 +1,32 @@
import { Label } from 'semantic-ui-react';
import { timestamp2string } from './utils';
import React from 'react';
import { CHANNEL_OPTIONS } from '../constants';
let channelMap = undefined;
export function renderChannel(key) {
if (channelMap === undefined) {
channelMap = new Map();
CHANNEL_OPTIONS.forEach((option) => {
channelMap[option.key] = option;
});
}
let channel = channelMap[key];
if (channel) {
return (
<Label basic style={{ backgroundColor: channel.color, color: 'white' }}>
{channel.text}
</Label>
);
}
return (
<Label basic color='red'>
未知通道
</Label>
);
}
export function renderTimestamp(timestamp) {
return <>{timestamp2string(timestamp)}</>;
}
web/src/pages/Channel/EditChannel.js
+520
View File
@@ -0,0 +1,520 @@
import React, { useEffect, useState } from 'react';
import { Button, Form, Header, Message, Segment } from 'semantic-ui-react';
import { useParams } from 'react-router-dom';
import { API, showError, showSuccess } from '../../helpers';
import { CHANNEL_OPTIONS } from '../../constants';
import axios from 'axios';
const EditChannel = () => {
const params = useParams();
const channelId = params.id;
const isEditing = channelId !== undefined;
const [loading, setLoading] = useState(isEditing);
const originInputs = {
type: 'none',
name: '',
description: '',
secret: '',
app_id: '',
account_id: '',
url: '',
other: '',
corp_id: '', // only for corp_app
agent_id: '', // only for corp_app
};
const [inputs, setInputs] = useState(originInputs);
const { type, name, description, secret, app_id, account_id, url, other } =
inputs;
const handleInputChange = (e, { name, value }) => {
setInputs((inputs) => ({ ...inputs, [name]: value }));
};
const loadChannel = async () => {
let res = await API.get(`/api/channel/${channelId}`);
const { success, message, data } = res.data;
if (success) {
if (data.type === 'corp_app') {
const [corp_id, agent_id] = data.app_id.split('|');
data.corp_id = corp_id;
data.agent_id = agent_id;
}
setInputs(data);
} else {
showError(message);
}
setLoading(false);
};
useEffect(() => {
if (isEditing) {
loadChannel().then();
}
}, []);
const submit = async () => {
if (!name) return;
let res = undefined;
let localInputs = { ...inputs };
switch (inputs.type) {
case 'corp_app':
localInputs.app_id = `${inputs.corp_id}|${inputs.agent_id}`;
break;
case 'bark':
localInputs.url = 'https://api.day.app';
}
if (isEditing) {
res = await API.put(`/api/channel/`, {
...localInputs,
id: parseInt(channelId),
});
} else {
res = await API.post(`/api/channel`, localInputs);
}
const { success, message } = res.data;
if (success) {
if (isEditing) {
showSuccess('通道信息更新成功！');
} else {
showSuccess('通道创建成功！');
setInputs(originInputs);
}
} else {
showError(message);
}
};
const getTelegramChatId = async () => {
if (inputs.telegram_bot_token === '') {
showError('请先输入 Telegram 机器人令牌！');
return;
}
let res = await axios.get(
`https://api.telegram.org/bot${inputs.secret}/getUpdates`
);
const { ok } = res.data;
if (ok) {
let result = res.data.result;
if (result.length === 0) {
showError(`请先向你的机器人发送一条任意消息！`);
} else {
let id = result[0]?.message?.chat?.id;
id = id.toString();
setInputs((inputs) => ({ ...inputs, account_id: id }));
showSuccess('会话 ID 获取成功！');
}
} else {
showError(`发生错误：${res.description}`);
}
};
const renderChannelForm = () => {
switch (type) {
case 'email':
return (
<>
<Message>
邮件推送方式（email）需要设置邮箱，请前往个人设置页面绑定邮箱地址，之后系统将自动为你创建邮箱推送通道。
</Message>
</>
);
case 'test':
return (
<>
<Message>
通过微信测试号进行推送，点击前往配置：
<a
target='_blank'
href='https://mp.weixin.qq.com/debug/cgi-bin/sandboxinfo?action=showinfo&t=sandbox/index'
>
微信公众平台接口测试帐号
</a>
。
<br />
<br />
需要新增测试模板，模板标题推荐填写为「消息推送」，模板内容必须填写为
{' {{'}text.DATA{'}}'}。
</Message>
<Form.Group widths={3}>
<Form.Input
label='测试号 ID'
name='app_id'
onChange={handleInputChange}
autoComplete='new-password'
value={inputs.app_id}
placeholder='测试号信息 -> appID'
/>
<Form.Input
label='测试号密钥'
name='secret'
type='password'
onChange={handleInputChange}
autoComplete='new-password'
value={inputs.secret}
placeholder='测试号信息 -> appsecret'
/>
<Form.Input
label='测试模板 ID'
name='other'
onChange={handleInputChange}
autoComplete='new-password'
value={inputs.other}
placeholder='模板消息接口 -> 模板 ID'
/>
</Form.Group>
<Form.Group widths={3}>
<Form.Input
label='用户 Open ID'
name='account_id'
onChange={handleInputChange}
autoComplete='new-password'
value={inputs.account_id}
placeholder='扫描测试号二维码 -> 用户列表 -> 微信号'
/>
</Form.Group>
</>
);
case 'corp_app':
return (
<>
<Message>
通过企业微信应用号进行推送，点击前往配置：
<a
target='_blank'
href='https://work.weixin.qq.com/wework_admin/frame#apps'
>
企业微信应用管理
</a>
。
<br />
<br />
注意，企业微信要求配置可信 IP，步骤：应用管理 -> 自建 -> 创建应用
-> 应用设置页面下拉中找到「企业可信 IP」，点击配置 -> 设置可信域名
-> 在「可调用
JS-SDK、跳转小程序的可信域名」下面填写一个域名，然后点击「申请校验域名」，根据提示完成校验
-> 之后填写服务器 IP 地址（此 IP
地址是消息推送服务所部署在的服务器的 IP
地址，未必是上面校验域名中记录的 IP 地址）。
</Message>
<Form.Group widths={3}>
<Form.Input
label='企业 ID'
name='corp_id'
onChange={handleInputChange}
autoComplete='new-password'
value={inputs.corp_id}
placeholder='我的企业 -> 企业信息 -> 企业 ID'
/>
<Form.Input
label='应用 AgentId'
name='agent_id'
onChange={handleInputChange}
autoComplete='new-password'
value={inputs.agent_id}
placeholder='应用管理 -> 自建 -> 创建应用 -> AgentId'
/>
<Form.Input
label='应用 Secret'
name='secret'
type='password'
onChange={handleInputChange}
autoComplete='new-password'
value={inputs.secret}
placeholder='应用管理 -> 自建 -> 创建应用 -> Secret'
/>
</Form.Group>
<Form.Group widths={3}>
<Form.Input
label='用户账号'
name='account_id'
onChange={handleInputChange}
autoComplete='new-password'
value={inputs.account_id}
placeholder='通讯录 -> 点击姓名 -> 账号'
/>
<Form.Select
label='微信企业号客户端类型'
name='other'
options={[
{
key: 'plugin',
text: '微信中的企业微信插件',
value: 'plugin',
},
{ key: 'app', text: '企业微信 APP', value: 'app' },
]}
value={inputs.other}
onChange={handleInputChange}
/>
</Form.Group>
</>
);
case 'corp':
return (
<>
<Message>
通过企业微信群机器人进行推送，配置流程：选择一个群聊 -> 设置 ->
群机器人 -> 添加 -> 新建 -> 输入名字，点击添加 -> 点击复制 Webhook
地址
</Message>
<Form.Group widths={2}>
<Form.Input
label='Webhook 地址'
name='url'
onChange={handleInputChange}
autoComplete='new-password'
value={inputs.url}
placeholder='在此填写企业微信提供的 Webhook 地址'
/>
</Form.Group>
</>
);
case 'lark':
return (
<>
<Message>
通过飞书群机器人进行推送，飞书桌面客户端的配置流程：选择一个群聊
-> 设置 -> 群机器人 -> 添加机器人 -> 自定义机器人 -> 添加（
<strong>注意选中「签名校验」</strong>）。具体参见：
<a
target='_blank'
href='https://open.feishu.cn/document/ukTMukTMukTM/ucTM5YjL3ETO24yNxkjN'
>
飞书开放文档
</a>
</Message>
<Form.Group widths={2}>
<Form.Input
label='Webhook 地址'
name='url'
onChange={handleInputChange}
autoComplete='new-password'
value={inputs.url}
placeholder='在此填写飞书提供的 Webhook 地址'
/>
<Form.Input
label='签名校验密钥'
name='secret'
type='password'
onChange={handleInputChange}
autoComplete='new-password'
value={inputs.secret}
placeholder='在此填写飞书提供的签名校验密钥'
/>
</Form.Group>
</>
);
case 'ding':
return (
<>
<Message>
通过钉钉群机器人进行推送，钉钉桌面客户端的配置流程：选择一个群聊
-> 群设置 -> 智能群助手 -> 添加机器人（点击右侧齿轮图标） ->
自定义 -> 添加（
<strong>注意选中「加密」</strong>）。具体参见：
<a
target='_blank'
href='https://open.dingtalk.com/document/robots/custom-robot-access'
>
钉钉开放文档
</a>
</Message>
<Form.Group widths={2}>
<Form.Input
label='Webhook 地址'
name='url'
onChange={handleInputChange}
autoComplete='new-password'
value={inputs.url}
placeholder='在此填写钉钉提供的 Webhook 地址'
/>
<Form.Input
label='签名校验密钥'
name='secret'
type='password'
onChange={handleInputChange}
autoComplete='new-password'
value={inputs.secret}
placeholder='在此填写钉钉提供的签名校验密钥'
/>
</Form.Group>
</>
);
case 'bark':
return (
<>
<Message>
通过 Bark 进行推送，下载 Bark 后按提示注册设备，之后会看到一个
URL，例如 <code>https://api.day.app/wrsVSDRANDOM/Body Text</code>
，其中 <code>wrsVSDRANDOM</code> 就是你的推送 key。
</Message>
<Form.Group widths={2}>
<Form.Input
label='服务器地址'
name='url'
onChange={handleInputChange}
autoComplete='new-password'
value={inputs.url}
placeholder='在此填写 Bark 服务器地址，不填则使用默认值'
/>
<Form.Input
label='推送 key'
name='secret'
type='password'
onChange={handleInputChange}
autoComplete='new-password'
value={inputs.secret}
placeholder='在此填写 Bark 推送 key'
/>
</Form.Group>
</>
);
case 'client':
return (
<>
<Message>
通过 WebSocket
客户端进行推送，可以使用官方客户端实现，或者根据协议自行实现。官方客户端
<a
target='_blank'
href='https://github.com/songquanpeng/personal-assistant'
>
详见此处
</a>
。
</Message>
<Form.Group widths={2}>
<Form.Input
label='客户端连接密钥'
name='secret'
type='password'
onChange={handleInputChange}
autoComplete='new-password'
value={inputs.secret}
placeholder='在此设置客户端连接密钥'
/>
</Form.Group>
</>
);
case 'telegram':
return (
<>
<Message>
通过 Telegram 机器人进行消息推送。首先向
<a href='https://t.me/botfather' target='_blank'>
{' '}
Bot Father{' '}
</a>
申请创建一个新的机器人，之后在下方输入获取到的令牌，然后点击你的机器人，随便发送一条消息，之后点击下方的「获取会话
ID」按钮，系统将自动为你填写会话
ID，最后点击保存按钮保存设置即可。
</Message>
<Form.Group widths={2}>
<Form.Input
label='Telegram 机器人令牌'
name='secret'
type='password'
onChange={handleInputChange}
autoComplete='new-password'
value={inputs.secret}
placeholder='在此设置 Telegram 机器人令牌'
/>
<Form.Input
label='Telegram 会话 ID'
name='account_id'
type='text'
onChange={handleInputChange}
autoComplete='new-password'
value={inputs.account_id}
placeholder='在此设置 Telegram 会话 ID'
/>
</Form.Group>
<Button onClick={getTelegramChatId} loading={loading}>
获取会话 ID
</Button>
</>
);
case 'discord':
return (
<>
<Message>
通过 Discord 群机器人进行推送，配置流程：选择一个 channel -> 设置
-> 整合 -> 创建 Webhook -> 点击复制 Webhook URL
</Message>
<Form.Group widths={2}>
<Form.Input
label='Webhook 地址'
name='url'
onChange={handleInputChange}
autoComplete='new-password'
value={inputs.url}
placeholder='在此填写 Discord 提供的 Webhook 地址'
/>
</Form.Group>
</>
);
case 'none':
return (
<>
<Message>
仅保存消息，不做推送，可以在 Web
端查看，需要用户具有消息持久化的权限。
</Message>
</>
);
default:
return (
<>
<Message>未知通道类型！</Message>
</>
);
}
};
return (
<>
<Segment loading={loading}>
<Header as='h3'>{isEditing ? '更新通道配置' : '新建消息通道'}</Header>
<Form autoComplete='new-password'>
<Form.Field>
<Form.Input
label='名称'
name='name'
placeholder={
'请输入通道名称，请仅使用英文字母和下划线，该名称必须唯一'
}
onChange={handleInputChange}
value={name}
autoComplete='new-password'
required
/>
</Form.Field>
<Form.Field>
<Form.Input
label='备注'
name='description'
type={'text'}
placeholder={'请输入备注信息'}
onChange={handleInputChange}
value={description}
autoComplete='new-password'
/>
</Form.Field>
<Form.Select
label='通道类型'
name='type'
options={CHANNEL_OPTIONS}
value={type}
onChange={handleInputChange}
/>
{renderChannelForm()}
<Button disabled={type === 'email'} onClick={submit}>
提交
</Button>
</Form>
</Segment>
</>
);
};
export default EditChannel;
web/src/pages/Channel/index.js
+14
View File
@@ -0,0 +1,14 @@
import React from 'react';
import { Header, Segment } from 'semantic-ui-react';
import ChannelsTable from '../../components/ChannelsTable';
const Channel = () => (
<>
<Segment>
<Header as='h3'>我的通道</Header>
<ChannelsTable />
</Segment>
</>
);
export default Channel;
web/src/pages/User/AddUser.js
+11 -11
View File
@@ -30,38 +30,38 @@ const AddUser = () => {
return (
<>
<Segment>
<Header as="h3">创建新用户账户</Header>
<Form autoComplete="off">
<Header as='h3'>创建新用户账户</Header>
<Form autoComplete='new-password'>
<Form.Field>
<Form.Input
label="用户名"
name="username"
label='用户名'
name='username'
placeholder={'请输入用户名'}
onChange={handleInputChange}
value={username}
autoComplete="off"
autoComplete='new-password'
required
/>
</Form.Field>
<Form.Field>
<Form.Input
label="显示名称"
name="display_name"
label='显示名称'
name='display_name'
placeholder={'请输入显示名称'}
onChange={handleInputChange}
value={display_name}
autoComplete="off"
autoComplete='new-password'
/>
</Form.Field>
<Form.Field>
<Form.Input
label="密码"
name="password"
label='密码'
name='password'
type={'password'}
placeholder={'请输入密码'}
onChange={handleInputChange}
value={password}
autoComplete="off"
autoComplete='new-password'
required
/>
</Form.Field>