Nginx common configuration

Be skin once, rely on these to just run the rice that maintain, be beaten you also can’t follow the net line to look for me!!

As a programmer, Nginx has some basic requirements. Whether it is project deployment or performance optimization, Nginx can always help you when you need it. In this article, we will take a look at the basic configuration.

The installation

Nginx installation and startup configuration files and other basic content see my article

Basic configuration (Front-end project deployment: single-page application)

server { listen 80; server_name notes.jindll.com; # here is your domain location / {root /notes; /notes indicates the notes folder in the root directory index index. HTML. Try_files $uri $uri/ /index.html; try_files $uri $uri/ /index.html; # single file application must have this configuration}}Copy the code

Detailed instructions

• Listen: the browser accesses the port through the domain name. The port to listen is 80. HTTPS is port 443
• Server_name: a server alias that is requested by the browser through the domain name. The server receives the domain name and matches it with server_name. If the server does not match the domain name, it goes down.
• Location:Matches the path after the domain name,/Indicates a matching root path
• Root:Root path configuration, such as user accesshttp://notes.jindll.com/assets/css, the server will arrive/notes/assets/cssThis location finds resources to return
• Index:The default initial page for a site, such as user accesshttp://notes.jindll.comIf there is no path, it is returned by default/notes/index.htmlresources
• Try_files:When the user accesseshttp://notes.jindll.com/abcWhen, here$uriis/abc.try_filesWill go to the server (/notes/abc(Look for the file. If so, send the contents of the file directly to the user. If it doesn’t exist then look$uri/, added one/That is, to see if there is a name/notes/abc/The directory. If it doesn’t already exist, go to the next option/notes/index.htmlreturn

Different paths point to different items with the same domain name

server {
  listen 80;
  server_name notes.jindll.com; # Here is your domain name
  location / {
    root	/notes; Where is your project path or the resource to return to the client? "/notes" indicates the notes folder in the root directory
    index	index.html; # the default initial page of the site, the user directly visits the domain name without path to return that page, and the user visits http://notes.jindll.com to return that file to the user
    try_files $uri $uri/ /index.html; Single-file applications must have this configuration} location /dev { root /docs; index index.html; }}Copy the code

Detailed instructions

Compared with the above code we added a location block, namely that when server receives when they visit http://notes.jindll.com/dev/dev, then search for resources in the/docs/dev to return

HTTPS configuration

server {
  listen 443 ssl;
  server_name notes.jindll.com; # Here is your domain name
  
  # Name of the certificate file
  ssl_certificate /ssl/notes/3048277_notes.jindll.com.pem; 
  # Private key file name
  ssl_certificate_key /ssl/notes/3048277_notes.jindll.com.key;
  ssl_session_timeout 5m;
  Please configure according to the following protocolSsl_protocols TLSv1 TLSv1.1 TLSv1.2;Configure the encryption suite as follows, written in accordance with the OpenSSL standard.ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:! aNULL:! MD5:! RC4:! DHE; ssl_prefer_server_ciphers on; location / { root /notes;Where is your project path or the resource to return to the client? "/notes" indicates the notes folder in the root directory
    index	index.html; # the default initial page of the site, the user directly visits the domain name without path to return that page, and the user visits http://notes.jindll.com to return that file to the user
    try_files $uri $uri/ /index.html; Single-file applications must have this configuration} location /dev { root /docs; index index.html; }}Copy the code

Detailed instructions

In fact, HTTPS configuration is the simplest, whether you apply for HTTPS certificate in Tencent cloud or Ali Cloud, they have detailed HTTPS configuration instructions.

In addition, the listening port is changed from 80 to 443, because the HTTPS access port is 443. What we need to change is the location of the certificate file and private contract file. After you successfully apply for the certificate, you can download the relevant files.

The socket configuration

server {
  listen 443 ssl;
  server_name notes.jindll.com; # Here is your domain name
  
  # Name of the certificate file
  ssl_certificate /ssl/notes/3048277_notes.jindll.com.pem; 
  # Private key file name
  ssl_certificate_key /ssl/notes/3048277_notes.jindll.com.key;
  ssl_session_timeout 5m;
  Please configure according to the following protocolSsl_protocols TLSv1 TLSv1.1 TLSv1.2;Configure the encryption suite as follows, written in accordance with the OpenSSL standard.ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:! aNULL:! MD5:! RC4:! DHE; ssl_prefer_server_ciphers on; location / { proxy_pass_header Server; proxy_set_header X-Real-IP$remote_addr;
    proxy_set_header Host $host;
    proxy_set_header X_Forward_For $proxy_add_x_forwarded_for;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection 'upgrade';
		
    proxy_pass http://127.0.0.1:3939; Configure forwarding; Forward https://notes.jindll.com to local http://127.0.0.1:3939}}Copy the code

Detailed instructions

All websocket configuration is in the location block (except proxy_pass). If you need to configure websocket, you can just copy the code above. Proxy_set_header Upgrade $http_upgrade; And proxy_set_header Connection ‘upgrade’; These two lines upgrade the HTTP protocol to webSocket.

Negotiate the cache

server {
  listen 80;
  server_name notes.jindll.com; # Here is your domain name
  location / {
    root	/notes; Where is your project path or the resource to return to the client? "/notes" indicates the notes folder in the root directory
    index	index.html; # the default initial page of the site, the user directly visits the domain name without path to return that page, and the user visits http://notes.jindll.com to return that file to the user
    try_files $uri $uri/ /index.html; Single-file applications must have this configuration} location /dev { root /docs; index index.html; add_header Cache-Control no-cache; }}Copy the code

Detailed instructions

Negotiated caching is a front-end performance optimization thing, and when the user enters an address in the browser, the server needs to return the corresponding file to the browser, which takes time.

If the user enters an address in the browser for the first time, the server returns the file to the browser, and the browser caches the file. The next time the user enters the address, the browser directly retrieves the file from the cache, which is faster than the request server. This is a strong cache.

The downside of strong caching is that the server files are updated, but the browser doesn’t update them in time. Instead, the browser continues to read the local cache. You can set the cache time, but it’s not very timely.

Negotiation cache means that after the address is entered, the browser sends the MD5 and update time of the last cached file to the server. The server checks whether the file is updated. If the file is updated, the server looks for the file and returns the 302 status code to the browser.

If you are following my nginx installation tutorial, you just need to add add_header cache-control no-cache to the location block. You can.

In addition, negotiation cache or strong cache is actually more for static resource files, such as images, audio, fonts, etc., these resources do not change often, so the use of cache, let the browser directly read the local cache will have a very significant performance improvement.

Enable GZIP compression

server {
  listen 80;
  server_name notes.jindll.com; # Here is your domain name
  location / {
    root	/notes; Where is your project path or the resource to return to the client? "/notes" indicates the notes folder in the root directory
    index	index.html; # the default initial page of the site, the user directly visits the domain name without path to return that page, and the user visits http://notes.jindll.com to return that file to the user
    try_files $uri $uri/ /index.html; Single-file applications must have this configuration
  }
  location /dev  {
    root	/docs;
    index	index.html;
    add_header Cache-Control no-cache;
    
    The following code is used to enable GZip
    gzip  on;
    gzip_min_length 1k;
    gzip_buffers 4 16k;
    gzip_comp_level 4;
    gzip_types text/plain application/javascript application/x-javascript text/javascript text/xml text/css;
    gzip_disable "MSIE [1-6]\."; }}Copy the code

Detailed instructions

• gzip on; Enable GZip compression

• gzip_min_length 1k; Files smaller than 1K are not compressed

• gzip_buffers 4 16k; 4 16K indicates that the unit is 16 KB. The unit is four times the original data size. If not, the default is to request the same amount of memory as the original data to store the gzip compressed results.

• gzip_comp_level 4; Compression level 1-9; 1 the minimum compression ratio has the highest processing speed. 9 The maximum compression ratio has the lowest processing speed

• Gzip_types compresses those types; I’m only compressing JS CSS XML. If you don’t have an XML file, you can drop text/ XML. I didn’t write HTML for the compression type because it always gets compressed whether you specify “text/ HTML “or not; In addition, it is not recommended to compress resources such as images and music, because the compression effect is not obvious, and the compression of these types of files will consume a lot of resources on the server.

• gzip_disable “MSIE [1-6]\.”; Browsers below Internet Explorer 6 are not compressed, which is not supported by Internet Explorer 6 and can be garbled. (Now also use IE6 is immortal)

• More information about GZip can be found in this Chinese document at www.nginx.cn/doc/standar…

Comparison between the speed of GZip enabled and not enabled

Did not open

After the opening