1. The local environment URL is currently http://morefun.dev.xxx.cn/. I wanted to retrieve the Cookie data from the development environment URL https://.xxx.cn, but found it inaccessible. This is due to the difference between HTTP and HTTPS.
2. Configure the URL in the local environment as: https://morefun.dev.xxx.cn/.
3. Reference URL: https://web.dev/how-to-use-local-https/. How to use HTTPS for local development. Sometimes, you need to run your local development site using HTTPS. Tools and tips for doing this securely and quickly. See Figure 1.
4. You only need to use HTTPS locally under special circumstances, such as custom hostnames or cross-browser secure cookies. The current situation involves cross-browser secure cookies. If your production site uses HTTPS, you want your local development site to behave like an HTTPS site.
5. Use mkcert to run your site locally with HTTPS (recommended). If you open a locally running site in your browser using HTTPS, your browser will check the local development server’s certificate. After seeing that the certificate is signed by the certificate authority generated by mkcert, the browser checks whether it is registered as a trusted certificate authority. mkcert is listed as a trusted authority, so your browser trusts the certificate and establishes an HTTPS connection.
6. mkcert is a simple tool for making locally trusted development certificates. It requires no configuration. Reference URL: https://github.com/FiloSottile/mkcert. On Windows, use the pre-built binary. Download mkcert-v1.4.3-windows-amd64.exe to the directory: E:/wwwroot. See Figure 2.
7. Run PowerShell as an administrator, navigate to the directory E:/wwwroot, and add mkcert to the local root CAs. In your terminal, run the following command: , click Yes, and the local CA is now installed in the system trust store! ⚡Note: Firefox support is not available on your platform. See Figure 3.
PS E:\wwwroot> ./mkcert-v1.4.3-windows-amd64.exe install
Note: the local CA is not installed in the system trust store.
Run "mkcert -install" for certificates to be trusted automatically ⚠️
Created a new certificate valid for the following names 📜
- "install"
The certificate is at "./install.pem" and the key at "./install-key.pem" ✅
It will expire on 2 December 2023 �
PS E:\wwwroot> ./mkcert-v1.4.3-windows-amd64.exe -install
The local CA is now installed in the system trust store! ⚡️
Note: Firefox support is not available on your platform. ℹ️
PS E:\wwwroot>�
8. Generate a certificate signed by mkcert for your site. Navigate to the root directory of the site (https://localhost). See Figure 4.
PS E:\wwwroot> ./mkcert-v1.4.3-windows-amd64.exe localhost
Created a new certificate valid for the following names 📜
- "localhost"
The certificate is at "./localhost.pem" and the key at "./localhost-key.pem" ✅
It will expire on 2 December 2023 🗓
PS E:\wwwroot>
9. Add certificate support in the local environment’s Nginx configuration file. Move the files to: C:/nginx-1.10.1/conf/localhost.pem and C:/nginx-1.10.1/conf/localhost-key.pem. Edit C:/nginx-1.10.1/conf/nginx.conf. Add the 3 lines starting with ssl. Change the listening port to 443. See Figure 5.
server {
listen 443;
server_name localhost;
client_max_body_size 200m;
client_body_buffer_size 1024k;
fastcgi_read_timeout 180s;
#charset koi8-r;
#access_log logs/host.access.log main;
ssl on;
ssl_certificate localhost.pem;
ssl_certificate_key localhost-key.pem;
location / {
root E:/wwwroot;
index index.html index.htm index.php;
}
#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$ {
fastcgi_split_path_info ^(.+\.php)(/.+)$;
root E:/wwwroot;
fastcgi_pass 127.0.0.1:9000;
fastcgi_index index.php;
fastcgi_param SCRIPT_FILENAME $document_root$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;
#}
}
10. Open the URL https://localhost/phpinfo.php in the Chrome browser. The access is successful and meets expectations. See Figure 6.
11. Run PowerShell as an administrator, navigate to the directory E:/wwwroot, and generate a certificate signed by mkcert for your site (https://morefun.dev.xxx.cn).
PS E:\wwwroot> ./mkcert-v1.4.3-windows-amd64.exe morefun.dev.xxx.cn
Created a new certificate valid for the following names 📜
- "morefun.dev.xxx.cn"
The certificate is at "./morefun.dev.xxx.cn.pem" and the key at "./morefun.dev.xxx.cn-key.pem" ✅
It will expire on 2 December 2023 🗓
12. Following the steps above, copy the certificate files and edit the Nginx file. Open the URL https://morefun.dev.xxx.cn/. In the Cookies, you can now retrieve the Cookie data from the development environment URL https://.xxx.cn. See Figure 7.
