/sji-android-screen-capture

android screen capture and remote controller

Primary LanguageJavaScriptMIT LicenseMIT

sji-android-screen-capture

Android Screen Capture (For HTML5 Video Live Streaming)
This project is aimed to capture android screen and view it in HTML5 video capable browser.
Yes, real time, low bandwidth. This product will do encoding in host and android by ffmpeg. Support Chrome, Firefox, Safari. Windows/Linux/Unix

New: Recorded file can be auto converted to H.264/MP4 and WebM video format if you'v installed ffmpeg in local PC.
New: Support Remote Control by mouse click/move/drag on live view UI.

[Screenshot]

Menu

Live View

Recorded Videos

[How to use]

1.Setup PC Environment (Windows/Mac/Linux/Unix)

Install Android SDK (at least "Platform Tools" which include adb(Android Debug Bridge)).  
install node.js.  
Install android USB driver automatically or manually when you first plug Android into PC.  
If you want to always record as H.264/MP4 or WebM video format, you need install FFMPEG into PC.

To simplify other settings, you'd better put the directory of adb and local ffmpeg into PATH environment variable otherwise you need put the fullpath of them into "adb" and "ffmpeg" settings in stream.json file.

3.Start Android Screen Capture (include a video stream server) on PC

cd path_of_this_project/bin  
node stream.js

You can edit configuration file stream.json to change IP, port, SSL...


4.Show video/animated image of android from PC by browsing http://localhost:3000/
Support WebM video and H.264/MP4 and Animated JPEG/PNG by Multi-Part HTTP Response. Chrome,Firefox,Safari are well supported. IE10+ is not tested but should be OK.

To embed Animated JPEG image into your html page:

<img src="http://localhost:33333/capture?device=yourDeviceSerialNumber&type=ajpg&fps=4" />

To embed Animated PNG image into your html page. (PNG is lostless image compression):

<img src="http://localhost:33333/capture?device=yourDeviceSerialNumber&type=apng&fps=4" />

You can record and seamlessly convert to H.264/MP4 and WebM format file. To record, you submit a HTTP GET request with following URL:

http://localhost:3000/deviceControl?action=startRecording?device=yourDeviceSerialNumber&type=ajpg&fps=4" />

or via animated PNG (better quality than above URL)

http://localhost:3000/deviceControl?action=startRecording?device=yourDeviceSerialNumber&type=ajpg&fps=4" />

To stop recording, you submit a HTTP GET request with following URL:

http://localhost:3000/deviceControl?action=stopRecording?device=yourDeviceSerialNumber" />

To just capture one screenshot: JPEG:

<img src="http://localhost:33333/capture?device=yourDeviceSerialNumber&type=jpg" />

PNG:

<img src="http://localhost:33333/capture?device=yourDeviceSerialNumber&type=png" />

[Note]: All above URLs can specify scale and rotate optionally by append following querystring:

&scale=0.5&rotate=270 or  
&scale=300xAuto or
&scale=300x200 or  
&scale=Autox200 ...

For advanced usage, please start menu page, move mouse to link and button to see URL.


You can attach an access key for device so all above URL must appended &accessKey=yourAccessKey otherwise you get "access denied" error response.
Typically stream web server administrator set adminKey e.g. xxxx,
then submit URL request:

  
http://localhost:3000/deviceControl?adminKey=xxxx&action=setAccessKey&accessKey=yyyy&device=sn1&device=sn2  ....  

This will attach access key yyyy to device sn1 and sn2.

To start record Animated PNG image, you can submit following URL request:

  
http://localhost:3000/deviceControl?adminKey=xxxx&action=startRecording&device=sn1&device=sn2&type=apng&fps=4  

This will start record on device sn1 and sn2. The fps means rate. You can optionally specify scale and rotate querystring.

To stop record Animated PNG image, embed following URL into your HTML img tag:

  
http://localhost:3000/deviceControl?adminKey=xxxx&action=stopRecording&device=sn1&device=sn2    

To play record file Animated PNG image, embed following URL into your HTML img tag:

  
http://localhost:33333/playRecordedFile?&device=sn1&accessKey=yyyy&type=apng  

You can optionally specify custom playback rate by fps querystring.

To download record file Animated PNG image, embed following URL into your HTML page:

  
http://localhost:33333/downlodRecordedFile?&device=sn1&accessKey=yyyy&type=apng  

For webm format, just change apng to webm and img tag to video tag in above steps.

===================
[Note]
Currently tested in android 4.2, 4.1, 4.0, 2.2, 2.3. With PC Browser Chrome 33, Firefox 27, Safari 7. Host OS can be Windows/Mac/Linux (Unix should also be OK, but not tested).
Build: src/build_all.sh has been tested in Mac OS X 10.7 64bit and Ubuntu 12 64bit, Android NDK r8 or r9. Gcc 4.4.3 or 4.8.
bin/android/busybox is downloaded from busybox binary downloads.