Https is enabled in the local environment (mac)

Some time ago a client involved in the geolocation feature page suddenly go wrong is not working, discovery methods can only be successful positioning getCurrentPosition call at https protocol in the repair process, which leads to I can not debug locally, each modification must be completed uploaded to a production environment, imagine how painful this whole process Yes. So the next few days specially learned how to enable https locally, and a note of it for a rainy day:

1, install openssl

npm install openssl

 

2, the establishment of the server private key - private key is best established in the root directory of the service area (I use the local nginx)

openssl genrsa -des3 -out server.key 1024

In this process, you need to enter a passphrase to remember this password will be used later

 

3, generate a security certificate

openssl req -new -key server.key -out server.csr

This step will need to manually enter the following:

• Country Name (Country: China fill CN)
• State or Province Name (regions or provinces: Beijing)
• Locality Name (local name Area: Beijing)
• Organization Name (Name of Organization: Enter company name)
• Organizational Unit Name (OU Name: name of the department)
• Common Name (domain)
• Email Address (email address)
• A challenge password (a password)
• An optional company name (an optional company name)

At this point will generate server.csr file in the current directory, and then in turn execute the following command:

 

cp server.key server.key.org

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

openssl x509 -req -days 365 -in server.csr -signkey server.key -out server.crt

 

4, configure Nginx - find the domain name you want to configure Nginx in the .conf file content is written as follows

• listen 443 ssl; (SSL port number and open)
• server_name xxx.xxx.com; (domain name)
• ssl_certificate / ... /server.crt; (route certificate in this machine)
• ssl_certificate_key / ... /server.key; (key path in the machine)

　　……

5. Install Certificate  - server.crt double-click to install the certificate, after installation opens keychain, which contains a lot of certificates and applications secret, just installed certificate also inside, double-click to open the certificate -> click on the trust left the triangle button - options "when using this certificate"> set to "always trust"

 

Restart Nginx, open the local https sites with Safari have no problem, but open the local https sites with Chrome still prompt security issues, it does not matter that we can ignore the forced visit, after all, we only open https to facilitate the development of it.