docker & django & apache & webpack 实践

目的： 小型demo，在docker内集成django & apache，并使用webpack进行打包，利用docker进行一键部署 

材料：docker / docker-compose /  apache2 / django project 

django project将使用bootstrap & leaflet 作为第三方JS插件，使用webpack进行打包

django是wsgi应用，需要使用wsgi服务器启动，在docker使用apache2服务器。

因为是在window环境下，docker被安装于虚拟机内，在本机需要apache2用于HTTP转发，使得docker instance能够被访问。

思路：

image

1. build base image for python / nodejs / apache2

2. mkdir 相关文件夹，COPY(or git) 相关源码

3. 将apache2配置文件cp到相关文件夹下 （sitename.conf ->  /etc/apache2/sites-available  ports.conf -> /etc/apache2）

4. 使用www-data对相关文件进行授权 (log / static file / sqlite file)

5. pip install & npm install

6. 调用webpack生成JS文件

7. enable sitename.conf & start apache service

container

1. 使用docker compose能够省去繁杂的docker run，这里使用docker compose 构建container

相关 docker file 如下

apache-python.dockerfile

FROM python:3.4.4

MAINTAINER https://hub.docker.com/r/thecd 
RUN apt-get update && \
apt-get install -y apache2 && \
apt-get install -y libapache2-mod-wsgi-py3 && \
apt-get install -y tofrodos

apache-python-nodejs.dockerfile

FROM thecd/apache-python

MAINTAINER https://hub.docker.com/r/thecd 
RUN curl -sL https://deb.nodesource.com/setup_0.12 | bash - && \
apt-get install -y nodejs

项目结构：

|--deployment-config				#apache2 server相关配置
|		|--VueDjango
|			|--dev.sitename.conf	#wsgi应用配置
|			|--ports.conf			#修改apache2监听端口
|			|--start.sh				#docker内启动命令-apache2 server相关启动命令
|--VueDjango
|		|--static					#静态文件 在dev.sitename.conf内
|		|--package.json				#for npm install
|		|--webpack.config.js		#for webpack
|
|--free-map.dockerfile				#dockerfile

free-map.dockerfile （这里简化使用了COPY，一般使用git获取源码）

FROM thecd/apache-python-nodejs:latest

....

RUN	rm /etc/apache2/ports.conf

COPY VueDjango ${APP_DIR}
COPY deployment-config/VueDjango/dev.sitename.conf /etc/apache2/sites-available/
COPY deployment-config/VueDjango/ports.conf /etc/apache2/
COPY deployment-config/VueDjango/start.sh ${APP_DIR}/

RUN     fromdos ${APP_DIR}/start.sh && \
pip install -r ${APP_DIR}/_doc/requirements.pip -i http://pypi.douban.com/simple/ --trusted-host pypi.douban.com && \
cd /home/app/thecd && \
chgrp -R www-data logs && \
chmod -R g+w logs && \
cd ${PROJECT_HOME}/${PROJECT_NAME} && \
chmod -R 644 ${APP_NAME} && \
find ${APP_NAME} -type d -exec chmod -R 755 \{\} \; && \
cd ${APP_DIR} && \
npm install rimraf -g && \
rimraf node_modules && \
npm config set registry https://registry.npm.taobao.org  && \
npm info underscore && \
npm install && \
rm -rf ${APP_DIR}/static && \
mkdir ${APP_DIR}/static && \
mv ${APP_DIR}/common/static/* ${APP_DIR}/static && \
nodejs node_modules/webpack/bin/webpack.js --config webpack.config.js && \
chmod +x ${APP_DIR}/start.sh

free-map.yml

thecd-free-map:
image: thecd/free-map:latest
net: host
ports:
- "8888:80"
container_name: thecd-free-map
command: ./VueDjango/start.sh

启动命令

docker-compose -f free-map.yml up -d

此时已经可以通过 192.168.99.100:8888访问到django项目（此ip为docker VM默认IP）

为了使得其他机器可以访问，需要将该请求经本机转发

本机apache2转发 （for window, run docker on VM）

需要先开启 proxy_module modules/mod_proxy.so proxy_http_module modules/mod_proxy_http.so

在/path/to/Apache/conf/httpd.conf 追加

ProxyPass /free-map http://192.168.99.100:8888/free-map ProxyPassReverse /free-map http://192.168.99.100:8888/free-map