yume-chan / ya-webadb

ADB in your browser
https://tangoapp.dev/
MIT License
2.27k stars 298 forks source link

Help test the raw TCP wireless backend #349

Closed yume-chan closed 1 year ago

yume-chan commented 2 years ago

Direct Sockets API (formerly, "raw sockets API") (Chrome Platform Status) allows Web applications to create raw TCP or UDP sockets .

It has been implemented in Chrome for quite a while, but because the uncertainty and unsolved problems in the spec, it never been enabled.

To enable Direct Sockets API in a Chromium-based browser:

It should be possible to create an ADB backend using this API to achieve plugin-free wireless connection.

yume-chan commented 2 years ago

To protect websites using Direct Sockets API being hijacked and creates unwanted sockets, Chrome requires the website to opt-in a more strict site isolation by returning the following HTTP response headers:

Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Embedder-Policy: require-corp

For detailed explanation, see Why you need "cross-origin isolated" for powerful features.

yume-chan commented 2 years ago

I have pushed a change to enable the Direct Sockets API. But because GitHub Pages doesn't add the above HTTP response headers, and there is no way to configure this, I deployed another website on Vercel: https://ya-webadb.vercel.app/

If you follow the enable steps above (replace https://www.example.com with https://ya-webadb.vercel.app), you can test it now.


If your device doesn't have ADB over WiFi enabled, you can first connect via USB and enable it in the "ADB over WiFi" page:

image

  1. Check the toggle button next to service.adb.tcp.port
  2. (Optionally) change the port number
  3. Click "Apply" button in the menu bar, you device will be disconnected because the ADB daemon restarted.

  1. To connect via Direct Sockets, first find out your device's IP address.
  2. In the drop down menu of "Add" button, you should see "Direct Sockets TCP" option. image
  3. Input your devices IP address and ADB port when prompted. image
  4. Click "Connect", Chrome will pop up a "Connection Dialog". It's normal for the port input to be empty. Don't change anything, just click "OK" image

Known Issues:

yume-chan commented 2 years ago

Note: The Direct Sockets spec and the requirement for enabling it may change at any time.

yume-chan commented 2 years ago

The requirements have changed in Chromium/Chrome Dev/Chrome Canary released after March 15th (See https://github.com/WICG/direct-sockets/issues/35#issuecomment-1084082143, ref https://source.chromium.org/chromium/chromium/src/+/main:content/browser/web_exposed_isolation_info.h;l=32;drc=401f9911c6a32a0900f3968258393a9e729da625;bpv=0;bpt=1)

If the steps in https://github.com/yume-chan/ya-webadb/issues/349#issuecomment-992165610 doesn't work, try the new steps:

  1. Lunch chrome with --restricted-api-origins=https://ya-webadb.vercel.app/scrcpy command line arguments (or adding https://ya-webadb.vercel.app/scrcpy to chrome://flags/#restricted-api-origins)
  2. Open https://ya-webadb.vercel.app/scrcpy
  3. Press "Menu -> More Tools -> Create Shortcut..."
  4. Check "Open as window", Press "OK"
  5. Close the newly opened window
  6. Open the app from Start/Launchpad/wherever your apps are
teefort commented 2 years ago

The requirements have changed in mid-March (See WICG/direct-sockets#35 (comment))

The new steps are:

  1. Lunch chrome with --restricted-api-origins=https://ya-webadb-k2o0yviof-yume-chan.vercel.app command line arguments (or adding https://ya-webadb-k2o0yviof-yume-chan.vercel.app to chrome://flags/#restricted-api-origins)
  2. Open https://ya-webadb-k2o0yviof-yume-chan.vercel.app
  3. Press "Menu -> More Tools -> Create Shortcut..."
  4. Check "Open as window", Press "OK"
  5. Close the newly opened window
  6. Open the app from Start/Launchpad/wherever your apps are

I just tried these steps, and I'm still only seeing USB and WebSocket from the Add dropdown. Would you be able to provide some help?

This is what restricted-api-origins looks like for me image

I created the shortcut in a new window, closed it, and then launched it from the shortcut.

yume-chan commented 2 years ago

The new steps only apply to Chrome Dev/Canary/Chromium versions after March 15th. I don't know if any Stable/Beta versions are shipped with this change. So also try the old steps.

In fact, all versions released between Feb 15th and Marth 15th have DirectSockets feature disabled (by mistake). Stable/Beta are most possible in this range.

If you are using Microsoft Edge Dev/Canary, the code sometimes lags behind Chromium for about 10 days. So it is even harder to guess.

ziyunfei commented 2 years ago

Just FYI: restricted-api-origins has been renamed to isolated-app-origins.

https://github.com/chromium/chromium/commit/8a471ec271ef4d84e7ebc79c504f8d036178880c

blackwiz4rd commented 1 year ago

Hello all, thanks for the great project, after steps from comment:

I also don't see any Direct Sockets button. Here is my version (google-chrome-stable arch linux) `

Google Chrome 109.0.5414.74 (Official Build) (64-bit)
Revision e7c5703604daa9cc128ccf5a5d3e993513758913-refs/branch-heads/5414@{#1172}
OS Linux
JavaScript V8 10.9.194.9

`

Any idea why?

glitch128 commented 1 year ago

are you on the stable channel?

blackwiz4rd commented 1 year ago

are you on the stable channel?

Yes, I should be: https://aur.archlinux.org/packages/google-chrome

glitch128 commented 1 year ago

I have tried it on chromeOS stable 109, and it doesn't work.

The new steps only apply to Chrome Dev/Canary/Chromium versions after March 15th. I don't know if any Stable/Beta versions are shipped with this change. So also try the old steps.

yume-chan commented 1 year ago

The Direct Sockets spec changed dramatically in July last year. The new security model is fundamentally breaking many popular React framework and libraries, including some I'm using.

Also, Google Chrome haven't implemented WebUSB in the new model, so can't use both at the same time.

Closing this test as now. Will try to experiment again when the proposal is more mature.