文件下载和上传功能服务器搭建配置

短命女 2022-10-11 06:18 307阅读 0赞

参考总结:3种实现文件下载和上传功能的服务器搭建配置

--------------------

一、nginx

二、miniserve

三、nodejs

--------------------

一、nginx

效果如下(暂时只有文件下载功能，文件上传功能还没有配置)![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70][]

![20210630110104650.png][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 1][]

Windows下

1.1下载

[http://nginx.org/en/download.html][http_nginx.org_en_download.html]

1.2解压

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 2][]

1.3运行

运行nginx.exe，在浏览器中输入localhost，出现下图表示成功

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 3][]

1.4配置nginx

nginx配置文件详解可以百度一下，太长就不写了，就给个我自己的配置

nginx默认端口是80，可以更改避免出现端口占用。location配置较为关键，我配了两个

局域网内浏览器输入:[http://localhost/downloadtest/][http_localhost_downloadtest]  [http://localhost/apk/][http_localhost_apk]即可访问实现文件下载

#user  nobody;
    worker_processes  1;
    
    #error_log  logs/error.log;
    #error_log  logs/error.log  notice;
    #error_log  logs/error.log  info;
    
    #pid        logs/nginx.pid;
    
    
    events {
        worker_connections  1024;
    }
    
    
    http {
        include       mime.types;
        default_type  application/octet-stream;
    
        #log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
        #                  '$status $body_bytes_sent "$http_referer" '
        #                  '"$http_user_agent" "$http_x_forwarded_for"';
    
        #access_log  logs/access.log  main;
    
        sendfile        on;
        #tcp_nopush     on;
    
        #keepalive_timeout  0;
        keepalive_timeout  65;
    
        #gzip  on;
    
        server {
            listen       80;
            server_name  localhost;
    		charset utf-8;
            #charset koi8-r;
    
            #access_log  logs/host.access.log  main;
    
            #location / {
            #   root   html;
            #   index  index.html index.htm;
            #}
    		
    		location /apk {
    			root F:\\DownloadTest;
    			autoindex on;
    			autoindex_exact_size off;
    			autoindex_localtime on;
    		}
    		location /downloadtest {
    			root F:\\DownloadTest;
    			autoindex on;
    			autoindex_exact_size off;
    			autoindex_localtime on;
    		}
    		
            #error_page  404              /404.html;
    
            # redirect server error pages to the static page /50x.html
            #
            #error_page   500 502 503 504  /50x.html;
            #location = /50x.html {
            #    root   html;
            #}
    
            # proxy the PHP scripts to Apache listening on 127.0.0.1:80
            #
            #location ~ \.php$ {
            #    proxy_pass   http://127.0.0.1;
            #}
    
            # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
            #
            #location ~ \.php$ {
            #    root           html;
            #    fastcgi_pass   127.0.0.1:9000;
            #    fastcgi_index  index.php;
            #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
            #    include        fastcgi_params;
            #}
    
            # deny access to .htaccess files, if Apache's document root
            # concurs with nginx's one
            #
            #location ~ /\.ht {
            #    deny  all;
            #}
        }
    
    
        # another virtual host using mix of IP-, name-, and port-based configuration
        #
        #server {
        #    listen       8000;
        #    listen       somename:8080;
        #    server_name  somename  alias  another.alias;
    
        #    location / {
        #        root   html;
        #        index  index.html index.htm;
        #    }
        #}
    
    
        # HTTPS server
        #
        #server {
        #    listen       443 ssl;
        #    server_name  localhost;
    
        #    ssl_certificate      cert.pem;
        #    ssl_certificate_key  cert.key;
    
        #    ssl_session_cache    shared:SSL:1m;
        #    ssl_session_timeout  5m;
    
        #    ssl_ciphers  HIGH:!aNULL:!MD5;
        #    ssl_prefer_server_ciphers  on;
    
        #    location / {
        #        root   html;
        #        index  index.html index.htm;
        #    }
        #}
    
    }

1.5关闭

(1)任务管理器按1,2顺序结束nginx.exe

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 4][]

(2) 在文件目录下按下shift+鼠标右键，在此处打开Powershell窗口，在PowerShell窗口下输入nginx后按Tab键出现.\\nginx.exe -s stop，回车执行即可关闭

![20210630111134191.png][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 2][]

Linux下

通过相关命令下载nginx，配置nginx.conf即可，启动和关闭参考MacOS下的命令(详细过程略)

MacOS下

1.6下载安装

打开终端按如下顺序依次输入命令即可

/usr/bin/ruby -e "$(curl -fsSL https://cdn.jsdelivr.net/gh/ineo6/homebrew-install/install)"
    git -C "$(brew --repo)" remote set-url origin https://mirrors.ustc.edu.cn/brew.git
    git -C "$(brew --repo homebrew/core)" remote set-url origin https://mirrors.ustc.edu.cn/homebrew-core.git
    echo 'export HOMEBREW_BOTTLE_DOMAIN=https://mirrors.ustc.edu.cn/homebrew-bottles' >> ~/.bash_profile
    source ~/.bash_profile
    brew search nginx
    brew install nginx
    open /usr/local/etc/nginx
    open /usr/local/Cellar/nginx
    nginx

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 5][]

1.7启动

nginx

1.8关闭

(1)top查看nginx是否运行，按顺序kill对应的pid

top
    kill -9 pid

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 6][]

(2)直接终端输入

nginx -s stop

二、miniserve

效果如下:(支持文件下载上传)

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 7][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 8][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 9][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 10][]

Windows下:

2.1下载

[https://github.com/svenstaro/miniserve/releases][https_github.com_svenstaro_miniserve_releases]

![20210630114144811.png][]

2.2运行

将解压的.exe文件直接放到你想要分享的文件夹下，双击运行即可

2.3扩展

在miniserve.exe文件目录下打开Powershell窗口执行如下命令即可在浏览器中实现文件上传下载

.\miniserve.exe -u .\DownloadTest\

具体使用参数

.\miniserve.exe --help

2.4关闭

关闭执行.exe的窗口即可

Linux下:

本文以[Windows10下直接安装Ubuntu18.04适用于Linux的Windows子系统][Windows10_Ubuntu18.04_Linux_Windows]为Linux环境

2.5下载

sudo curl -L https://github.com/svenstaro/miniserve/releases/download/v0.4.1/miniserve-linux-x86_64 -o /usr/local/bin/miniserve
    sudo chmod +x /usr/local/bin/miniserve

2.6运行

\--auth user:passwd sharedir(用户名，密码，分享文件夹目录)(注意更改对应名称)

miniserve -u --auth user:passwd sharedir

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 11][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 12][]

2.7关闭

ctrl+c或者直接关闭终端即可

MacOS下:

2.8下载安装

打开终端依次执行如下命令

没有安装过Homebrew包管理器的依次执行如下命令安装

安装过brew的不用执行上述命令

brew install miniserve
    open /usr/local/Cellar/miniserve
    mkdir sharedir
    mkdir sharedir/avatar.jp
    miniserve -zru sharedir

三、nodejs

效果如下:(支持文件下载上传和删除)

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 13][]![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 14][]

3.1NodeJs安装配置使用(详细过程此文略去啦)

3.2创建项目

// Linux下
    mkdir fileupload
    // Windows下直接新建fileupload文件夹
    npm init
    npm install express
    npm install nodemon -g
    npm install body-parser multer 
    npm install ejs

3.3启动

npm build
    node server.js

3.4附录

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 15][]

jquery.js

[https://www.w3school.com.cn/jquery/jquery\_install.asp][https_www.w3school.com.cn_jquery_jquery_install.asp]

upload.js

filelist.html

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>filelist</title>
    </head>
    <body>
        <h4>文件:</h4>
        <a href="/" style="color:#f40">上传文件</a>
        <ul id="filelist"></ul>
    <script src="/static/jquery.js"></script>
    <script>
        $(function(){
            init();
        })
        function init(){
            $.ajax({
                type: 'GET',
                url:'/getFileList',
                success: function(data){
                    console.log(data)
                    $.each(data, function(index,item){
                        $("#filelist").append("<li><a href='/download?path="+item.path+"'>"+
                            item.name+"</a>    "+getFileSize(item.size)+
                            "    <button onclick='deleteFile(\""+item.path+"\")'>删除</button></li>");
                    })
    
                }
            })
        }
        function getFileSize(size){
            if(size < 1024*1024){
                return (size/1024).toFixed(2)+'KB'
            }else if(size >= 1024*1024&&size<Math.pow(1024, 3)){
                return (size/1024.0/1024).toFixed(2)+'MB'
            }else{
                return (size/1024.0/1024/1024).toFixed(2)+'GB'
            }
            
        }
        function deleteFile(path){
            var param={"filePath": path};
            console.log(path)
            if (confirm('确定删除该文件?')){
                $.ajax({
                    type: 'POST',
                    url:'/delete',
                    data: JSON.stringify(param),
                    contentType:'application/json',
                    success: function(data){
                        window.location.reload();
                    }
                })
            }
            return false;
        }
    </script>
    </body>
    </html>

upload.html

<!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <title>upload</title>
    </head>
    <body>
      <form id="uploadForm" action="" method="post" enctype="multipart/form-data" >
        <input type="file" name="file" multiple> <br><br>
        <input type="submit" value="提交" id="submit"><br><br>
        <a href="/filelist" style="color:#f40">查看文件</a>
      </form>
    
      <script src="/static/jquery.js"></script>
      <script>
        $(function(){
          // 提交表单
          $("#submit").click(function(event){
            // 阻止表单默认提交
            event.preventDefault();
            $.ajax({
                type: 'POST',
                url:'/upload',
                processData: false,
                contentType: false,
                data: new FormData($("#uploadForm")[0]),
                success: function(data){
                    alert('上传文件成功！')
                    window.location.reload();
                },
                error: function(data){
                  alert('上传文件失败！')
                }
            })
          })
        })
      </script>
    <body>
    </body>
    </html>

server.js

var express = require('express')
    var path = require('path')
    var upload = require('./routes/upload')
    var app = express()
    app.set('views', path.join(__dirname, 'views'))
    app.set('view engine', 'ejs')
    app.use('/',upload)
    app.use('/static',express.static(path.join(__dirname, 'public')))
    const port = process.env.port || 3000; //对应一个端口号
    app.listen(port,() =>{
        console.log(`Server running on port ${port}`);
    })

3.4pm2启动(扩展)

进入root权限，在项目根目录下执行如下

su root
    npm install -g pm2

相关命令如下

// 列出由pm2管理的所有进程信息
    pm2 list
    
    // 启动server.js项目并命名
    pm2 start server.js --name servername
    
    // 停止所有进程
    pm2 stop all
    // 停止所有指定进程
    pm2 stop 0
    
    // 重启指定进程
    pm2 restart 0
    // 重启所有进程
    pm2 restart all
    
    // 杀死指定进程
    pm2 delete 0
    // 杀死全部进程
    pm2 delete all
    
    // 显示所有进程日志
    pm2 logs
    
    // 保存当前应用列表
    pm2 save
    // 删除save文件(.dump.pm2和.dump.pm2.bak)
    // 具体位置根据文件所在位置确定(此文仅以Linux为例)
    rm -rf /home/azza/.pm2/dump.pm2
    rm -rf /home/azza/.pm2/dump.pm2.bak
    // 重新加载保存的应用列表
    pm2 resurrect

3.5Windows下BAT文件批处理执行cmd启动

@echo off
    
    echo *****************
    echo.
    echo fileupload start
    echo.
    echo *****************
    
    pause
    
    ::cmd /k执行命令后不关闭dos
    ::cmd /c执行命令后关闭dos
    ::F:\LearningAll\NodeJsProjects\fileupload项目路径
    cmd /k "cd /d F:\LearningAll\NodeJsProjects\fileupload & node server.js"

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70]: /images/20221005/6787858e6cea413eb19101a7fe327b1a.png
[20210630110104650.png]: /images/20221005/0b877e4a289741c7a54d33815a34c045.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 1]: /images/20221005/79bd42faecb940b190a49502116174c0.png
[http_nginx.org_en_download.html]: http://nginx.org/en/download.html
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 2]: /images/20221005/30a29a59cc3146429c940c5619a3310f.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 3]: /images/20221005/9f7efa584a4c4a39b397e13490c7c042.png
[http_localhost_downloadtest]: http://localhost/downloadtest/
[http_localhost_apk]: http://localhost/apk/
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 4]: /images/20221005/899968ae92714af9889c035cab6a07c3.png
[20210630111134191.png]: /images/20221005/3fbd76354b584c9fb6ac8e700c90e51f.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 5]: /images/20221005/c7bd0b13edfd41c0b63e5648f1593a21.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 6]: /images/20221005/ad5edc29290e49a18a2b5bf1a2681de0.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 7]: /images/20221005/1b34bca36db240e98780e022f523b110.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 8]: /images/20221005/d348bfab65404e089f2318ddab8b9fe3.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 9]: /images/20221005/b2ef8f1231fd4a1385766b264e8e50af.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 10]: /images/20221005/8203c22ddc9d41c89ac03195b0fc7263.png
[https_github.com_svenstaro_miniserve_releases]: https://github.com/svenstaro/miniserve/releases
[20210630114144811.png]: /images/20221005/9ee2969f63d5412a91115ccb11d87f47.png
[Windows10_Ubuntu18.04_Linux_Windows]: https://blog.csdn.net/weixin_42039699/article/details/100615300
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 11]: /images/20221005/9344d26509a6425da183164f47e0a415.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 12]: /images/20221005/6e40b175daed46e3b9c9d05615fc51ae.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 13]: https://img-blog.csdnimg.cn/20210630121108881.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 14]: /images/20221005/50228a7052ce4bc68e445c81b6b445ac.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjAzOTY5OQ_size_16_color_FFFFFF_t_70 15]: /images/20221005/2b0575a144c74aa6948c382bcdc84a81.png
[https_www.w3school.com.cn_jquery_jquery_install.asp]: https://www.w3school.com.cn/jquery/jquery_install.asp