applications/luci-app-frpc/htdocs/luci-static/resources/view/frpc.js

   1 'use strict';
   2 'require view';
   3 'require ui';
   4 'require form';
   5 'require rpc';
   6 'require tools.widgets as widgets';
   7
   8 //      [Widget, Option, Title, Description, {Param: 'Value'}],
   9 var startupConf = [
  10         [form.Flag, 'stdout', _('Log stdout')],
  11         [form.Flag, 'stderr', _('Log stderr')],
  12         [widgets.UserSelect, 'user', _('Run daemon as user')],
  13         [widgets.GroupSelect, 'group', _('Run daemon as group')],
  14         [form.Flag, 'respawn', _('Respawn when crashed')],
  15         [form.DynamicList, 'env', _('Environment variable'), _('OS environments pass to frp for config file template, see <a href="https://github.com/fatedier/frp#configuration-file-template">frp README</a>'), {placeholder: 'ENV_NAME=value'}],
  16         [form.DynamicList, 'conf_inc', _('Additional configs'), _('Config files include in temporary config file'), {placeholder: '/etc/frp/frpc.d/frpc_full.ini'}]
  17 ];
  18
  19 var commonConf = [
  20         [form.Value, 'server_addr', _('Server address'), _('ServerAddr specifies the address of the server to connect to.<br />By default, this value is "0.0.0.0".'), {datatype: 'host'}],
  21         [form.Value, 'server_port', _('Server port'), _('ServerPort specifies the port to connect to the server on.<br />By default, this value is 7000.'), {datatype: 'port'}],
  22         [form.Value, 'http_proxy', _('HTTP proxy'), _('HttpProxy specifies a proxy address to connect to the server through. If this value is "", the server will be connected to directly.<br />By default, this value is read from the "http_proxy" environment variable.')],
  23         [form.Value, 'log_file', _('Log file'), _('LogFile specifies a file where logs will be written to. This value will only be used if LogWay is set appropriately.<br />By default, this value is "console".')],
  24         [form.ListValue, 'log_level', _('Log level'), _('LogLevel specifies the minimum log level. Valid values are "trace", "debug", "info", "warn", and "error".<br />By default, this value is "info".'), {values: ['trace', 'debug', 'info', 'warn', 'error']}],
  25         [form.Value, 'log_max_days', _('Log max days'), _('LogMaxDays specifies the maximum number of days to store log information before deletion. This is only used if LogWay == "file".<br />By default, this value is 0.'), {datatype: 'uinteger'}],
  26         [form.Flag, 'disable_log_color', _('Disable log color'), _('DisableLogColor disables log colors when LogWay == "console" when set to true.'), {datatype: 'bool', default: 'false'}],
  27         [form.Value, 'token', _('Token'), _('Token specifies the authorization token used to create keys to be sent to the server. The server must have a matching token for authorization to succeed. <br />By default, this value is "".')],
  28         [form.Value, 'admin_addr', _('Admin address'), _('AdminAddr specifies the address that the admin server binds to.<br />By default, this value is "127.0.0.1".'), {datatype: 'ipaddr'}],
  29         [form.Value, 'admin_port', _('Admin port'), _('AdminPort specifies the port for the admin server to listen on. If this value is 0, the admin server will not be started.<br />By default, this value is 0.'), {datatype: 'port'}],
  30         [form.Value, 'admin_user', _('Admin user'), _('AdminUser specifies the username that the admin server will use for login.<br />By default, this value is "admin".')],
  31         [form.Value, 'admin_pwd', _('Admin password'), _('AdminPwd specifies the password that the admin server will use for login.<br />By default, this value is "admin".'), {password: true}],
  32         [form.Value, 'assets_dir', _('Assets dir'), _('AssetsDir specifies the local directory that the admin server will load resources from. If this value is "", assets will be loaded from the bundled executable using statik.<br />By default, this value is "".')],
  33         [form.Flag, 'tcp_mux', _('TCP mux'), _('TcpMux toggles TCP stream multiplexing. This allows multiple requests from a client to share a single TCP connection. If this value is true, the server must have TCP multiplexing enabled as well.<br />By default, this value is true.'), {datatype: 'bool', default: 'true'}],
  34         [form.Value, 'user', _('User'), _('User specifies a prefix for proxy names to distinguish them from other clients. If this value is not "", proxy names will automatically be changed to "{user}.{proxy_name}".<br />By default, this value is "".')],
  35         [form.Flag, 'login_fail_exit', _('Exit when login fail'), _('LoginFailExit controls whether or not the client should exit after a failed login attempt. If false, the client will retry until a login attempt succeeds.<br />By default, this value is true.'), {datatype: 'bool', default: 'true'}],
  36         [form.ListValue, 'protocol', _('Protocol'), _('Protocol specifies the protocol to use when interacting with the server. Valid values are "tcp", "kcp", and "websocket".<br />By default, this value is "tcp".'), {values: ['tcp', 'kcp', 'websocket']}],
  37         [form.Flag, 'tls_enable', _('TLS'), _('TLSEnable specifies whether or not TLS should be used when communicating with the server.'), {datatype: 'bool'}],
  38         [form.Value, 'heartbeat_interval', _('Heartbeat interval'), _('HeartBeatInterval specifies at what interval heartbeats are sent to the server, in seconds. It is not recommended to change this value.<br />By default, this value is 30.'), {datatype: 'uinteger'}],
  39         [form.Value, 'heartbeat_timeout', _('Heartbeat timeout'), _('HeartBeatTimeout specifies the maximum allowed heartbeat response delay before the connection is terminated, in seconds. It is not recommended to change this value.<br />By default, this value is 90.'), {datatype: 'uinteger'}],
  40         [form.DynamicList, '_', _('Additional settings'), _('This list can be used to specify some additional parameters which have not been included in this LuCI.'), {placeholder: 'Key-A=Value-A'}]
  41 ];
  42
  43 var baseProxyConf = [
  44         [form.Value, 'name', _('Proxy name'), undefined, {rmempty: false, optional: false}],
  45         [form.ListValue, 'type', _('Proxy type'), _('ProxyType specifies the type of this proxy. Valid values include "tcp", "udp", "http", "https", "stcp", and "xtcp".<br />By default, this value is "tcp".'), {values: ['tcp', 'udp', 'http', 'https', 'stcp', 'xtcp']}],
  46         [form.Flag, 'use_encryption', _('Encryption'), _('UseEncryption controls whether or not communication with the server will be encrypted. Encryption is done using the tokens supplied in the server and client configuration.<br />By default, this value is false.'), {datatype: 'bool'}],
  47         [form.Flag, 'use_compression', _('Compression'), _('UseCompression controls whether or not communication with the server will be compressed.<br />By default, this value is false.'), {datatype: 'bool'}],
  48         [form.Value, 'local_ip', _('Local IP'), _('LocalIp specifies the IP address or host name to proxy to.'), {datatype: 'host'}],
  49         [form.Value, 'local_port', _('Local port'), _('LocalPort specifies the port to proxy to.'), {datatype: 'port'}],
  50 ];
  51
  52 var bindInfoConf = [
  53         [form.Value, 'remote_port', _('Remote port'), _('If remote_port is 0, frps will assign a random port for you'), {datatype: 'port'}]
  54 ];
  55
  56 var domainConf = [
  57         [form.Value, 'custom_domains', _('Custom domains')],
  58         [form.Value, 'subdomain', _('Subdomain')],
  59 ];
  60
  61 var httpProxyConf = [
  62         [form.Value, 'locations', _('Locations')],
  63         [form.Value, 'http_user', _('HTTP user')],
  64         [form.Value, 'http_pwd', _('HTTP password')],
  65         [form.Value, 'host_header_rewrite', _('Host header rewrite')],
  66         // [form.Value, 'headers', _('Headers')], // FIXME
  67 ];
  68
  69 var stcpProxyConf = [
  70         [form.ListValue, 'role', _('Role'), undefined, {values: ['server', 'visitor']}],
  71         [form.Value, 'server_name', _('Server name'), undefined, {depends: [{role: 'visitor'}]}],
  72         [form.Value, 'sk', _('Sk')],
  73 ];
  74
  75 var pluginConf = [
  76         [form.ListValue, 'plugin', _('Plugin'), undefined, {values: ['', 'http_proxy', 'socks5', 'unix_domain_socket'], rmempty: true}],
  77         [form.Value, 'plugin_http_user', _('HTTP user'), undefined, {depends: {plugin: 'http_proxy'}}],
  78         [form.Value, 'plugin_http_passwd', _('HTTP password'), undefined, {depends: {plugin: 'http_proxy'}}],
  79         [form.Value, 'plugin_user', _('SOCKS5 user'), undefined, {depends: {plugin: 'socks5'}}],
  80         [form.Value, 'plugin_passwd', _('SOCKS5 password'), undefined, {depends: {plugin: 'socks5'}}],
  81         [form.Value, 'plugin_unix_path', _('Unix domain socket path'), undefined, {depends: {plugin: 'unix_domain_socket'}, optional: false, rmempty: false,
  82                 datatype: 'file', placeholder: '/var/run/docker.sock', default: '/var/run/docker.sock'}],
  83 ];
  84
  85 function setParams(o, params) {
  86         if (!params) return;
  87         for (var key in params) {
  88                 var val = params[key];
  89                 if (key === 'values') {
  90                         for (var j = 0; j < val.length; j++) {
  91                                 var args = val[j];
  92                                 if (!Array.isArray(args))
  93                                         args = [args];
  94                                 o.value.apply(o, args);
  95                         }
  96                 } else if (key === 'depends') {
  97                         if (!Array.isArray(val))
  98                                 val = [val];
  99
 100                         var deps = [];
 101                         for (var j = 0; j < val.length; j++) {
 102                                 var d = {};
 103                                 for (var vkey in val[j])
 104                                         d[vkey] = val[j][vkey];
 105                                 for (var k = 0; k < o.deps.length; k++) {
 106                                         for (var dkey in o.deps[k]) {
 107                                                 d[dkey] = o.deps[k][dkey];
 108                                         }
 109                                 }
 110                                 deps.push(d);
 111                         }
 112                         o.deps = deps;
 113                 } else {
 114                         o[key] = params[key];
 115                 }
 116         }
 117         if (params['datatype'] === 'bool') {
 118                 o.enabled = 'true';
 119                 o.disabled = 'false';
 120         }
 121 }
 122
 123 function defTabOpts(s, t, opts, params) {
 124         for (var i = 0; i < opts.length; i++) {
 125                 var opt = opts[i];
 126                 var o = s.taboption(t, opt[0], opt[1], opt[2], opt[3]);
 127                 setParams(o, opt[4]);
 128                 setParams(o, params);
 129         }
 130 }
 131
 132 function defOpts(s, opts, params) {
 133         for (var i = 0; i < opts.length; i++) {
 134                 var opt = opts[i];
 135                 var o = s.option(opt[0], opt[1], opt[2], opt[3]);
 136                 setParams(o, opt[4]);
 137                 setParams(o, params);
 138         }
 139 }
 140
 141 var callServiceList = rpc.declare({
 142         object: 'service',
 143         method: 'list',
 144         params: ['name'],
 145         expect: { '': {} }
 146 });
 147
 148 function getServiceStatus() {
 149         return L.resolveDefault(callServiceList('frpc'), {}).then(function (res) {
 150                 var isRunning = false;
 151                 try {
 152                         isRunning = res['frpc']['instances']['instance1']['running'];
 153                 } catch (e) { }
 154                 return isRunning;
 155         });
 156 }
 157
 158 function renderStatus(isRunning) {
 159         var renderHTML = "";
 160         var spanTemp = '<em><span style="color:%s"><strong>%s %s</strong></span></em>';
 161
 162         if (isRunning) {
 163                 renderHTML += String.format(spanTemp, 'green', _("frp Client"), _("RUNNING"));
 164         } else {
 165                 renderHTML += String.format(spanTemp, 'red', _("frp Client"), _("NOT RUNNING"));
 166         }
 167
 168         return renderHTML;
 169 }
 170
 171 return view.extend({
 172         render: function() {
 173                 var m, s, o;
 174
 175                 m = new form.Map('frpc', _('frp Client'));
 176
 177                 s = m.section(form.NamedSection, '_status');
 178                 s.anonymous = true;
 179                 s.render = function (section_id) {
 180                         L.Poll.add(function () {
 181                                 return L.resolveDefault(getServiceStatus()).then(function(res) {
 182                                         var view = document.getElementById("service_status");
 183                                         view.innerHTML = renderStatus(res);
 184                                 });
 185                         });
 186
 187                         return E('div', { class: 'cbi-map' },
 188                                 E('fieldset', { class: 'cbi-section'}, [
 189                                         E('p', { id: 'service_status' },
 190                                                 _('Collecting data ...'))
 191                                 ])
 192                         );
 193                 }
 194
 195                 s = m.section(form.NamedSection, 'common', 'conf');
 196                 s.dynamic = true;
 197
 198                 s.tab('common', _('Common Settings'));
 199                 s.tab('init', _('Startup Settings'));
 200
 201                 defTabOpts(s, 'common', commonConf, {optional: true});
 202
 203                 o = s.taboption('init', form.SectionValue, 'init', form.TypedSection, 'init', _('Startup Settings'));
 204                 s = o.subsection;
 205                 s.anonymous = true;
 206                 s.dynamic = true;
 207
 208                 defOpts(s, startupConf);
 209
 210                 s = m.section(form.GridSection, 'conf', _('Proxy Settings'));
 211                 s.anonymous = true;
 212                 s.addremove = true;
 213                 s.sortable = true;
 214                 s.addbtntitle = _('Add new proxy...');
 215
 216                 s.filter = function(s) { return s !== 'common'; };
 217
 218                 s.tab('general', _('General Settings'));
 219                 s.tab('http', _('HTTP Settings'));
 220                 s.tab('plugin', _('Plugin Settings'));
 221
 222                 s.option(form.Value, 'name', _('Proxy name')).modalonly = false;
 223                 s.option(form.Value, 'type', _('Proxy type')).modalonly = false;
 224                 s.option(form.Value, 'local_ip', _('Local IP')).modalonly = false;
 225                 s.option(form.Value, 'local_port', _('Local port')).modalonly = false;
 226                 o = s.option(form.Value, 'remote_port', _('Remote port'));
 227                 o.modalonly = false;
 228                 o.depends('type', 'tcp');
 229                 o.depends('type', 'udp');
 230                 o.cfgvalue = function() {
 231                         var v = this.super('cfgvalue', arguments);
 232                         return v&&v!='0'?v:'#';
 233                 };
 234
 235                 defTabOpts(s, 'general', baseProxyConf, {modalonly: true});
 236
 237                 // TCP and UDP
 238                 defTabOpts(s, 'general', bindInfoConf, {optional: true, modalonly: true, depends: [{type: 'tcp'}, {type: 'udp'}]});
 239
 240                 // HTTP and HTTPS
 241                 defTabOpts(s, 'http', domainConf, {optional: true, modalonly: true, depends: [{type: 'http'}, {type: 'https'}]});
 242
 243                 // HTTP
 244                 defTabOpts(s, 'http', httpProxyConf, {optional: true, modalonly: true, depends: {type: 'http'}});
 245
 246                 // STCP and XTCP
 247                 defTabOpts(s, 'general', stcpProxyConf, {modalonly: true, depends: [{type: 'stcp'}, {type: 'xtcp'}]});
 248
 249                 // Plugin
 250                 defTabOpts(s, 'plugin', pluginConf, {modalonly: true});
 251
 252                 return m.render();
 253         }
 254 });