How to configure SSL certificate in nginx to implement https service

How to configure SSL certificate in nginx to implement https service

In the previous article, after using openssl to generate a free certificate, we now use this certificate to implement the https service requirements of our local node service. If my node basic structure is as follows:

|----Project| |--- static #Store html files| | |--- index.html # index.html
| |--- node_modules # Dependency package| |--- app.js # Node entry file| |--- package.json 
| |--- .babelrc # Transform es6 files

The index.html file code is as follows:

<!DOCTYPE html>
<html>
<head>
 <meta charset=utf-8>
 <meta name="referrer" content="never">
 <title>nginx configuration https</title>
</head>
<body>
 <div>
  <h2>Welcome to use https to access the page</h2>
 </div>
</body>
</html>

The app.js code is as follows:

const Koa = require('koa');
const fs = require('fs');
const path = require('path');
const router = require('koa-router')();
const koaBody = require('koa-body');
const static = require('koa-static');

const app = new Koa();

router.get('/', (ctx, next) => {
 // Set the header type. If not set, the page will be downloaded directly ctx.type = 'html';
 // Read file const pathUrl = path.join(__dirname, '/static/index.html');
 ctx.body = fs.createReadStream(pathUrl);
 next();
});

app.use(static(path.join(__dirname)));

app.use(router.routes());
app.use(router.allowedMethods());

app.listen(3001, () => {
 console.log('server is listening in 3001');
});

The package.json code is as follows;

{
 "name": "uploadandload",
 "version": "1.0.0",
 "description": "",
 "main": "app.js",
 "scripts": {
  "dev": "nodemon ./app.js"
 },
 "author": "",
 "license": "ISC",
 "dependencies": {
  "fs": "0.0.1-security",
  "koa": "^2.7.0",
  "koa-body": "^4.1.0",
  "koa-router": "^7.4.0",
  "koa-send": "^5.0.0",
  "koa-static": "^5.0.0",
  "nodemon": "^1.19.0",
  "path": "^0.12.7"
 }
}

Then I executed npm run dev in the root directory of the project, and then I could access http://localhost:3001 in the browser. However, if I want to access it using a domain name, we can bind the domain name in the hosts file, such as xxx.abc.com. The hosts file is bound as follows:

127.0.0.1 xxx.abc.com

So at this time we can access the page using http://xxx.abc.com:3001/, as shown below:

As shown above, we can access the page, but have we found that the http request displayed in the chrome browser is not safe, so at this time I want to use https to access it, the security of the web page is guaranteed, but at this time if I do nothing and directly use https to access it, it will not work, such as the address: https://xxx.abc.com:3001. As shown in the figure below:

We know that if we use https to access, a security certificate is generally required. Therefore, our current task is to use nginx to configure things like security certificates, and then use https to access the web page to achieve our goal.

nginx configure https service

1. First enter the nginx directory and use the command: cd /usr/local/etc/nginx. Then create a cert folder in this directory to store the certificate file.
Use the command: mkdir cert as shown below:

2. Then we need to copy the certificate-related files, such as server.crt and server.key files, to the cert directory. For example, the following certificate file:

As for how the above certificates are saved, please refer to my previous article Using OpenSSL to Save Free Certificates

Move command: mv server.key /usr/local/etc/nginx/cert, for example, move both server.key and server.crt files to the /usr/local/etc/nginx/cert directory. As shown in the following figure:

Then we check the /usr/local/etc/nginx/cert directory and find the following files:

3. nginx configuration

The nginx configuration needs to add the following code:

server {
 listen 443 ssl;
 server_name xxx.abc.com;
 ssl on; //This configuration item needs to remove ssl_certificate cert/server.crt;
 ssl_certificate_key cert/server.key;
 /*
  Set the type and size of the SSL/TLS session cache. If this parameter is set, it is usually shared, and the buildin may parameter memory fragmentation. The default is none, which is similar to off and disables the cache. For example, shared:SSL:10m means that all my nginx worker processes share the SSL session cache. The official website says that 1M can store about 4,000 sessions.
 */
 ssl_session_cache shared:SSL:1m;
 // The client can reuse the expiration time of the ssl parameters in the session cache. The default expiration time of 5 minutes in the intranet system is too short. It can be set to 30 minutes or even 4 hours.
 ssl_session_timeout 5m;

 /*
  Select the cipher suite. Different browsers may support different suites (and in different orders).
  The format specified here is the one that the OpenSSL library can recognize. You can view the supported algorithms by using openssl -v cipher 'RC4:HIGH:!aNULL:!MD5' (followed by the suite encryption algorithm you specified).
 */
 ssl_ciphers HIGH:!aNULL:!MD5;

 // When setting the negotiated encryption algorithm, give priority to the encryption suite of our server instead of the encryption suite of the client browser.
 ssl_prefer_server_ciphers on;

 location / {
  proxy_pass http://localhost:3001;
 }
}

Note: As mentioned above, the ssl on; configuration item needs to be removed. If it is configured as above, I will report an error when I restart the nginx command, as shown below:

SSL: error:06065064:digital envelope routines:EVP_DecryptFinal_ex:bad decrypt error:0906A065:PEM routines:PEM_do_header:bad decrypt Similar to this error, then search for this error on Baidu and solve it by the following method:

Go to the directory: cd /usr/local/etc/nginx/cert and execute the following two lines of code:

cp server.key server.key.org
openssl rsa -in server.key.org -out server.key

As shown below:

You can look at the page that comes out of Baidu search

Then when I continued to restart nginx, I found that it still reported an error. The error information was as follows:

nginx: [warn] the "ssl" directive is deprecated, use the "listen ... ssl" directive instead

Then continue to remove the ssl on; configuration item, which may be related to the version of nginx

I recently upgraded to nginx 1.15. After reloading, all sites with ssl reported this warning. I checked a lot of information and finally found a related English description on github: (https://github.com/voxpupuli/puppet-nginx/issues/1224). My English is not good, but the general meaning should be that for nginx 1.15 and later versions, there is no need to write ssl on; anymore.

I went to nginx.conf and deleted ssl on; then reloaded. Sure enough, there was no alarm. There is no problem using it now.

I did understand it wrong. I should change ssl on to listen 443 ssl.

Now I continue to restart nginx and it will be ok, as shown below:

However, after the above configuration, we cannot directly use the domain name https://xxx.abc.com/ to access it. We also need to install the client.crt certificate we generated previously in the browser. The steps for Mac system are as follows:

1. Click the launcher as shown below. As shown below:

2. Search for Keychain Access and click on it, as shown below

3. Go to the certificate page and drag our previous client.crt certificate into the certificate. For example, the client.crt certificate I generated before is as follows:

4. Right-click on my certificate, then click "Show Profile" to enter the certificate details page. As shown in the following figure:

5. After entering the page, when using the certificate, select Always Trust, as shown below:

6. Then exit. You may need to enter the computer power-on password. Once entered, it will be saved automatically. Then we can access it by visiting the https://xxx.abc.com/ page in the browser. As shown below:

Then we click Continue to visit and we can see the page, as shown below:

As shown above, nginx + certificate is used to implement local node https service.

However, although https can be accessed as above, the text "unsafe" is still displayed in front of https; as shown in the following figure:

The possible reason is that the certificate is a self-generated certificate, not a third-party certificate. I don’t know the specific reason at the moment, but at least now we can use https to access our project.

Source code for starting a simple node service on github

The above is the full content of this article. I hope it will be helpful for everyone’s study. I also hope that everyone will support 123WORDPRESS.COM.

You may also be interested in:
  • How to configure SSL certificate under Nginx
  • Detailed explanation of SSL security configuration in Nginx server
  • Detailed explanation of nginx using ssl module configuration to support HTTPS access
  • How to enable SSL in Nginx server
  • Nginx configures SSL certificate to listen on port 443
  • How to configure SSL two-way verification in nginx
  • Detailed explanation of Nginx configuration SSL certificate to achieve Https access
  • Nginx server SSL certificate configuration and reverse proxy configuration for SSL
  • Example of configuring multiple SSL certificates for a single Nginx IP address
  • Nginx local configuration SSL access example tutorial

<<:  How to write memory-efficient applications with Node.js

>>:  Overview of MySQL Statistics

Recommend

Solve the installation problem of mysql8.0.19 winx64 version

MySQL is an open source, small relational databas...

MySQL uses the Partition function to implement horizontal partitioning strategy

Table of contents 1 Review 2 Five strategies for ...

Idea deployment tomcat service implementation process diagram

First configure the project artifacts Configuring...

How to use jsx syntax correctly in vue

Table of contents Preface Virtual DOM What is Vir...

Example of implementing the Graphql interface in Vue

Note: This article is about the basic knowledge p...

Install centos7 virtual machine on win10

1. Download VMware Workstation 64 version https:/...

About IE8 compatibility: Explanation of the X-UA-Compatible attribute

Problem description: Copy code The code is as fol...

In-depth analysis of MySQL indexes

Preface We know that index selection is the work ...

Nginx proxy forwarding implementation code uploaded by Alibaba Cloud OSS

Preface Because the mini program upload requires ...

How to introduce Excel table plug-in into Vue

This article shares the specific code of Vue intr...

Vue uses vue-quill-editor rich text editor and uploads pictures to the server

Table of contents 1. Preparation 2. Define the gl...

Various ways to modify the background image color using CSS3

CSS3 can change the color of pictures. From now o...