网站添加免费SSL证书——HTTPS协议

news/2024/7/17 8:00:00

  在添加证书之前首先了解两个概念:SSLHTTPS
SSL(Secure Sockets Layer 安全套接层),及其继任者传输层安全(Transport Layer Security,TLS)是为网络通信提供安全及数据完整性的一种安全协议。TLS与SSL在传输层与应用层之间对网络连接进行加密。
HTTPS(全称:Hyper Text Transfer Protocol over SecureSocket Layer),是以安全为目标的 HTTP通道,在HTTP的基础上通过传输加密身份认证保证了传输过程的安全性。HTTPSHTTP的基础下加入SSL 层,HTTPS的安全基础是 SSL,因此加密的详细内容就需要 SSL
简单来说就是添加SSL可以增加网站安全性,使数据加密传输等级更高。一般的个人网站使用免费SSL证书就可以。如果是企业建议使用收费的,本文以华为云为例。
  添加SSL证书的步骤:购买证书并安装证书配置Nginx修改网站链接并测试

一、购买免费的SSL证书

1、到华为云控制台,依次点击域名注册SSL证书管理。点击购买证书

###   2、默认是收费的,根据提示点击`云市场`。
###   3、我选择的是`亚洲诚信免费的SSL证书`。
###   4、点击立即购买。
###   5、购买完成后登陆`SSL证书管理系统`,没有账号的话注册一个。
###   6、可以看到刚刚购买的证书已经显示在这里了。根据提示`完成订单`,填写需要添加证书的域名。
###   7、这里需要进行`域名验证`。 复制`记录值`。
###   8、来到刚刚添加的域名的`解析界面`。添加一个记录值。类型选择`TXT`,粘贴刚刚的`记录值`。这里一般`10分钟`即可完成,完成会收到`邮箱提示`。
# 二、配置Nginx 1、订单完成后,点击`下载证书`。输入密码,选择`Nginx类型`的。
###   2、压缩包解压后会有`两个`文件。可以用xftp软件上传到云服务器。可以在`/etc/nginx/`路径下新建文件夹存放。
###   3、在`Nginx`的配置文件(`.conf`)里面进行配置`403(https协议端口)端口`。配置之前确保`安全组`已经`开通`了`403`端口。将以下代码加入配置文件即可。注意:`现在不要强制跳转,也就是网站既可以http访问,也可以https访问。`具体配置代码如下:
#网站SSL证书
server {
        listen       443 ssl;
        server_name  www.cztcms.cn;     #修改为您证书绑定的域名。
	root         /blog/wordpress;   #站点路径
        index index.php index.html;        #首页名称
        ssl_certificate      cztcms/server.crt; #替换成您的证书文件的路径和名称。
	#这样写的话绝对路径是:/etc/nginx/cztcms/server.crt
        ssl_certificate_key  cztcms/server.key; #替换成您的私钥文件的路径和名称。
        ssl_session_cache    shared:SSL:1m;
        ssl_session_timeout  5m;
        ssl_ciphers  HIGH:!aNULL:!MD5; #加密套件。
        ssl_prefer_server_ciphers  on;
	ssl_protocols TLSv1 TLSv1.1 TLSv1.2 TLSv1.3;

#解决图标不显示
location ~* \.(eot|otf|ttf|woff)$ {
    add_header Access-Control-Allow-Origin *;
}
#PHP端口,如果不是PHP站点不用写
location ~ \.php(.*)$ {
        fastcgi_pass   127.0.0.1:9000;
        fastcgi_index  index.php;
        fastcgi_split_path_info  ^((?U).+\.php)(/?.+)$;
        fastcgi_param  SCRIPT_FILENAME  $document_root$fastcgi_script_name;
        fastcgi_param  PATH_INFO  $fastcgi_path_info;
        fastcgi_param  PATH_TRANSLATED  $document_root$fastcgi_path_info;
        include        fastcgi_params;
    }
}

4、现在就可以用https访问自己的网站了。不过WordPress的网站刚开始JSCSS是用的http。所以可以看到现在网站的排版都是乱的,是因为没有JS和CSS的加载。这个需要修改JS和CSS的路径
方法:在网站主题目录functions.php文件最后加入以下代码,刷新网站可以看到样式又回来了。

add_filter('script_loader_src', 'agnostic_script_loader_src', 20,2);
function agnostic_script_loader_src($src, $handle) {
    return preg_replace('/^(http|https):/', '', $src);
}

add_filter('style_loader_src', 'agnostic_style_loader_src', 20,2);
function agnostic_style_loader_src($src, $handle) {
    return preg_replace('/^(http|https):/', '', $src);
}

三、修改网站链接

1、现在网站虽然可以用https访问了,但是在浏览器最上方还是没有看到绿色的安全锁,甚至可能会出现不安全的提示。这个是因为你的网站还有很多链接是采用http访问的。比如图片地址还是http开头。这个就需要将网站的所有http请求改为httpsWordPress站点可以用以下的SQL语句来修改,远程登录连接MySQL,执行即可。不过这个不能修改文章里面的连接。其他还需手动修改。

UPDATE wp_posts SET post_content = replace(post_content, 'http://www.cztcms.cn/wp-content/uploads','https://www.cztcms.cn/wp-content/uploads');

2、如果不想自己手动修改。那可以使用插件。ssl-insecure-content-fixer(SSL修复工具)。我的博客刚开始手动修改,不过后来还是没出现安全锁。我的也是用这个插件修复的。下载压缩包以后,到插件那里上传即可。设置一下就可以了。蓝奏云地址:▶ ssl-insecure-content-fixer.2.7.2.zip

3、最后用https访问可以出现小绿锁以后,在Nginx的配置文件里面加入强制跳转,也就是在地址栏输入http会自动跳到https。配置文件加入以下代码即可,域名改为自己的。

server {
listen 80;
server_name www.cztcms.cn;
rewrite ^(.*) https://$server_name$1 permanent;
}

360浏览器效果图

# Chrome浏览器效果图
# 火狐浏览器效果图

http://www.niftyadmin.cn/n/3649408.html

相关文章

使用React Native Web构建适合移动设备的Web应用

介绍 (Introduction) Over the years, building web applications that are mobile friendly has become easier with the advent of media queries and the introduction of service workers. Using media queries, we could make web applications that different shapes whe…

sql server和Navicat使用遇到错误解决办法

sql server忘记密码和用户名:http://www.cnblogs.com/xushining/p/3752667.html navicat连接失败:http://blog.csdn.net/lsd123/article/details/5548827

afinal框架(FinalAcitivity,FinalBitmap,FinalDb,FinalHttp 四大模块)

github下载地址:https://github.com/yangfuhai/afinal Afinal是一个android的ioc,orm框架,内置了四大模块功能:FinalAcitivity,FinalBitmap,FinalDb,FinalHttp。通过finalActivity,我们可以通过注解的方式进行绑定ui和…

[WiX]我的第一个WiX安装脚本

我的第一个WiX安装脚本 WiX的Wiki:WiX 代表 Windows Installer Xml (WiX) toolset 它是建立Windows Installer的XML toolset (MSI) 包裹从XML 文件。它支持开发商集成他们的发布过程建立MSI 和MSM 设定包裹的命令行环境。内部结构Wix 由四份组成: 蜡烛、光、Lit 和…

WordPress添加侧栏小工具-博客统计(网站统计)

WordPress侧边栏“博客统计”小工具的制作方法。首先要下载cztcms.zip文件,解压得到一个PHP文件。蓝奏云地址:▶ cztcms.zip 1、将这个PHP文件放到主题目录下。打开主题目录下的function.php,在最后一个 ?> 前插入以下代码: i…

every 和some_如何使用.every()和.some()操纵JavaScript数组

every 和some介绍 (Introduction) ES5 and ES6 brought many changes to JavaScript, including better ways of working with a collection of data expressed as arrays. While the language has significantly improved support for declarative data manipulation on array…

PhotoView的使用

1. 功能介绍 特性(Features): 支持Pinch手势自由缩放。支持双击放大/还原。支持平滑滚动。在滑动父控件下能够运行良好。(例如:ViewPager)支持基于Matrix变化(放大/缩小/移动)的事件监听。 优势&#xff1…

PackageManagerService概述

PackageManagerService主要负责对系统的apk进行管理,不管是系统apk(/system/app),还是我们手工安装上去的,系统所有的apk都是由其管理的。 我们看一下PackageManager类图 从图可知,PackageManage负责提供对外的接口,Pa…