Пробная версия развертывания Nginx + Node + Vue (изменено 18 марта 2019 г.)

Nginx

Прежде чем родители приготовят новогоднюю ночь, я выложу свои заметки, которые я сделал раньше.Новый год здесь, я желаю вам всего наилучшего

New Year's Eve

Rich overnight

Nginx + Node + VueПробное развертывание

Знай почти

личный блог

Github

ежедневные учебные записи

Nginx

  1. определение

    асинхронная структуравеб сервер, также может использоваться какобратный прокси,балансировщик нагрузки , HTTP-кеширование, программное обеспечение с открытым исходным кодом для потоковой передачи мультимедиа и т. д. Изначально он был разработан для максимальной производительности и стабильности.Webсервер. КромеHTTPПомимо серверной функции,NGINXТакже можно использовать как электронное письмо (IMAP,POP3а такжеSMTP) прокси-сервер иHTTP,TCPа такжеUDPОбратный прокси-сервер и балансировщик нагрузки.

  2. Функции

    • Быстрее
    • высокая масштабируемость,NginxМодули встроены в бинарный файл для выполнения
    • Высокая надежность
    • низкое потребление памяти
    • Одна машина поддерживает 100 000 одновременных подключений.
    • горячее развертывание,masterуправление сworkДизайн разделения рабочих процессов, поэтому он имеет функцию горячего развертывания
    • самый свободныйBSDсоглашение
  3. Функция

    • статический сервис (css , js , html, images, videos)
    • SSLа такжеTLS SNIслужба поддержки
    • HTTP/HTTPS, SMTP, IMAP/POP3обратный прокси
    • FastCGIобратный прокси
    • Балансировка нагрузки
    • кэш страницы (CDN)
    • служба поддержкиgzip,expirse
    • служба поддержкиkeep-aliveсоединенный с трубами
    • на основеPCREизrewriteпереписать модуль
    • Ограничение пропускной способности
    • на основеIPи название службы веб-хостинга
    • Поддержка скорости доступа, ограничение параллелизма
    • Обратный прокси (применимо2000WPV, одновременные подключения1W/сек), простая балансировка нагрузки и отказоустойчивость
    • на основе клиентаIPадрес иHTTPБазовый контроль доступа для аутентификации

MacУстановитьNginx

// 推荐使用`brew`, 安装`homebrew`
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
// Homebrew 安装 Nginx 
brew install nginx
// Mac 下 Nginx的目录
cd /usr/local/etc/nginx
ll -al
vim nginx.conf

homebrewсмотрите подробности

cd-nginx

Список параметров Nginx

Свойства параметра конфигурации объяснять список параметров
user Установите системного пользователя службы nginx nobody(Примечание: если пользователь здесь больше, чемNginxПрава пользователя низкие, вам нужно перезапустить с текущим пользователемNginx)
nginx -s stopзакрытиеnginx-> nginxстарт ->ps aux | grep nginxПросмотр запуска пользователя
worker_processes Количество открытых тем Обычно соответствует количеству ядер сервера
error_log Найдите глобальный файл журнала ошибок Уровень определения журнала ошибок, [ отладка | информационное уведомление | предупреждение | ошибка | крит ], вывод отладки - самый высокий, вывод crir - наименьший
pid Указывает расположение файла хранилища идентификатора процесса.
worker_rlimit_nofile Укажите максимальное количество файловых дескрипторов, открываемых процессом nginx, которое ограничено максимальным количеством открытых файлов системного процесса.
events ВключатьNginxВсе настройки для обработки подключений в
http Все основные функции обработки http Nginx

Event

NginxдаeventМодуль обработки (событий) на основе модели. Для поддержки кроссплатформенности он абстрагируетсяeventмодуль. он поддерживаетeventТипы обработки:AIO(асинхронныйIO),/dev/poll(Solarisа такжеUnixуникальный),epoll(Linuxуникальный),eventport(Solaris10 уникальных),kqueue(BSDуникальный),poll,rtsig(сигнал реального времени),selectЖдать. его роль заключается в наблюденииacceptПосле установления соединения добавьте и удалите события чтения и записи. модель обработки событий иNginxиспользуется в сочетании с неблокирующей моделью ввода-вывода. когдаIOКогда он доступен для чтения и записи, соответствующее событие чтения и записи будет активировано, и в это время будет обработана функция обратного вызова события.

Свойства параметра конфигурации объяснять список параметров
worker_connections Определить максимальное количество подключений на процесс, ограниченное максимальным количеством открытых файлов системного процесса Максимальное количество одновременных подключений для одного фонового рабочего процесса (максимальное количество подключений = worker_processes * worker_connections)
В среде обратного прокси:
Максимальное количество соединений = рабочие_процессы * рабочие_соединения / 4
use Выберите доступную модель события (можно указать во время компиляции), Nginx автоматически выберет модель события. [ epoll | /dev/poll | poll | eventport | kqueue | select | rtsig ]
multi_accept Принимать как можно больше подключений после уведомления о новом подключении on / off
accept_mutex Включить или отключить использование мьютекса для открытия сокетов on / off

Event UseПоддерживаемые модели событий

events-use

Eventsсмотрите подробности

HTTP

Может быть вложен несколькоserver, настроить прокси, кеш, определение журнала и большинство других функций и настроить сторонние модули.

Свойства параметра конфигурации объяснять список параметров
include Основная инструкция модуля реализует настройку файлов, содержащихся в файле конфигурации, что может уменьшить сложность основного файла конфигурации. ZonerFC1912 и ACL в основном файле конфигурации DNS в основном используют оператор включения
default_type директивы основного модуля Настройкой по умолчанию является двоичный поток, который используется, когда тип файла не определен.
log_format Настройки формата журнала Название формата лога, которое можно задать самостоятельно, ссылка будет позже
access_log Журнал цитирования Имя, которое относится к настройке log_format
keepalive_timeout Установите время ожидания времени ожидания клиентского соединения Сохранить 0 неограничен
sendfile Включить эффективный режим передачи файлов on / off
tcp_nopush Включить предотвращение блокировки сети on / off
tcp_nodelay Включить предотвращение блокировки сети on / off
upstream Балансировка нагрузки
server Конфигурация виртуального хоста сервера Nginx

Upstream

Его роль заключается в достижении балансировки нагрузки внутренних серверов между опросом и IP-адресом клиента.

Свойства параметра конфигурации объяснять
опрос (по умолчанию) Когда вес не указан, вес каждого сервера одинаков, и каждый запрос распределяется по разным внутренним серверам один за другим в хронологическом порядке.Если внутренний сервер не работает, он может быть автоматически устранен.
weight Укажите вероятность опроса, а вес пропорционален коэффициенту доступа, который используется, когда производительность внутреннего сервера неравномерна.
ip_hash Каждый запрос распределяется в соответствии с результатом хеширования IP-адреса доступа, чтобы каждый посетитель мог получить фиксированный доступ к внутреннему серверу, что может решить проблему сеанса.
честный (третья сторона) Запросы распределяются в соответствии со временем отклика внутреннего сервера, и первыми распределяются запросы с коротким временем отклика.
url_hash (третья сторона) Распределяйте запросы в соответствии с хеш-результатом доступа к URL-адресам, чтобы каждый URL-адрес был направлен на один и тот же внутренний сервер, что более эффективно, когда внутренний сервер кэшируется.

weightПо умолчанию 1.weightЧем больше вес, тем больше вес груза.

Nginx Upstreamусловие

Например:

upstream news {
    server 127.0.0.1:9527 backup;
    server 127.0.0.1:9527 weight=1 max_fails=2 fail_timeout=3;
    ...
}
Свойства параметра конфигурации объяснять
backup Зарезервированный резервный сервер
down Текущий сервер временно не участвует в балансировке нагрузки
fail_timeout Время, в течение которого служба приостанавливается после сбоев max_fails.
max_conns Ограничьте максимальное количество полученных подключений
max_fails Допустимое количество неудачных запросов

use location:существуетserverдобавлено в

proxy_pass http://127.0.0.1:9527;
// 因为我的API接口是这个,such as /api/profile
// location 具体匹配规则详见后面
location ~ /api/ {
    proxy_pass http://127.0.0.1:9527;
}

Server

Настройте соответствующие параметры виртуального хоста,httpможет иметь несколькоserver.

Свойства параметра конфигурации объяснять список параметров
listen порт прослушивания http -> 80 / https -> 443
server_name Установите доменное имя хоста localhost
charset Установите код языка для доступа
access_log Установите путь к хранилищу и формат журнала доступа к виртуальному хосту.
location Основная информация по настройке виртуальных хостов
Location

Настройте маршрутизацию запросов и обработку различных страниц.

Свойства параметра конфигурации объяснять список параметров
root Установите корневой каталог веб-сайта виртуального хоста Корневой каталог проекта Vue /Users/rainy/Desktop/MyWork/Work/cloudwiz-website/dist
index Установите веб-страницу, которую виртуальный хост посещает по умолчанию. index.html index.htm
proxy Передавать запросы от NGINX к прокси-серверу по разным протоколам
  • =: в начале указывает на точное совпадение, напримерapiсоответствует только запросам в конце корневого каталога и не может сопровождаться какой-либо строкой.
  • ^~: начать указыватьuriНачинается с некоторой обычной строки, а не обычного совпадения.
  • ~: в начале указывает на регулярное соответствие с учетом регистра.
  • ~*: в начале указывает на регулярное сопоставление без учета регистра.
  • /: универсальное соответствие, если нет другого совпадения, будет сопоставлен любой запрос.

Приоритет сопоставления (от высокого к низкому)

  1. location =
  2. location 完整路径
  3. location ^~ 路径
  4. location ~,~* 正则顺序
  5. location 部分起始路径
  6. /

смотрите подробностиLocationнастроить

Reverse Proxy

когдаNGINXПри проксировании запроса он отправляет запрос на указанный прокси-сервер, получает ответ и отправляет его обратно клиенту. Запросы могут быть проксированы с использованием указанного протокола дляHTTPсервер (другойNGINXсервер или любой другой сервер) или неHTTPСерверы (могут работать с использованием определенных платформ, таких какPHPилиPython) разработанные приложения).

location  / some / path /  {
    proxy_pass  http://www.example.com:8080;
    
    proxy_set_header  Host  $ host ; 
    proxy_set_header  X-Real-IP  $ remote_addr ;
    
    // 禁用特定位置的缓冲
    proxy_buffering  off ;
    proxy_buffers  16  4k ; 
    proxy_buffer_size  2k ;
    
    proxy_bind  127.0.0.2 ; // IP地址也可以用变量指定
}

передать запрос неHTTPпрокси-сервер,**_passСледует использовать соответствующую директиву:

  • fastcgi_passПередать запрос на сервер FastCGI
  • uwsgi_passПередать запрос на сервер uwsgi
  • scgi_passПередать запрос на сервер SCGI
  • memcached_passПередать запрос на сервер memcached
Свойства параметра конфигурации объяснять столбец параметров
proxy_pass Передать запрос на прокси-сервер HTTP
proxy_set_header Пройти заголовки запроса По умолчанию NGINX переопределяет два поля заголовка «Хост» и «Соединение» в проксируемых запросах и удаляет поля заголовка, значение которых является пустой строкой. «Хост» настроен на$proxy_hostпеременная, "Соединение" установлено вclose.
proxy_buffering Отвечает за включение и отключение буферизации on / off
proxy_buffers Размер и количество буферов, запрошенных для выделения
proxy_buffer_size Первая часть ответа прокси-сервера сохраняется в буфере отдельного размера. Обычно содержит относительно небольшой заголовок ответа и может иметь меньший буфер, чем остальная часть ответа.
proxy_bind Принимать подключения из определенной IP-сети или диапазона IP-адресов уточнитьproxy_bindИнструкции и IP-адреса для необходимых сетевых интерфейсов

смотрите подробностиProxy

глобальная переменнаяGlobal Variable

имя переменной Значение переменной
$args параметры в запросе
$content_length HTTPв запросеContent-Length
$content_type в запросеContent-Type
$host в запросеHost, если запрос неHostстрока, она равна заданному имени сервера
$http_cookie cookieИнформация
$http_referer справочный адрес
$http_user_agent Информация о клиентском прокси
$remote_addr адрес клиента
$remote_port номер порта клиента
$remote_user Имя пользователя клиента, для аутентификации
$request_method метод запроса, напримерGET,POSTЖдать
$request_uri полный исходный запросURI(с параметрами)
$scheme план запроса,httpилиhttps
$server_addr адрес сервера, принимающего запрос, если он не полезенlistenУкажите адрес сервера.Использование этой переменной инициирует системный вызов для получения адреса (что приводит к пустой трате ресурсов);
$server_protocol запрошенная версия протокола,HTTP/1.0илиHTTP/1.1
$uri ток в запросеURI, $uriЗначения могут измениться во время обработки запроса, например, при выполнении внутренних перенаправлений или использовании индексных файлов.

Подробнее см. глобальные переменныеAlphabetical index of variables

Исправлятьhttp serverконфигурация в

nginx-config

запускатьNginx

nginx
ps -ef | grep nginx

перезагрузить измененныйNginxконфигурационный файл

nginx -s reload

Спасибо за ваши вопросы (подробности смотрите в разделе комментариев),reloadа такжеresatrtэто два разных понятия.

  1. reloadПерезагрузитьconfфайл, без перерываNginxСлужить,confЕсли есть проблема с файлом, загрузите последнийconf.
  2. restartСудя по конфигурационному файлу, всеNginxобслуживание, что приводит к прерыванию работы сервера на определенный период времени, конечно, из-заconfОтчет об ошибке файла.

закрытиеNginx

nginx -s stop

Поскольку я уже начал его, я перезапущу егоNginxТолько что

nginx-reload

LinuxУстановитьNginx

LinuxУстановить

ОбщийLinuxЗаказ

использоватьpstreeПросмотр процессов, запущенных текущим сервером

pstree

pstree

найтиNginxпозиция

ps -aux | grep nginx

server-where-nginx

ВойтиnginxКаталог

212-server-nginx

nginx-conf

затем настройтеnginx.confфайл

http {	
	upstream add-news {
        server 127.0.0.1:9527;
    }

    server {
        listen       8080;
        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;
        root   /Users/rainy/Desktop/MyWork/Work/website/dist;
        index index.html index.htm;

        location / {
            # root   html;
            try_files $uri $uri/ @router;
            index  index.html index.htm;
        }

        location @router {
            rewrite ^.*$ /index.html last;
        }

        location ~ /api/ {
            proxy_pass http://127.0.0.1:9527;
        }
				# 我的图片存放在本地服务器上的路径👇
        location /news-images/ {
            expires 24h;
            root /Users/rainy/Desktop/MyWork/Work/website/server/;
            autoindex on;
        }
        # 通过转发某服务器上的图片 -> https://localhost:9527/*/*.png
        location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$ {
            expires 24h;
            proxy_pass https://localhost:9527;
            access_log /root/nginx/logs/images.log;
            proxy_store on;
            proxy_store_access user:rw group:rw all:rw;
            proxy_redirect          off;
            proxy_set_header        Host 127.0.0.1;
            proxy_set_header        X-Real-IP $remote_addr;
            proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
            client_max_body_size    10m;
            client_body_buffer_size 1280k;
            proxy_connect_timeout   900;
            proxy_send_timeout      900;
            proxy_read_timeout      900;
            proxy_buffer_size       40k;
            proxy_buffers           40 320k;
            proxy_busy_buffers_size 640k;
            proxy_temp_file_write_size 640k;
        }
	}
}

DockerУстановитьNginx

  1. найтиDocker HubВверхnginxзеркало

    docker search nginx
    

    docker-search

  2. Потяните официальное зеркало

    docker pull nginx
    
  3. Посмотреть текущее зеркало

    docker images nginx
    

    docker-images

Server Tree
tree -C -L 3 -I '*node_modules*'

├── server
│   ├── app.js
│   ├── db
│   │   ├── db.js
│   │   └── newsSql.js
│   ├── package-lock.json
│   ├── package.json
│   └── routers
│       ├── news.js
│       └── router.js

file-tree

Node Server

npm init
npm install express mysql body-parser -S
  1. app.js

    const express = require('express')
    const bodyParser = require('body-parser')
    const app = express()
    const router = require('./routers/router')
    
    const PORT = 9527
    
    app.use(bodyParser.json())
    app.use(bodyParser.urlencoded({ extended: true }))
    
    app.use(router)
    
    app.listen(PORT, () => {
      console.log(`Listen port at ${PORT}`)
    })
    
    
  2. db.js -> Mysqlнастроить

    module.exports = {
      mysql: {
        host: 'localhost',
        user: 'root',
        password: 'xxxx',
        database: 'test',
        port: '3306'
      }
    }
    
  3. router.js

    const express = require('express')
    const router = express.Router()
    const news = require('./news')
    
    router.get('/api/news/queryAll', (req, res, next) => {
      news.queryAll(req, res, next)
    })
    
    router.get('/api/news/query', (req, res, next) => {
      news.queryById(req, res, next)
    })
    
    router.post('/api/news/add', (req, res, next) => {
      news.add(req, res, next)
    })
    
    router.post('/api/news/update', (req, res, next) => {
      news.update(req, res, next)
    })
    
    router.delete('/api/news/deleteNews', (req, res, next) => {
      news.deleteNews(req, res, next)
    })
    
    module.exports = router
    
  4. newSql.js

    module.exports = {
      createNews: `CREATE TABLE news (
        id int(255) NOT NULL AUTO_INCREMENT,
        type varchar(255) CHARACTER SET utf8 NOT NULL,
        title varchar(255) CHARACTER SET utf8 NOT NULL,
        description varchar(255) CHARACTER SET utf8 NOT NULL,
        occur_time varchar(255) CHARACTER SET utf8 NOT NULL,
        url varchar(255) NOT NULL,
        newsImg varchar(255) NOT NULL,
        PRIMARY KEY (id)
      )`,
      queryAll: 'SELECT * FROM news',
      queryById: 'SELECT * FROM news WHERE id = ?',
      add: 'INSERT INTO news (type, title, description, occur_time, url, newsImg) VALUES (?, ?, ?, ?, ?, ?)',
      update: 'UPDATE news SET type = ?, title = ?, description = ?, occur_time = ?, url = ?, newsImg = ? WHERE id = ?',
      delete: 'DELETE FROM news WHERE id = ?'
    }
    
  5. news.js

    const mysql = require('mysql')
    const db = require('../db/db')
    const $newsSql = require('../db/newsSql')
    
    let pool = mysql.createPool(db.mysql)
    
    let queryAll = (req, res, next) => {
      pool.getConnection((error, connect) => {
        if (error) {
          throw error
        } else {
          connect.query($newsSql.queryAll, (error, data) => {
            if (error) {
              throw error
            }
            res.json({
              code: '200',
              msg: 'success',
              data
            })
            connect.release()
          })
        }
      })
    }
    
    let queryById = (req, res, next) => {
      let id = +req.query.id
      pool.getConnection((error, connect) => {
        if (error) {
          throw error
        } else {
          connect.query($newsSql.queryById, id, (error, data) => {
            if (error) {
              throw error
            }
            res.json({
              code: '200',
              msg: 'success',
              data
            })
            connect.release()
          })
        }
      })
    }
    
    let add = (req, res, next) => {
      let rb = req.body
      let params = [rb.type, rb.title, rb.description, rb.occur_time, rb.url, rb.newsImg]
      pool.getConnection((error, connect) => {
        if (error) {
          throw error
        } else {
          connect.query($newsSql.add, params, (error, data) => {
            if (error) {
              throw error
            }
            res.json({
              code: '200',
              msg: 'success'
            })
            connect.release()
          })
        }
      })
    }
    
    let update = (req, res, next) => {
      let rb = req.body
      let params = [rb.type, rb.title, rb.description, rb.occur_time, rb.url, rb.newsImg, rb.id]
      pool.getConnection((error, connect) => {
        if (error) {
          throw error
        } else {
          connect.query($newsSql.update, [...params], (error, data) => {
            if (error) {
              throw error
            }
            res.json({
              code: '200',
              msg: 'success'
            })
            connect.release()
          })
        }
      })
    }
    
    let deleteNews = (req, res, next) => {
      let id = +req.query.id
      pool.getConnection((error, connect) => {
        if (error) {
          throw error
        } else {
          connect.query($newsSql.delete, id, (error, data) => {
            if (error) {
              throw error
            }
            res.json({
              code: '200',
              msg: 'success'
            })
            connect.release()
          })
        }
      })
    }
    let mkdirSync = dirname => {
     if (fs.existsSync(dirname)) {
         return true
     } else {
         if (mkdirSync(path.dirname(dirname))) {
             fs.mkdirSync(dirname)
              return true
         }
     }
     return false
     }
    
     let uploadImg = (req, res, next) => {
         const form = new formidable.IncomingForm()
         form.encoding = 'utf-8'
         form.keepExtensions = true
         form.parse(req, (err, fileds, files) => {
             if (err) {
                 console.log(err)
             }
             let imgPath = fs.readFileSync(files.file.path)
             let filename = path.resolve(__dirname, `../${NEWS_IMAGES_PATH}/${files.file.name}`)
             if (mkdirSync(NEWS_IMAGES_PATH)) {
                 fs.writeFile(filename, imgPath, (err) => {
                     if (err) {
                     console.log(err)
                     }
                     res.json({
                         code: '200',
                         msg: 'success',
                         files: files.file,
                     })
                 })
             })
         }
     }
    
    module.exports = {
      queryAll,
      queryById,
      add,
      update,
      deleteNews,
      uploadImg
    }
    

VueНастройте прокси и используйтеapi

  1. config/index.jsИсправлятьproxyTable

    module.exports = {
      dev: {
        proxyTable: {
          '/api': {
            target: 'http://127.0.0.1:9527',
            changeOrigin: true,
            pathRewrite: {
              '^/api': '/api'
            }
          }
        }
      }
    }
    
  2. использоватьaxiosинтерфейс вызова

    import axios from 'axios'
    export default {
      created () {
        this._getAllNews()
      },
      methods: {
        _getAllNews () {
          axios.get('/api/news/queryAll').then(res => {
                if (+res.data.code === SCC_CODE) {
                  this.news = res.data.data
                }
              })
          }
        }
    }
    

Vue buildПакет

npm run build

vue-build

потому что мойServerконецExpressпиши, начинайServerНужно использоватьNode, поэтому нам нужно установить на серверNode.

LinuxУстановитьNode 8.x

# Using Ubuntu
curl -sL https://deb.nodesource.com/setup_8.x | sudo -E bash -
sudo apt-get install -y nodejs

# Using Debian, as root
curl -sL https://deb.nodesource.com/setup_8.x | bash -
apt-get install -y nodejs

# Using Centos
curl -sL https://rpm.nodesource.com/setup_8.x | bash -
yum install -y nodejs

Установить каждую версиюNodeсмотрите подробности

запускатьNode

Здесь моя предыдущая команда выполняется неправильно, поэтому мне нужноkillэтот процесс

nohup node website/server/app.js &

node-nohup

nohup: Программу можно запустить, игнорируя сигнал приостановки, и выходные данные запущенной программы не будут отображаться на терминале.

так или иначеnohupВывод команды перенаправляется на терминал, и вывод будет добавлен к текущему каталогу.nohup.outв файле. Если текущий каталогnohup.outФайл не является пишенным, перенаправляющим вывод$HOME/nohup.outв файле. Если ни один файл не может быть создан или открыт для добавления, тоcommandКоманда, указанная параметром, не может быть вызвана. Если стандартная ошибка является терминальной, перенаправить весь вывод указанной команды в стандартную ошибку на тот же файловый дескриптор, что и стандартный вывод.

nohup-out

здесь, нашWeb,Node Server,NginxВсе настроено и запущено, осталось только войти в браузер你的服务器IP:8080Вот и все.

NginxМногие понятия см. в официальной лексике.

nginx-glossary