jupyter notebook nginx 试听录音文件，网页试听

jupyter notebook 试听录音文件，nginx使用，对于前端还有nginx不太熟悉，特此记录

docker pull nginx, 然后配置nginx文件即可，nginx配置文件简单讲解，point1，nginx比较好的讲解

改编后的 nginx 配置文件 default.conf

server {
    listen       80;
    server_name  localhost;

    #charset koi8-r;
    #access_log  /var/log/nginx/host.access.log  main;

    location /haha/ {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
    }
    
    location /home/wyx/self_nginx/ {
        alias /home/wyx/self_nginx/;
        index index.html;
    }
}

将改变后的配置文件 跟 目标路径挂载到docker 即可，

docker run -d --name nginx -v /home/wyx/self_nginx/conf.d:/etc/nginx/conf.d  -v /home/wyx/self_nginx/ : /home/wyx/self_nginx/   -p 8910:80 nginx

运行下面代码即可实现在线试听， 

from IPython.display import HTML
from os import path
import os
from tabulate import tabulate
from joblib import load
 
 
def _gen_audio_html(label, src, width=300):  # label = filename   src = file_pwd
    sound_tag = """
        <label>{}</label>
        <br />
        <audio controls="controls" style="width:{}px" preload="none">
            <source src="{}" type="audio/wav" />
            Your browser does not support the audio element.
        </audio>
        """
    sound_tag = sound_tag.format(label, width, src)
    return sound_tag
 
 
def gen_audio_html(fp, width=300):# convert the absolute path to relative path
    if fp.startswith('/'):
        fp = "../.." + fp
    filename = path.basename(fp)
    return _gen_audio_html(filename, fp)
 
 
 
TOP_BASE_URL= 'http://127.0.0.1:8910' # 配置nginx 即可
def get_url_fq(filepwd):
    return '{}/{}'.format(TOP_BASE_URL,filepwd)
 
def table(tab_list):
    display(HTML(tabulate(tab_list, tablefmt='html')))  #  jupyter notebook 自带函数 display
 
tab_html = []
src = ['123-liujinjie.wav 0 2']
for idx,line in enumerate(src):
    test_item_filename = line.strip().split()[0].split('-')[1]
    test_pwd = os.path.join('/home/wyx/self_nginx/',test_item_filename)  #  文件的绝对路径
    score = line.strip().split()[2]
    test_url = get_url_fq(test_pwd)
    print(test_url)
    this_html = []
    this_html.append(idx)
    this_html.append(gen_audio_html(test_url))
    this_html.append(score)
    tab_html.append(this_html)
 
table(tab_html)



'''
jupyter notebook  插入图片
<img src="./score.png", width=800, heigth=500>  图片路径是 jupyter 开启后默认路径

在jupyter 中 要显示文件或者路径必须显示相对路径。

'''

 

display(HTML('<h1>Hello, world!</h1>'))
print("Here's a link:")
display(HTML("<a href='http://www.google.com' target='_blank'>www.google.com</a>"))
print("some more printed text ...")
display(HTML('<p>Paragraph text here ...</p>'))

docker pull nginx

docker run -d --name nginx -v /datasdc_3420:/datasdc_3420 \
                            -v /datasdc_3421:/datasdc_3421 \
                            -v /data5:/data5 \
                            -v /datashengwen1:/datashengwen1 \
                            -v /datasdc/cgh/nginx_conf.d:/etc/nginx/conf.d \
                            -p 8910:80 \
                            nginx

修改配置文件 /datasdc/cgh/nginx_conf.d/default.conf 然后重启

docker  exec  -it  nginx  bash
srevice nginx  reload 
(Nginx服务不会终止，主进程检查配置，应用配置的过程。主进程会启动一个新的工作进程处理新来的请求。主进程发送消息给老的工作进程，通知老的进程不在接受请求，处理完现有的请求后退出（优雅退出）)

以前都是用kill -HUP `cat /usr/local/nginx/logs/nginx.pid` 方法来重新加载配置，现在只需要用 /usr/local/nginx/sbin/nginx -s reload 命令即可。

-s参数包含四个命令分别是 stop/quit/reopen/reload

vpser:~# /usr/local/nginx/sbin/nginx -h
nginx version: nginx/0.7.67
Usage: nginx [-?hvVt] [-s signal] [-c filename] [-p prefix] [-g directives]
Options:
-?,-h         : this help
-v            : show version and exit
-V            : show version and configure options then exit
-t            : test configuration and exit
-s signal     : send signal to a master process: stop, quit, reopen, reload
-p prefix     : set prefix path (default: /usr/local/nginx/)
-c filename   : set configuration file (default: conf/nginx.conf)
-g directives : set global directives out of configuration file 

用jupyter 播放视频 

import io
import base64
from IPython.display import HTML

video = io.open('abspathoffile.mp4', 'r+b').read()
encoded = base64.b64encode(video)
HTML(data='''<video alt="test" controls>
<source src="data:video/mp4;base64,{0}" type="video/mp4" />
</video>'''.format(encoded.decode('ascii')))