玩具项目 .开门大吉忙忙碌碌的第一天

开发者笔记

hBuilder 连接手机模拟器异常

cd D:\Program Files\Nox\bin 手机模拟器工作目录

sheel>> adb connect 127.0.0.1:62001 
sheel>> adb devices

e:
cd E:\worksoftware\HBuilder\tools\adbs 工作目录

sheel >> adb connect 127.0.0.1:62001
sheel >> adb devices

项目 Chopper 意为乔巴 (海贼王的宠物)

mongo 后台启动和开机启动操作

mongodb设置后台运行

我们要在mongodb下面创建data目录和logs目录，用于存放data和logs。

设置好了之后，我们通常通过

mongod --dbpath /usr/local/mongo/data

让mongodb启动。

但是我们关闭shell，mongodb就停止运行了。如果想在后台运行，启动时只需添加 --fork函数即可。可以在日志路径后面添加--logappend，防止日志被删除。

代码如下：

mongod --fork --dbpath=/usr/local/mongodb/data --logpath=/usr/local/mongodb/logs/mongodb2.log --logappend

这样，你关闭shell，在打开shell，照常可以允许mongo了！

mongodb设置开机启动。

当我们把服务器关闭，重启之后，发现mongodb又停止了，有没有开机就启动的方法呢？我们把上面代码放到/etc/rc.local，中，就可以了。

具体操作步骤：

vim  /etc/rc.local

添加上面启动代码：

/usr/local/mongodb/bin/mongod  --fork --dbpath=/usr/local/mongodb/data  --logpath=/usr/local/mongodb/logs/mongodb2.log  --logappend

下次重启就可以直接运行mongodb了！

采集数据 date_collection.py

import os
import time
import requests

from uuid import uuid4
from setting import IMAGE_PATH
from setting import MUSIC_PATH
from setting import MONGO_DB

base_url = 'http://audio.xmcdn.com/'
url = 'http://m.ximalaya.com/m-revision/page/track/queryTrackPage/%s'

content_list = ['42666925', '42472932', '48271866', '43226220', '48703517', '50026238']
# 这是在喜某拉某上采集的几个地址 半自动化


def deal_data(news):
    detail_content = []

    for item in news:
        audio_id = item

        res = requests.get(url % audio_id)

        res_dict = res.json().get("data").get("trackDetailInfo").get("trackInfo")
        # print('res_dict', res_dict)

        cover_url = base_url + res_dict.get('cover')
        audio_url = res_dict.get('playPath')
        audio = requests.get(audio_url)
        cover = requests.get(cover_url)

        filename = uuid4()
        image = os.path.join(IMAGE_PATH, f'{filename}.jpg')
        music = os.path.join(MUSIC_PATH, f'{filename}.mp3')

        with open(music, 'wb') as f1:
            f1.write(audio.content)

        with open(image, 'wb') as f2:
            f2.write(cover.content)

        music_info = {
            "title": res_dict.get("title"),
            "intro": res_dict.get("intro"),
            "cover": f"{filename}.jpg",
            "audio": f"{filename}.mp3",
        }

        detail_content.append(music_info)
        time.sleep(1)
    print(detail_content)
    MONGO_DB.content.insert_many(detail_content)
    # 写入mongodb数据库


deal_data(content_list)

# 数据大致是这个样子
[{
	'title': '008-狐狸和狼的故事',
	'intro': '',
	'cover': '242ece4b-d42a-4cbb-a8a0-6c4c648145c9.jpg',
	'audio': '242ece4b-d42a-4cbb-a8a0-6c4c648145c9.mp3'
}, 
{
	'title': '005-神灯',
	'intro': '',
	'cover': '6cb4d654-9d8f-4e76-8e3b-4a79ad10071c.jpg',
	'audio': '6cb4d654-9d8f-4e76-8e3b-4a79ad10071c.mp3'
}, 
{
	'title': '020-蠢汉、驴子与骗子的故事',
	'intro': '',
	'cover': '7a846087-cb46-49d4-ad82-9d9881707a64.jpg',
	'audio': '7a846087-cb46-49d4-ad82-9d9881707a64.mp3'
}, 
{
	'title': '012-三个苹果的故事',
	'intro': '',
	'cover': '160fe95b-b00e-4b6c-9c13-e84b525b2649.jpg',
	'audio': '160fe95b-b00e-4b6c-9c13-e84b525b2649.mp3'
}, 
{
	'title': '026-国王和神医',
	'intro': '',
	'cover': '97253b33-650d-44e6-afb6-b3a5499df354.jpg',
	'audio': '97253b33-650d-44e6-afb6-b3a5499df354.mp3'
}, 
{
	'title': '042-狐狸和野驴的故事',
	'intro': '',
	'cover': 'b3f8d7cf-fe7e-4c7c-8ff6-a18204f19249.jpg',
	'audio': 'b3f8d7cf-fe7e-4c7c-8ff6-a18204f19249.mp3'
}]

Server 中的content.py

from flask import Blueprint, jsonify
from setting import MONGO_DB, RET

content = Blueprint('content', __name__)


@content.route('/content_list', methods=["POST"])
def content_list():
    res = list(MONGO_DB.content.find({}))

    for index, item in enumerate(res):
        res[index]['_id'] = str(item.get('_ID'))

    RET['code'] = 0
    RET['msg'] = '查询幼教内容'
    RET['data'] = res
    print('RET', RET)

    return jsonify(RET)

Server 中的get_set_anything.py

import os
from flask import Blueprint, send_file
from setting import MUSIC_PATH, IMAGE_PATH

gsa = Blueprint('gsa', __name__)


@gsa.route('/images/<filename>')
def get_image(filename):
    file_path = os.path.join(IMAGE_PATH, filename)
    return send_file(file_path)


@gsa.route('/music/<filename>')
def get_music(filename):
    file_path = os.path.join(MUSIC_PATH, filename)
    return send_file(file_path)

chopper_app.py

from flask import Flask, render_template
from Server import content
from Server import get_set_anything

app = Flask(__name__)

app.register_blueprint(content.content)
app.register_blueprint(get_set_anything.gsa)


@app.route('/')
def toy():
    return render_template('toy.html')


if __name__ == '__main__':
    app.run('0.0.0.0', 9527, debug=True)

玩具页面 templates/toy.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<audio autoplay controls id="player"></audio>
</body>

<script type="application/javascript">
  let  ws = new WebSocket('ws://192.168.13.204:3721/toy/toy123');
  ws.onmessage = function (data) {
      console.log(data.data)
      let msg = JSON.parse(data.data);
      document.getElementById('player').src='http://192.168.13.204:9527/music/' +msg.music;

  }

</script>
</html>

websocket代码 chopper_ws.py

import json
from flask import Flask, request
from geventwebsocket.handler import WebSocketHandler
from gevent.pywsgi import WSGIServer
from geventwebsocket.websocket import WebSocket

ws_app = Flask(__name__)

user_socket_dict = {}


@ws_app.route('/app/<app_id>')
def app(app_id):
    user_socket = request.environ.get('wsgi.websocket')  # type:WebSocket
    if user_socket:
        user_socket_dict[app_id] = user_socket

    print('user_socket_dict', user_socket_dict)
    while True:
        user_msg = user_socket.receive()
        print('user_msg', user_msg)
        msg_dict = json.loads(user_msg)
        toy_socket = user_socket_dict.get(msg_dict.get('to_user'))
        toy_socket.send(user_msg)


@ws_app.route("/toy/<toy_id>")
def toy(toy_id):
    user_socket = request.environ.get("wsgi.websocket")  # type: WebSocket
    if user_socket:
        user_socket_dict[toy_id] = user_socket
    print('user_socket_dict', user_socket_dict)
    while 1:
        user_msg = user_socket.receive()
        print('user_msg', user_msg)


if __name__ == '__main__':
    http_server = WSGIServer(('0.0.0.0', 3721), ws_app, handler_class=WebSocketHandler)
    http_server.serve_forever()

ui页面

index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title></title>
    <script src="js/mui.min.js"></script>
    <link href="css/mui.min.css" rel="stylesheet"/>
   
</head>
<body>
	
</body>
	 <script type="text/javascript" charset="utf-8">
	 // 创建子页面
      	mui.init({
      		subpages:[{
      			url:'main.html',
      			id:'main.html',
      			styles:{
      			top:'0px', // mui 标题栏默认高度为45px;
      			bottom:'50px' // 默认为0px, 可选项;
    
      					}     		
      		}]
      	});
      	
      	var ws = new WebSocket('ws://192.168.13.204:3721/app/app01');
      	document.addEventListener('send_music',function(data){
      		var send_str = data.detail // {to_user:'toy123', music:Sdata.audio}
      		ws.send(JSON.stringify(send_str));
      		
      	})
    </script>
</html>

main.html

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>Document</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link rel="stylesheet" type="text/css" href="css/mui.css"/>
</head>
<body>
  
  

	<ul class="mui-table-view mui-grid-view mui-grid-9">
	<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
	    <a href="#">
	        <span class="mui-icon mui-icon-home"></span>
	        <div class="mui-media-body">Home</div>
	    </a>
	</li>
	<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-">
	    <a href="#">
	        <span class="mui-icon mui-icon-email"><span class="mui-badge mui-badge-red">5</span></span>
	        <div class="mui-media-body">Email</div>
	    </a>
	</li>
	<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
	    <a href="#">
	        <span class="mui-icon mui-icon-chatbubble"></span>
	        <div class="mui-media-body">Chat</div>
	    </a>
	</li>
	<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
	    <a href="#">
	        <span class="mui-icon mui-icon-location"></span>
	        <div class="mui-media-body">Location</div>
	    </a>
	</li>
	<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
	    <a href="#">
	        <span class="mui-icon mui-icon-search"></span>
	        <div class="mui-media-body">Search</div>
	    </a>
	</li>
	<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
	    <a href="#">
	        <span class="mui-icon mui-icon-phone"></span>
	        <div class="mui-media-body">Phone</div>
	    </a>
	</li>
	    </ul>
	
	<ul class="mui-table-view" id="content_list">
        <li class="mui-table-view-cell mui-media">
            <a href="javascript:;">
                <img class="mui-media-object mui-pull-left" src="http://placehold.it/40x30">
                <div class="mui-media-body">
                    幸福
                    <p class="mui-ellipsis">能和心爱的人一起睡觉，是件幸福的事情；可是，打呼噜怎么办？</p>
                </div>
            </a>
        </li>

    </ul>
  	
	<nav class="mui-bar mui-bar-tab">
	    <a class="mui-tab-item mui-active">
	        <span class="mui-icon mui-icon-home"></span>
	        <span class="mui-tab-label">首页</span>
	    </a>
	    <a class="mui-tab-item">
	        <span class="mui-icon mui-icon-phone"></span>
	        <span class="mui-tab-label">电话</span>
	    </a>
	    <a class="mui-tab-item">
	        <span class="mui-icon mui-icon-email"></span>
	        <span class="mui-tab-label">邮件</span>
	    </a>
	    <a class="mui-tab-item">
	        <span class="mui-icon mui-icon-gear"></span>
	        <span class="mui-tab-label">设置</span>
	    </a>
	</nav>
</body>
	<script src="js/mui.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
    mui.init();
    
    mui.plusReady(function(){
    	mui.post(window.server + '/content_list',{
    			
    		},function(data){
    			console.log(JSON.stringify(data))
    			for (var i = 0; i < data.data.length; i++) {
        			create_item(data.data[i]);
        		}
    		},'json'
    	);
    })
    
    function create_item(content){         
          var li = document.createElement("li");
          li.className ="mui-table-view-cell mui-media";
          var a = document.createElement("a");
          a.onclick = function(){
          		mui.openWindow({
          			url:"player.html",
          			id:"player.html",
          			extras:content
          		})
          }
          var img = document.createElement("img");
          img.className ="mui-media-object mui-pull-left";
          img.src = window.server_image + content.cover;
          var div = document.createElement("div");
          div.className="mui-media-body";
          div.innerText = content.title;
          var p = document.createElement("p");
          p.className="mui-ellipsis";
          p.innerText=content.intro; 
          
          li.appendChild(a);
          a.appendChild(img);
          a.appendChild(div);
          div.appendChild(p);
          
          document.getElementById("content_list").appendChild(li);
    }
    </script>
</html>

player.html 播放器页面

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>Document</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link rel="stylesheet" type="text/css" href="css/mui.css"/>
</head>
<body>
    <header class="mui-bar mui-bar-nav">
        <h1 class="mui-title" id='title'>正在播放xxxxxx</h1>
    </header>
   	
   	<div class="mui-content">
   	     <div class="mui-row" style="text-align: center; margin-top: 10px;" >
            <img src="" id="cover" style="height: 250px;width: 250px; border-radius: 50%;"/>
        </div>
        
        <button type="button" id="pause" class="mui-btn mui-btn-yellow mui-btn-block">暂停</button>
        <button type="button" id="resume" class="mui-btn mui-btn-green mui-btn-block">继续</button>
        <button type="button" id="stop" class="mui-btn mui-btn-red mui-btn-block">停止</button>
        <button type="button" id="send" class="mui-btn mui-btn-blue mui-btn-block">发送给玩具</button>
   	</div>
   	
</body>
 	<script src="js/mui.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
    mui.init();
    var Sdata = null;
    var myplayer = null;
    mui.plusReady(function () {
        Sdata = plus.webview.currentWebview();
        document.getElementById('title').innerText = '正在播放' + Sdata.title;
        document.getElementById('cover').src  = window.server_image + Sdata.cover;
        myplayer = plus.audio.createPlayer(window.server_music + Sdata.audio);
        myplayer.play();
    })
    
     document.getElementById('pause').addEventListener('tap',function () {
          myplayer.pause();  
    })
    
    document.getElementById('resume').addEventListener('tap',function () {
          myplayer.resume();  
    })
    
    document.getElementById('stop').addEventListener('tap',function () {
            myplayer.stop();
    })
    
   document.getElementById('send').addEventListener('tap',function () {
 		var index = plus.webview.getWebviewById('HBuilder');
 		mui.fire(index,'send_music',{to_user:'toy123', music: Sdata.audio})
   })
    </script>
</html>

nui.js 增加的代码

window.server = 'http://192.168.13.204:9527';
window.server_image = window.server + "/images/";
window.server_music = window.server + '/music/';