Skip to content

Commit

Permalink
feat(android): add parameter for listening only on localhost
Browse files Browse the repository at this point in the history
  • Loading branch information
@drauggres
drauggres committed Oct 4, 2021
1 parent 4667c4b commit 9634831
Show file tree
Hide file tree
Showing 6 changed files with 69 additions and 32 deletions.
8 changes: 6 additions & 2 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -131,13 +131,17 @@ You can customize project before build by overriding the
* `INCLUDE_GOOG` - include code for Android device tracking and control
* `INCLUDE_ADB_SHELL` - [remote shell](#remote-shell) for android devices
([xtermjs/xterm.js][xterm.js], [Tyriar/node-pty][node-pty])
* `INCLUDE_DEV_TOOLS` - [dev tools](#debug-webpageswebview) for web pages and web views on android
devices
* `INCLUDE_DEV_TOOLS` - [dev tools](#debug-webpageswebview) for web pages and
web views on android devices
* `INCLUDE_FILE_LISTING` - minimalistic [file management](#file-listing)
* `USE_BROADWAY` - include [Broadway Player](#broadway-player)
* `USE_H264_CONVERTER` - include [Mse Player](#mse-player)
* `USE_TINY_H264` - include [TinyH264 Player](#tinyh264-player)
* `USE_WEBCODECS` - include [WebCodecs Player](#webcodecs-player)
* `SCRCPY_LISTENS_ON_ALL_INTERFACES` - WebSocket server in `scrcpy-server.jar`
will listen for connections on all available interfaces. When `true`, it allows
connecting to device directly from a browser. Otherwise, the connection must be
established over adb.

## Run configuration

Expand Down
77 changes: 49 additions & 28 deletions src/app/googDevice/client/DeviceTracker.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -80,15 +80,16 @@ export class DeviceTracker extends BaseDeviceTracker<GoogDeviceDescriptor, never

onInterfaceSelected = (e: Event): void => {
const selectElement = e.currentTarget as HTMLSelectElement;
this.updateLink(selectElement, true);
};

private updateLink(selectElement: HTMLSelectElement, store: boolean): void {
const option = selectElement.selectedOptions[0];
const url = decodeURI(option.getAttribute(Attribute.URL) || '');
const name = option.getAttribute(Attribute.NAME);
const name = option.getAttribute(Attribute.NAME) || '';
const fullName = decodeURIComponent(selectElement.getAttribute(Attribute.FULL_NAME) || '');
const udid = selectElement.getAttribute(Attribute.UDID);
const udid = selectElement.getAttribute(Attribute.UDID) || '';
this.updateLink({ url, name, fullName, udid, store: true });
};

private updateLink(params: { url: string; name: string; fullName: string; udid: string; store: boolean }): void {
const { url, name, fullName, udid, store } = params;
const playerTds = document.getElementsByName(
encodeURIComponent(`${DeviceTracker.AttributePrefixPlayerFor}${fullName}`),
);
Expand Down Expand Up @@ -147,8 +148,7 @@ export class DeviceTracker extends BaseDeviceTracker<GoogDeviceDescriptor, never
return `device_list::${udid}::interface`;
}

private static createInterfaceOption(params: ParamsDeviceTracker, name: string, udid = ''): HTMLOptionElement {
const optionElement = document.createElement('option');
protected static createUrl(params: ParamsDeviceTracker, udid = ''): URL {
const secure = !!params.secure;
const hostname = params.hostname || location.hostname;
const port = typeof params.port === 'number' ? params.port : secure ? 443 : 80;
Expand All @@ -158,7 +158,11 @@ export class DeviceTracker extends BaseDeviceTracker<GoogDeviceDescriptor, never
urlObject.searchParams.set('remote', `tcp:${SERVER_PORT.toString(10)}`);
urlObject.searchParams.set('udid', udid);
}
const url = urlObject.toString();
return urlObject;
}

protected static createInterfaceOption(name: string, url: string): HTMLOptionElement {
const optionElement = document.createElement('option');
optionElement.setAttribute(Attribute.URL, url);
optionElement.setAttribute(Attribute.NAME, name);
optionElement.innerText = `proxy over adb`;
Expand All @@ -170,13 +174,12 @@ export class DeviceTracker extends BaseDeviceTracker<GoogDeviceDescriptor, never
}

protected buildDeviceRow(tbody: Element, device: GoogDeviceDescriptor): void {
let selectedInterfaceUrl = '';
let selectedInterfaceName = '';
const blockClass = 'desc-block';
const fullName = `${this.id}_${Util.escapeUdid(device.udid)}`;
const isActive = device.state === DeviceState.DEVICE;
const localStorageKey = DeviceTracker.getLocalStorageKey(fullName);
const lastSelected = localStorage && localStorage.getItem(localStorageKey);
let hasPid = false;
let selectInterface: HTMLSelectElement | undefined;
const servicesId = `device_services_${fullName}`;
const row = html`<div class="device ${isActive ? 'active' : 'not-active'}">
<div class="device-header">
Expand Down Expand Up @@ -252,37 +255,50 @@ export class DeviceTracker extends BaseDeviceTracker<GoogDeviceDescriptor, never
actionButton.appendChild(span);
td.appendChild(actionButton);
} else if (fieldName === 'interfaces') {
const proxyInterfaceUrl = DeviceTracker.createUrl(this.params, device.udid).toString();
const proxyInterfaceName = 'proxy';
const localStorageKey = DeviceTracker.getLocalStorageKey(fullName);
const lastSelected = localStorage && localStorage.getItem(localStorageKey);
const selectElement = document.createElement('select');
selectElement.setAttribute(Attribute.UDID, device.udid);
selectElement.setAttribute(Attribute.FULL_NAME, fullName);
selectElement.setAttribute(
'name',
encodeURIComponent(`${DeviceTracker.AttributePrefixInterfaceSelectFor}${fullName}`),
);
device[fieldName].forEach((value) => {
const optionElement = DeviceTracker.createInterfaceOption(
{
...this.params,
secure: false,
hostname: value.ipv4,
port: SERVER_PORT,
},
value.name,
);
/// #if SCRCPY_LISTENS_ON_ALL_INTERFACES
device.interfaces.forEach((value) => {
const params = {
...this.params,
secure: false,
hostname: value.ipv4,
port: SERVER_PORT,
};
const url = DeviceTracker.createUrl(params).toString();
const optionElement = DeviceTracker.createInterfaceOption(value.name, url);
optionElement.innerText = `${value.name}: ${value.ipv4}`;
selectElement.appendChild(optionElement);
if (lastSelected) {
if (lastSelected === value.name) {
if (lastSelected === value.name || !selectedInterfaceName) {
optionElement.selected = true;
selectedInterfaceUrl = url;
selectedInterfaceName = value.name;
}
} else if (device['wifi.interface'] === value.name) {
optionElement.selected = true;
}
});
/// #else
selectedInterfaceUrl = proxyInterfaceUrl;
selectedInterfaceName = proxyInterfaceName;
td.classList.add('hidden');
/// #endif
if (isActive) {
const adbProxyOption = DeviceTracker.createInterfaceOption(this.params, 'proxy', device.udid);
if (lastSelected === 'proxy') {
const adbProxyOption = DeviceTracker.createInterfaceOption(proxyInterfaceName, proxyInterfaceUrl);
if (lastSelected === proxyInterfaceName || !selectedInterfaceName) {
adbProxyOption.selected = true;
selectedInterfaceUrl = proxyInterfaceUrl;
selectedInterfaceName = proxyInterfaceName;
}
selectElement.appendChild(adbProxyOption);
const actionButton = document.createElement('button');
Expand All @@ -296,7 +312,6 @@ export class DeviceTracker extends BaseDeviceTracker<GoogDeviceDescriptor, never
}
selectElement.onchange = this.onInterfaceSelected;
td.appendChild(selectElement);
selectInterface = selectElement;
} else {
td.innerText = value;
}
Expand All @@ -316,8 +331,14 @@ export class DeviceTracker extends BaseDeviceTracker<GoogDeviceDescriptor, never
}

tbody.appendChild(row);
if (DeviceTracker.CREATE_DIRECT_LINKS && hasPid && selectInterface) {
this.updateLink(selectInterface, false);
if (DeviceTracker.CREATE_DIRECT_LINKS && hasPid && selectedInterfaceUrl) {
this.updateLink({
url: selectedInterfaceUrl,
name: selectedInterfaceName,
fullName,
udid: device.udid,
store: false,
});
}
}

Expand Down
11 changes: 9 additions & 2 deletions src/common/Constants.ts
View file
Original file line number Diff line number Diff line change
@@ -1,12 +1,19 @@
export const SERVER_PACKAGE = 'com.genymobile.scrcpy.Server';
export const SERVER_PORT = 8886;
export const SERVER_VERSION = '1.17-ws5';
export const SERVER_VERSION = '1.17-ws6';

export const SERVER_TYPE = 'web';

export const LOG_LEVEL = 'ERROR';

const ARGUMENTS = [SERVER_VERSION, SERVER_TYPE, LOG_LEVEL, SERVER_PORT];
let SCRCPY_LISTENS_ON_ALL_INTERFACES;
/// #if SCRCPY_LISTENS_ON_ALL_INTERFACES
SCRCPY_LISTENS_ON_ALL_INTERFACES = true;
/// #else
SCRCPY_LISTENS_ON_ALL_INTERFACES = false;
/// #endif

const ARGUMENTS = [SERVER_VERSION, SERVER_TYPE, LOG_LEVEL, SERVER_PORT, SCRCPY_LISTENS_ON_ALL_INTERFACES];

export const SERVER_PROCESS_NAME = 'app_process';

Expand Down
4 changes: 4 additions & 0 deletions src/style/devicelist.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -147,6 +147,10 @@ body.list #device_list_menu {
display: inline-flex;
}

#devices .device-list div.desc-block.hidden {
display: none;
}

#devices .device-list div.desc-block.stream,
#devices .device-list div.desc-block.server_pid,
#devices .device-list div.desc-block.net_interface {
Expand Down
Binary file modified vendor/Genymobile/scrcpy/scrcpy-server.jar
View file
Binary file not shown.
1 change: 1 addition & 0 deletions webpack/default.build.config.json
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
{
"SCRCPY_LISTENS_ON_ALL_INTERFACES": true,
"USE_WEBCODECS": true,
"USE_BROADWAY": true,
"USE_H264_CONVERTER": true,
Expand Down

0 comments on commit 9634831

Please sign in to comment.