当前分类： W.Honee的技术小札 > 互联网与人工智能 > 服务器与互联网技术 > 局域网图片网站制作

分类：局域网图片网站制作

局域网图片网站制作：正式开始

前面三篇文章已经从零开始搭建好了运行环境，现在开始正式项目，前面三篇文章的地址如下：

1）项目规划：局域网图片网站制作：项目规划
2）运行环境：局域网图片网站制作：运行环境的搭建
3）安装配置：局域网图片网站制作：Nginx，python及Flask的安装配置

若遇到自启动问题可以直接参考文章最后： 自启动的修改说明

第一步，github建立项目然后下载。

首先到github新建一个空的项目，名叫：LocalCartoon（前面有部分介绍把cartoon的翻译弄错，这里就不修改前面的了，这里修改一下就好了），切换到devlop分支。其地址：
https://github.com/honeeWong/LocalCartoon.git
可以在虚拟机中直接运行git clone https://github.com/honeeWong/LocalCartoon.git，就可以下载到最新的代码。
继续阅读“局域网图片网站制作：正式开始”

局域网图片网站制作：Nginx，python及Flask的安装配置

由于上一篇文章内容过多，因此将Nginx，python虚拟环境和Flask的安装做为一个新的篇来讲述，本篇内容相对简单，而且有其他文章已经针对python虚拟环境和Flask有所讲述，所以这里简单说明：

Nginx的安装

centOS默认的yum是没有Nginx源的，我这里参考网络的方法将源加入到yum中，具体如下：

rpm -ivh http://nginx.org/packages/centos/7/noarch/RPMS/nginx-release-centos-7-0.el7.ngx.noarch.rpm

执行yum install即可安装Nginx

yum -y install nginx

安装完毕启动Nginx，输入：

service nginx start

正常情况下，在浏览器页面输入：http://192.168.1.168就可以看到Nginx的欢迎页面。

Python3的安装和Flask的安装。

centOS默认python版本是2.75，我们这边要更新到python3，按照如下方式进行：

yum install epel-release
yum install python34

然后按照 Python Flask微框架安装与基础说明 配置python 虚拟环境和安装Flask，简要步骤如下：

# 新建文件夹
mkdir p3venv
# 创建虚拟环境
python3 -m venv p3venv/
# 使能虚拟环境
#source p3venv/bin/activate
# 安装flask
pip install flask

这样基本的flask的环境安装完毕，需要更多的库的时候，可以继续用pip install 来安装。

编写简单的flask demo，测试Nginx的转发。

flask demo 如下所示：

# -*- coding: utf-8 -*-
#
# some messages for author 
#

# import flask
from flask import Flask

# 定义 app
app = Flask(__name__)

# 根页面
@app.route('/')
def index():
    # demo 
    return '<h1>Hello World!</h1>'
 
#执行app.run
if __name__ == '__main__':
    app.run(debug=True)

保存上述代码为demo.py, 直接运行python demo.py,然后再新窗口中输入：

curl 127.0.0.1:5000
#即可看到hellworld的页面内容。
  • 安装gunicorn

在虚拟的python3环境下输入 ：

pip install gunicorn

安装完毕后输入：

#注意文件路径和执行的app名称要和文件一致。
gunicorn -w 4 -b 127.0.0.1:8080 demo:app

打开/etc/nginx/conf.d文件夹中的default.conf文件，修改配置Nginx方法如下（这里也可以将default.conf改成.bak，然后新建一个carton.conf文件即可）：

server {
    listen 80;
    server_name 192.168.1.168; # 这是HOST机器的外部域名，用地址也行

    location / {
        proxy_pass http://127.0.0.1:8080; # 这里是指向 gunicorn host 的服务地址
        proxy_set_header Host $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
  }

然后输入：systemctl restart nginx 重启nginx，即可在浏览器中看到hello world的显示，表示配置成功。

注：本篇就将环境配置基础内容记录完毕，后续涉及到具体的开发环境的配置和自启动部分，后续更新。

局域网图片网站制作：运行环境的搭建

运行环境是一个网站的基石，废话不多叙，这里直接进入主题。按照计划这里我会按照如下的方式进行：

  1. 下载安装virtual-box。
  2. 安装centOS到virtual-box中。
  3. 配置ssh，samba
  4. 配置Nginx，Python虚拟环境及Flask（下篇文章讲述）。

下面开始实施：

1. 下载安装virtual-box

进入virtual-box官网(https://www.virtualbox.org/)下载最新的版本即可，目前我使用的版本是5.1.22，下载二进制文件地址为：
https://www.virtualbox.org/wiki/Downloads
注：下载完毕后按照提示安装，期间需要安装几个网络设备驱动，按照提示安装好即可。
安装完毕后启动界面如下图：

2. 安装centOS到virtual-box中

到CentOS的官方网站(https://www.centos.org/)，在选择版本的时候，选择最新的CentOS 7，由于是第一次折腾，因此选择mini版本的，如下为选择图片：

果然mini版本就是小，才不到700M，如下图：

下载完毕后就开始安装centos到virtual-box中，由于virtual-box默认没有centos的选项，因此按照如下图示新建：

然后按照步骤安装好系统，配置如下：
内存：2048M
硬盘：创建动态最大108GB
其他默认即可
注意：盘符名和文件路径不能带中文和特殊字符，不然会创建失败。错误提示：Could not create the medium storage unit ‘D:\carton\virtual-box\centos7.vdi’.

然后按照下图顺序载入centOS镜像：

然后点击OK退出，在主界面点击启动，即可进入centOS的安装界面：

由于是图形化的界面，还有中文可选，因此后续安装步骤省略，这里记录下安装时候的root密码和账号密码：
root密码：Carton9527~~
用户名：carton
密码：Ct789321@@##
说明一下：密码不能过于简单，会导致无法确定；安装过程很简单，按照提示配置好自动安装，重启即可使用。

3.配置ssh，samba。

习惯了putty的操作界面，对于直接virtual-box的小窗口操作比较别扭，因此首先看下ssh是否正常运行。

SSH篇

  • 首先查看进程发现sshd已经运行，以下是查看的指令：
# 查看所有进程，并选择出包含有ssh的进程名
ps -aux | grep ssh

sshd是ssh的服务端进程，因此sshd被发现，说明ssh的服务器端已经正常，但是要看到本机的IP才能访问。

  • 然后当我输入ifconfig去查看本机IP时，发现centOS默认没有安装此指令。

因此需要查找ifconfig所在工具包然后安装，输入yum search ifconfig，结果如下图：

按照上图应该是需要安装net-tools.x86_64，即包含有此指令，因此运行：

yum install net-tools.x86_64

安装完毕就可以执行ifconfig。

这里注意3点：1. 执行yum需要切换到root用户；2. ifconfig查看的出来的IP若不是本地局域网的IP需要调整虚拟机的网络接口方式为：桥接网卡。；3. 最好在路由器中给此虚拟机绑定MAC与IP。

  • 再后来，发现virtual-box不能后台执行，查了下相关资料发现可以命令行式的后台启动，方法如下：

1.在win+R键打开运行菜单中输入：

# -type headless 后台启动
D:\tools\virtual-box\VBoxManage.exe startvm "centos-7"  -type headless

2. 将此命令写入bat文件执行亦可。

  • 最后调整下IP地址的固定就可以顺利的启动ssh客户端putty来连接服务器了。

Samba篇

FTP在局域网没有samba方便，暂时不考虑。

  • 首先执行 yum -y install samba samba-client 即可安装samba，如下方式检查安装情况：
rpm -qa |  grep samba


注：安装samba还有其他的相关库会被安装。

  • 然后进行smb.conf的配置，配置后文件如下：


注：1. 配置时要注意用testparm检查是否有语法错误。2. 需要将用户carton添加到samba组，输入 smbpasswd -a carton，按照提示输入密码即可，此处密码为123456789

  • 接着关闭SELinux和防火墙
//a、临时关闭（不用重启机器）: 
# setenforce 0                       ##设置SELinux 成为permissive模式  （关闭SELinux）
# setenforce 1                       ##设置SELinux 成为enforcing模式     （开启SELinux）
    
//b、修改配置文件需要重启机器： 	
# vi /etc/selinux/config
// 将SELINUX=enforcing 改为SELINUX=disabled(需重启机器)
 
//c、可自己做策略开放相应端口，这里我直接关闭:
# systemctl status firewalld.service       ## 查看防火墙状态
# systemctl stop firewalld.service         ## 关闭防火墙a、临时关闭（不用重启机器）
//d、关闭自启动防火墙。
# systemctl disable firewalld.service      ## 关闭自动启动防火墙
  • 最后执行如下指令启动smb 和nmb，即可使用windwos进行访问。
systemctl start smb nmb
systemctl status smb nmb

至此控制和访问部分基本完毕。

后续章节讲述安装配置Nginx，Python虚拟环境及Flask。

局域网图片网站制作：项目规划

无客户端编程，我个人觉得是一个未来的趋势，特别是浏览器已经成为一个强大的入口时，那些越来越平常的需求，已经不足以支撑客户去安装和下载一个客户端，且站在可移植性和开发难度上讲，适配主流的浏览器比起适配主流的设备要容易的多，因此有了这一计划。

目标

  1. 建立一个方便浏览图片的网站，但是基于局域网，原因稍后说明。
  2. 主要匹配手机端，方便手机和平板查看。

主要功能摘要

  1. 主要存在有文件分类夹预览页，缩略图页及查看页三个页面。
  2. 图片需要预加载，切换速度要跟上浏览速度。
  3. 支持全屏模式，并且在全屏模式有菜单切换上下页，返回，后续增加浏览
  4. 不支持前端上传，但支持后台FTP上传。

方案及实施

  1. 采用虚拟机Virtual-Box建立服务器端，预计采用centOS ，搭建好的centOS的虚拟包会上传到本服务器或者百度云。
  2. 由于没有数据库，而且内容简单，计划采用python来进行实施。
  3. 按照性能要求，服务器端的应用采用Flask+Nginx的方式进行。
  4. 所有源代码将会开源到github，此博客将会更新所有的项目开发步骤。

几点问题释疑

为何采用局域网？

因为暂时不想考虑网络安全，高并发，数据压缩和效率的问题，因为局域网有高带宽和低并发的特点，因此要简单很多。

为何采用CentOS+Flask+Nginx？

Flask是目前比较熟悉的轻量级的Web框架，Nginx相对比较快速而且轻便，而centOS传说十分的稳定。

centOS我还没用，不知道好不好弄。也是头一次尝试。

其他有必要后续补充