navigation

[Deep 01] Execution context [Deep 02] Prototype chain [Deep 03] Inheritance [Deep 04] Event loop [Deep 05] Curri Bias function [Deep 06] Function memory [Deep 07] Implicit conversions and operators [Deep 07] Browser caching mechanism (HTTP caching mechanism) [Deep 08] Front-end security [Deep 09] Deep copy [Deep 10] Debounce Throttle [Deep 10] Front-end routing [Deep 12] Front-end modularization [Deep 13] Observer mode Publish subscribe mode Bidirectional data binding [Deep 14] Canvas [Deep 15] webSocket Webpack HTTP and HTTPS CSS- Interview Handwriting Promise

[react] Hooks

[Deployment 01] Nginx [Deployment 02] Docker deployVue project [Deployment 03] gitlab-CI

[source code – Webpack01 – precompiler] AST abstract syntax tree [source code – Webpack02 – Precompiler] Tapable [source code – Webpack03] hand written webpack-compiler simple compilation process [source code] Redux React-Redux01

Front knowledge

Some words

Legacy: Legacy version Stable: Stable versionCopy the code

Forward proxy ———– Proxy client

A forward proxy is a server that sits between a client and a source server
Client request -> Proxy server -> source server
Hidden client: A proxy server accesses the target server instead of the client. You need to set the IP address and port number of the proxy server

The role of a positive agent

Over the wall: Bypasses inaccessible nodes and accesses the target server through another routing path;
- A cannot access B abroad. A accesses C through C abroad, and C forwards the access to B
Cache: Data is cached on the proxy server. If the requested content is in the cache, the client does not access the target host
Permission control: The firewall authorizes the access permission of the proxy server. The client can pass the firewall through the forward proxy
Hide client: After the forward proxy is configured, the target server cannot obtain information about the real client but can only obtain information about the proxy server

Reverse proxy ———– Proxy server

Hide server identity: also the intermediate server, hide server identity, for the client side will think that the echo proxy server is the target server to access

The role of the reverse proxy

Hide the Server: For security reasons, we don’t want to expose the Server directly, but instead put it on the Intranet. In this case, the Client cannot be deployed on the Extranet. Therefore, we can add an intermediate server, connected to the Internet, so that you can allow access to the Internet users, and can be used as a firewall to restrict external requests, improve the security of the internal server.
Load balancing: Distribute requests to the appropriate server based on the workload of the target server.

Nginx

Download and install

Nginx download address

Stable Version indicates the stable version
Lagacy Version is the historical version
Download completed, decompress, click nginx.exe to install successfully

Nginx command line

Start nginx Starts nginx-sSignal ------------------- calls the executable file to execute nginx-sStop: Close quickly, possibly without saving the information, and close the Web service nginx-sQuit: Disable the nginx web service, save the related information, and disable the nginx web service-sReload: reloads a configuration file, such as nginx-sReopen: reopen the log file nginx -c filename: specify a configuration file for nginx instead of the provincial nginx -t: Do not run, but only test the configuration file, check the correctness of the syntax of the configuration file and attempt to open the file referenced in the configuration file nginx -v: Nginx -v: displays the nginx version, compiler version, and configuration parametersCopy the code

(1) taskkill /fi "imagename eq nginx.EXE"/ f -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- can be under the Windows shut all nginx process (2). \ nginx ext-sStop -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- - under the Windows using the command need to add. \Copy the code

Nginx. Config file

Main: Global configuration of ngnix, which takes effect globally
- Events: Configuration affects the nginx server or network connection to the user
- http: Can nest multiple servers, configure proxy, cache, log definition and other most functions and third-party module configuration.
  - upstream: Configures the IP address of the back-end server, which is an integral part of load balancing configuration.
  - server: Configures parameters related to virtual hosts. One HTTP server can have multiple servers.
    - listen: the port number
    - server_name: the host name
    - location: Configures the routing of requests and the processing of various pages.
      - root
      - index
      - proxy_pass


#user nobody;
#user name name; -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- to define Nginx users and user groups

worker_processes  1;
#worker_process: 1; -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- nginx process, usually set equals the number of cpus


#error_log logs/error.log;
#error_log logs/error.log notice;
#error_log logs/error.log info;
# -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- the global error log defined types, [the debug | info | notice | warn | error | crit]

#pid logs/nginx.pid;
#-------------------------------------- Process PID file

events {
    worker_connections  1024;
    # Maximum number of connections per process (Maximum number of connections = Number of connections * Number of processes)
    # Maximum number of connections per process (maximum number = worker_connections * worker_processes)
    Adjust to the hardware, work with the previous worker process, as large as possible, but do not run 100% cup.
    
    keepalive_timeout 60;
    #connection: keepalive ------------ timeout; Establishing persistent connections was introduced in HTTP1.1
}

Configure the HTTP server to provide load balancing support using its reverse proxy function
http {
    # File extension and file type mapping table
    include       mime.types;
    
    Default file type
    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 koi8-r;

        #access_log logs/host.access.log main;

        location / {
            root   html;
            index  index.html index.htm;
        }

        #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;
    #}
    #}

}

Copy the code

Nginx configures static resources

Simply configure it in (HTTP -> Servers -> location -> root)
(root) can be set to (absolute path or relative path)
(relative path) Use (./) instead of (.. /)

http {
    server {
        #listen 8080; According to the port
        listen       8080;
        
        #server_name localhost; Host name
        server_name  localhost;

        location / {
            root  ./static;
            # root D: / nginx/nginx - 1.14.2 / static;
            # Note: The relative path hierarchy is (./), not (.. /)}}} through the above configuration: visit: http://localhost:8080/image/a.png to access to the static/image/Amy polumbo ngCopy the code

The reverse proxy

HTTP -> server -> location -> proxy_pass
proxy_pass

    server {
        listen 8080;
        server_name  localhost;

        location / {
            # root D: / nginx/nginx - 1.14.2 / static;
            
            # proxy_pass will reverse proxy http://localhost:8080 to http://localhost:3000proxy_pass http://localhost:3000; }}Copy the code

Dynamic and static separation

In nginx (HTTP -> server -> location)
~In nginx, it means a regular match, followed by a regular expression

http { server { listen 8080; server_name localhost; location / { proxy_pass http://localhost:3000; } } server { listen 9090; server_name localhost; location ~ \.(jpg|png|jpeg|gif)$ { root ./static/image; }}} Description: (1) the separation of dynamic resources and static resources, nginx server is mainly used to assign static resources (2) dynamic resources - reverse proxy - when accessing localhost:8080 will be reverse proxy http://localhost:3000; (3) static resource - when accessing localhost:9090/a.png, it is mapped to static/image/a.png. (4) Static /image/a.pngCopy the code

Load balancing

Load balancing: Distribute requests to the appropriate server based on the workload of the target server.
(HTTP -> upstream) (HTTP -> server -> location -> proxy_pass)

Several load balancing strategies

In polling (default), Nginx randomly allocates traffic to any server after a request comes in
(weight=number) sets the weight of the server. The default value is 1
Ip_hash maintains the session, ensuring that the same client always accesses the same server.

http: {
    # upstream for load balancing
    Backend is a name that must also be set in server -> loaction -> proxy_pass
    # weight=4 indicates the weight. The default value is 1. The larger the number, the more likely it is to be accessed
    Localhost = 127.0.0.1upstream backend { server localhost:7000; Server 127.0.0.1:8000 weight = 4; server localhost:9000; } server { listen 80; server_name localhost; location / {# Note: here http://backend; Don't forget to write the http:// in
            Backend is the name backend set in the upstreamproxy_pass http://backend; }}}Copy the code

data

Blog.csdn.net/wnvalentin/… Nginx. config file details juejin.cn/post/684490… Reference lufficc.com/blog/nginx-… Reference 2 juejin. Cn/post / 684490…

[Deployment 01] Nginx