搭建Android上的服务器 “实现隔空取物”的方法
概述
今天逛简书的时候，发现了一个库：
https://github.com/MZCretin/WifiTransfer-master
主要功能是这样的，先口述一下，当打开app，可以通过浏览器访问一个地址，然后通过浏览器可以给手机上上传apk（也支持已有apk删除），然后手机端可以安装、卸载该apk。
三张图就明白了：
应用启动后：
然后PC端访问：
拖拽apk上传，即可上传到手机端。
ok，大致介绍清楚了。
注意一定要在同一个网段。
先不谈其用处到底有多大，很多时候我看到一个项目的时候，很少考虑其能干嘛，考虑最多的是它是如何实现的，我会么，不会那就学，至于能干嘛，那要等我学会之后？
那么思考下他的实现，这种上传文件的方式，在PC端更加常见，上传文件到服务器。
说到这，就可以想到，可能这个app在手机端搭建了一个服务器。
恩，没错就是这样的，在手机端搭建了一个服务器，这样就可以通过html，将PC端的文件传给手机端，然后手机端收到后再同步界面。
同时，也可以将手机上Sdcard上的文件，完全在PC上呈现。
手机端的Server利用的是该库：https://github.com/koush/AndroidAsync
解析源码的事情就不做了，有兴趣可以自己学习下，接下来开始正片。
一个群友的问题
之所以会关注到这个库，是因为在wanandroid群，有个哥们连续问了好久的一个问题，问题是：
如何通过浏览器输入一个地址播放手机上的视频
当时也很多人回答，回答的核心都是正确的。
当然我恰好看到这个库，之前也没推送过相关内容，所以我决定写个简易的Demo.
当然是Demo就没有什么美观可言了，仅为快速实现效果。
效果图是这样的：
页面上显示手机上的视频列表，然后点击某个视频，即开始播放该视频。
有了上例参考，非常简单。
注：部分代码直接从上例copy。
该案例需要网络和Sdcard权限！
先把服务器搭起来依赖库
首先，依赖下我们搭建Server需要用到的库：
compile 'com.koushikdutta.async:androidasync:2.+'
编写简易html
然后我们在assets下编写一个html文件用于浏览器访问，index.html
最简单的即可：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> </head> <body> 嘿嘿嘿，连通了... </body> </html>
启动服务，监听端口
public class MainActivity extends AppCompatActivity {
private AsyncHttpServer server = new AsyncHttpServer();
private AsyncServer mAsyncServer = new AsyncServer();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
server.get("/", new HttpServerRequestCallback() {
@Override
public void onRequest(AsyncHttpServerRequest request, AsyncHttpServerResponse response) {
try {
response.send(getIndexContent());
} catch (IOException e) {
e.printStackTrace();
response.code(500).end();
}
}
});
server.listen(mAsyncServer, 54321);
}
@Override
protected void onDestroy() {
super.onDestroy();
if (server != null) {
server.stop();
}
if (mAsyncServer != null) {
mAsyncServer.stop();
}
}
private String getIndexContent() throws IOException {
BufferedInputStream bInputStream = null;
try {
bInputStream = new BufferedInputStream(getAssets().open("index.html"));
ByteArrayOutputStream baos = new ByteArrayOutputStream();
int len = 0;
byte[] tmp = new byte[10240];
while ((len = bInputStream.read(tmp)) > 0) {
baos.write(tmp, 0, len);
}
return new String(baos.toByteArray(), "utf-8");
} catch (IOException e) {
e.printStackTrace();
throw e;
} finally {
if (bInputStream != null) {
try {
bInputStream.close();
} catch (IOException e) {
e.printStackTrace();
}
}
}
}
}
可以看到很简单，创建AsyncHttpServer对象，我们在onCreate中调用get，对外设置一个get型的url监听，监听的url是/即根目录。
然后调用listen，传入端口号54321，开启对该端口的监听。
onDestroy的时候停止服务器。
当捕获到对”/”的访问时，读取assets下的index.html返回给浏览器。
记得添加网络权限。
好了，运行demo，测试一下。
输入地址，你的手机的IP:端口号。
注意电脑和手机在同一个网段！
然后你应该看到如下效果图：
如果没看到，那不用往下了，先找问题吧~
完善Demo
接下来，我们将手机上的mp4返回让其在浏览器上显示。
很简单，既然我们可以监听/，返回一个index.html，我们就能监听另一个url，返回文件目录。
server.get("/files", new HttpServerRequestCallback() {
@Override
public void onRequest(AsyncHttpServerRequest request, AsyncHttpServerResponse response) {
JSONArray array = new JSONArray();
File dir = new File(Environment.getExternalStorageDirectory().getPath());
String[] fileNames = dir.list();
if (fileNames != null) {
for (String fileName : fileNames) {
File file = new File(dir, fileName);
if (file.exists() && file.isFile() && file.getName().endsWith(".mp4")) {
try {
JSONObject jsonObject = new JSONObject();
jsonObject.put("name", fileName);
jsonObject.put("path", file.getAbsolutePath());
array.put(jsonObject);
} catch (JSONException e) {
e.printStackTrace();
}
}
}
}
response.send(array.toString());
}
});
我们监听/files这个Url，然后返回Sdcard根目录的视频文件，拼接成JSON返回。
这里如果你重新启动，在浏览器上输入：
http://192.168.1.100:54321/files
会看到一堆JSON数据：
但是我们需要在刚才的html上显示，所以这个请求应该是刚才的Html页面发起：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="jquery-1.7.2.min.js" type="text/javascript"></script>
<title>文档的标题</title>
<script type="text/javascript">
$(function() {
var now = new Date();
var url = 'files' + '?' + now.getTime();
// 请求JSON数据
$.getJSON(url, function(data) {
// 编辑JSON数组
for (var i = 0; i < data.length; i++) {
// 为每个对象生成一个li标签，添加到页面的ul中
var $li = $('<li>' + data[i].name + '</li>');
$li.attr("path", data[i].path);
$("#filelist").append($li);
}
});
});
</script>
</head>
<body>
<ul id="filelist" style="float:left;"></ul>
</body>
</html>
可能很多朋友没了解过js，不过应该能看明白，$.getJSON获取返回的JSON数组，然后遍历为每个Json对象生成一个li标签，添加到页面上。
这里用了jquery,对于js的也需要也请求处理，这里省略了，很简单，看源码即可。
此时访问，已经可以显示出视频目录了：
接下来就是点击播放了，在html里面有个标签叫video用于播放视频的，他有个src属性用于设置播放的视频路径。
所以我们要做的仅为：
点击名字，拿到该视频对应的url，然后设置给video的src属性即可。
那么视频的url是什么？
刚才我们返回了视频的路径，所以我们只要再监听一个url，将根据传入的视频路径，将视频文件流返回即可。
server.get("/files/.*", new HttpServerRequestCallback() {
@Override
public void onRequest(AsyncHttpServerRequest request, AsyncHttpServerResponse response) {
String path = request.getPath().replace("/files/", "");
try {
path = URLDecoder.decode(path, "utf-8");
} catch (UnsupportedEncodingException e) {
e.printStackTrace();
}
File file = new File(path);
if (file.exists() && file.isFile()) {
try {
FileInputStream fis = new FileInputStream(file);
response.sendStream(fis, fis.available());
} catch (Exception e) {
e.printStackTrace();
}
return;
}
response.code(404).send("Not found!");
}
});
我们又监听了一个url为files/xxx.*，捕获到之后，拿到文件名，去SDCard找到该文件，返回文件流即可。
html端的代码为：
<script type="text/javascript">
$(function() {
var now = new Date();
// 拿到video对象
var $video = $("#videoplayer");
var url = 'files' + '?' + now.getTime();
$.getJSON(url, function(data) {
for (var i = 0; i < data.length; i++) {
var $li = $('<li>' + data[i].name + '</li>');
$li.attr("path", data[i].path);
$("#filelist").append($li);
// 点击的时候，获取路径，设置给video的src属性
$li.click(function() {
var p = "/files/" + $(this).attr("path");
$video.attr("src", "/files/" + $(this).attr("path"));
$video[0].play();
});
}
});
});
</script>
当然页面上body标签内部也多了一个video标签。
<video id="videoplayer" controls="controls"> </video>
到这里，所以的代码就介绍完了~~
小结
回头看，其实就是app中启动服务器，监听一些url，然后针对性的返回文本、json、文件流等。
当然了，可以做的时候也挺多的，甚至可以做个PC版本的文件浏览器。
可能有很多人对html,js不太熟悉，不过还是建议简单了解下，或者敲一下本例，因为本例代码很少，值得作为上手教程。
源码地址：https://github.com/hongyangAndroid/demo_ShowPhoneMp4
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。
相关推荐
-
搭建Android上的服务器 “实现隔空取物”的方法
概述 今天逛简书的时候,发现了一个库: https://github.com/MZCretin/WifiTransfer-master 主要功能是这样的,先口述一下,当打开app,可以通过浏览器访问一个地址,然后通过浏览器可以给手机上上传apk(也支持已有apk删除),然后手机端可以安装.卸载该apk. 三张图就明白了: 应用启动后: 然后PC端访问: 拖拽apk上传,即可上传到手机端. ok,大致介绍清楚了. 注意一定要在同一个网段. 先不谈其用处到底有多大,很多时候我看到一个项目的时候,很少
-
超好玩的"隔空操物"通过Python MediaPipe库实现
目录 1.项目效果展示 1.1:隔空音量控制 1.2:隔空绘画 1.3 :手势识别 1.4:鼠标模拟 2.所涉及到的库 2.1:OpenCv简介 2.2:MediaPipe简介 3.项目环境搭建 4.源码部分 5.总结 文章简介 :本篇文章的实战部分中主要使用到了 MediaPipe 与 OpenCv 两个库,实现了隔空操作的效果,主要有**隔空操作鼠标,隔空绘画,隔空控制音量与隔空手势识别 ** 演示视频 使用这个编程语言,我实现了隔空操物!! 1.项目效果展示 项目主要分为四个部分,分别是
-
android 上传文件到服务器代码实例
android对于上传文件,还是很简单的,和java里面的上传都是一样的,基本上都是熟悉操作输出流和输入流!还有一个特别重要的就是需要一些content-type这些参数的配置! 如果这些都弄好了,上传就很简单了! 下面是我写的一个上传的工具类: 复制代码 代码如下: package com.spring.sky.image.upload.network; import java.io.DataOutputStream;import java.io.File;import java.io.
-
详解在阿里云上搭建自己的git服务器
这篇文章我就来介绍一下如何在一台全裸的阿里云主机上搭建自己的git服务器.详细的介绍了每个步骤,具体如下: 1. 安装git 首先安装git,一般而言,现在的服务器已经内置了git安装包,我们只需要执行简单的安装命令即可安装.比如: $ yum install git # centos $ apt-get install git # ubuntu 上面是直接用root登陆服务器进行操作,也是为了演示方便. git和mysql不一样,mysql在安装时,得安装mysql-server,即mysql
-
Android上传文件到Web服务器 PHP接收文件
Android上传文件到服务器,通常采用构造http协议的方法,模拟网页POST方法传输文件,服务器端可以采用JavaServlet或者PHP来接收要传输的文件.使用JavaServlet来接收文件的方法比较常见,在这里给大家介绍一个简单的服务器端使用PHP语言来接收文件的例子. 服务器端代码比较简单,接收传输过来的文件: <?php $target_path = "./upload/";//接收文件目录 $target_path = $target_path . basenam
-
Android开发中调用系统相册上传图片到服务器OPPO等部分手机上出现短暂的显示桌面问题的解决方法
要原因是主体样式设置的问题:这里把appTheme设置一个style即可: <item name="android:windowBackground">@color/white</item> <!--下面这个属性很重要,有时候会出现某些机型在调用系统相册的时候,短暂的出现手机桌面现象--> <item name="android:windowIsTranslucent">false</item> <i
-
eclipse搭建android开发环境详细步骤
搭建android应用的开发环境,一套程序下来也是相当繁琐的,这里我整理下一整套详细流程: 1,下载JDK 去oracle官网下载最新版本的jdk,官网地址 http://www.oracle.com,附下载链接:http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html. 根据自己的操作系统选择对应jdk下载,选第一个不带demo的,比如64位window系统选择Windows x64:
-
浅谈Android客户端与服务器的数据交互总结
前言: 本文总结了Android客户端与服务器进行交互时,采用RESTful API +Json的交互方式,针对不同的数据形式以及不同的解析方法,如有不足之处,欢迎指正. 温馨提示:本文适合有一定Android开发经验的人阅读,如有疑问,欢迎留言讨论. 先了解一下相关的基本概念. 1. Android客户端与服务器端通信方式 通信方式主要有HTTP和Socket. HTTP通信:即使用HTTP协议进行通信,工作原理是客户端向服务器端发送一条HTTP请求,服务器收到之后先解析客户端的请求,之后会返
-
用Eclipse搭建Android开发环境并创建第一个Android项目（eclipse+android sdk）
一.搭建Android开发环境 准备工作:下载Eclipse.JDK.Android SDK.ADT插件 1.安装和配置JAVA开发环境: ①把准备好的Eclipse和JDK安装到本机上(最好安装在全英文路径下),并给JDK配置环境变量,其中JDK的变量值为JDK安装路径的根目录,如我的为:D:\Program Files\Java\jdk1.7.0_02: ②打开命令提示符(cmd),输入java -version命令,显示如下图则说明JAVA环境变量已经配置好了. 2.安装ADT插件: ①
-
Node 搭建一个静态资源服务器的实现
使用 Node 的内置模块,创建一个可以访问目录的静态资源服务器,支持fs文件读取,资源压缩与缓存等. 一.创建 HTTP Server 服务器 Node 的 http 模块提供 HTTP 服务器和客户端接口,通过 require('http') 使用. 先创建一个简单的 http server.配置参数如下: // server/config.js module.exports = { root: process.cwd(), host: '127.0.0.1', port: '8877' }