域名+服务器+Nginx+宝塔使用SSL证书配置HTTPS

前言

在我的前面文章里,有写过一篇文章

linux服务器+宝塔从头部署别人可访问的网站

在这篇文章,有教学怎么使用宝塔和买的服务器的公网IP,以及教怎么打包vue和springboot去部署不用域名的网站让别人访问

那么,这篇文章将在这个基础上来教大家怎么去搭建通过域名访问的网站

项目展示

在我的项目中,我已经成功的搭建出了https的网站

HTTPS聊天室网站

点开之后正常的访问到我们的项目

在这里插入图片描述
以及能够成功的调用后端
在这里插入图片描述
在这里插入图片描述

这个项目在很长时间内我都会挂载部署,我买的阿里云的域名和服务器,我可以通过电脑端正常的访问该链接,但是手机端不行,问了阿里的客服说是因为网站没有【备案】导致

准备工作

为了可以正常的搭建出可以访问域名的https协议的网站,我们在正式开始前需要做一些准备工作

服务器

要部署域名的当然需要服务器,可以根据自己需要进行购买即可

域名

首先你需要买一个域名,由于我的服务器和域名都是在阿里云买的,因此用阿里云进行演示

首先根据自己需要申请一个域名

在这里插入图片描述

购买完之后,需要实名认证,点击【信息模板】进行登记信息

在这里插入图片描述
在这里插入图片描述

按照自己实际信息填写提交即可

等待认证成功

在这里插入图片描述

将你的【信息模板】关联到你的域名即可

域名解析

在这里插入图片描述

选择你的域名,右边有一个解析按钮,点击之后默认会有一个_dnsauth的解析,这个不用动

在这里插入图片描述

然后我们新增一个泛解析

以我申请的域名springsso.top为例,泛解析的意思是你可以添加任意前缀解析到你的域名,如

chat.springsso.top
student.springsso.top
hotel.springsso.top

在这里插入图片描述

泛解析
记录类型: A
主机记录: *
记录值: 你服务器的公网IP
TTL:默认10

添加一个公网IP解析

在这里插入图片描述

记录类型: @
主机记录: *
记录值: 你服务器的公网IP
TTL:默认10

DNS拨测

同样是这个界面,有一个生效检测
点击可以跳转到DNS拨测中心验证你的域名解析有没有生效

在这里插入图片描述
在这里插入图片描述

当你能看到你的域名可以解析到你的公网IP值,即代表你的域名解析成功!悬停在解析结果IP可以查看解析的IP

SSL

初期我们可以申请免费的SSL证书,搜索数字证书管理服务

在这里插入图片描述
找到【SSL证书管理】下的【个人测试证书(原免费证书)】,点击创建证书

在这里插入图片描述

输入你的域名,然后点击确认,一般证书创建下发的话,慢的情况下只需要十多分钟
如果你隔了很久没有生效,请在右边解析一下(刚刚开始需要解析到自己的域名)

当生效之后,我们点击更多,找到【下载

在这里插入图片描述

我们需要获取到两个证书
Nginx: 用于Nginx部署使用
JKS: 用于后端springboot开启HTTPS使用

安全组和端口

安全组是有需要注意的事项的,我在这一步卡了很久,安全组需要和我们的服务器实例进行地域的关联,如我的实例是:

在这里插入图片描述

他的地域是华南2(河源)

但是在我没有创建任何安全组的情况下,不知道为什么自动给我创建了3个安全组

在这里插入图片描述

你只有配置开放了对应地域的安全组的出入站端口,才能生效

针对端口,我们需要开放这么几个端口
❤️你需要部署的后端的端口
❤️开放8080以部署tomcat
❤️开放80端口
❤️开放443端口
❤️如果你用的是宝塔进行部署,宝塔的【安全】的【系统防火墙】也需要开放对应端口

宝塔

怎么按照宝塔不需要多言,可以参考我最上面的文章链接,也可以百度

nginx

登录到宝塔之后,点击【软件商店】,检索nginx进行下载

在这里插入图片描述

tomcat

同样在【软件商店】下载tomcat

在这里插入图片描述

SpringBoot项目配置

打包方式我们同样可以参考我的上篇文章,或者参考百度即可

然后我们需要拿到下载的JKS的证书,放到你项目的resources文件夹下

在这里插入图片描述

然后在application.yml新增配置如下:

server:port: 8082 #端口servlet:context-path: /chatEnd # 项目主路由ssl: #ssl配置enabled: true  # true为开启https#key-alias: alias-key # 别名(可以不进行配置)# 保存SSL证书的秘钥库的路径key-store: classpath:www.springsso.top.jks # ssl证书位置,如果放在resources文件夹下就是这样配置key-password: 私钥密码#key-store-password: 证书密码key-store-type: JKS    # 证书类型,选择JKS

上述配置中
key-password是私钥密码
key-store-password 是证书密码。
如果这两个密码相同的只配置一个即可,因为tomcat默认先用keyStore的pass去解私钥。
(PS:如果你使用阿里云上的免费SSL证书,下载jks格式的证书的时候,只有一个密码,是证书的密码)

我的项目中证书配置如下(密码看到无所谓,每次证书下载密码会随机):

在这里插入图片描述

然后打包成jar包,上传到服务器,任意位置,记住路径即可
找到【网站】的【java项目】,【添加Java项目】

在这里插入图片描述
在这里插入图片描述

jar路径即你打包之后的项目文件路径,项目JDK根据自己实际项目进行调整,其他默认即可

这个时候你的项目运行是https的,只能用https进行调用接口

vue前端配置

vue项目,需要映射到我们的域名,也就是我们所有涉及到ip的,全部要替换为域名
如我的axios的封装js

import axios from 'axios'axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'const service = axios.create({baseURL: 'https://springsso.top/chatEnd',timeout: 30000
})service.interceptors.request.use(config => {return config
},
error => {return Promise.reject(error)
}
)service.interceptors.response.use(res => {return res}
);
export default service

config下的index.js

'use strict'
// Template version: 1.3.1
// see http://vuejs-templates.github.io/webpack for documentation.const path = require('path')module.exports = {dev: {// PathsassetsSubDirectory: 'static',assetsPublicPath: '/',proxyTable: {'/': {target: "https://springsso.top/chatEnd",changeOrigin: true,secure: false,pathRewrite: {'^/': ''}}},// Various Dev Server settingshost: 'localhost', // can be overwritten by process.env.HOSTport: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determinedautoOpenBrowser: false,errorOverlay: true,notifyOnErrors: true,poll: false, // https://webpack.js.org/configuration/dev-server/#devserver-watchoptions-/*** Source Maps*/// https://webpack.js.org/configuration/devtool/#developmentdevtool: 'cheap-module-eval-source-map',// If you have problems debugging vue-files in devtools,// set this to false - it *may* help// https://vue-loader.vuejs.org/en/options.html#cachebustingcacheBusting: true,cssSourceMap: true},build: {// Template for index.htmlindex: path.resolve(__dirname, '../dist/index.html'),// PathsassetsRoot: path.resolve(__dirname, '../dist'),assetsSubDirectory: 'static',assetsPublicPath: './',/*** Source Maps*/productionSourceMap: true,// https://webpack.js.org/configuration/devtool/#productiondevtool: '#source-map',// Gzip off by default as many popular static hosts such as// Surge or Netlify already gzip all static assets for you.// Before setting to `true`, make sure to:// npm install --save-dev compression-webpack-pluginproductionGzip: false,productionGzipExtensions: ['js', 'css'],// Run the build command with an extra argument to// View the bundle analyzer report after build finishes:// `npm run build --report`// Set to `true` or `false` to always turn it on or offbundleAnalyzerReport: process.env.npm_config_report}
}

然后执行npm run build打包,放置到你tomcat的webapps文件夹下
通过【软件商店】的【已安装】,可以找到tomcat安装位置,其他软件同理

在这里插入图片描述
在这里插入图片描述

我这里创建了一个chat文件夹,里面放了前端打包文件,这个时候你已经可以通过tomcat访问到自己的前端项目了,链接为公网ip:8080/chat,但是前后端无法联通

数据库

找到【数据库】,根据自己实际的项目创建对应的数据库

在这里插入图片描述
我以MySQL为例,点击【添加数据库】

在这里插入图片描述

根据自己实际项目填写数据库名和用户名密码
保存之后,在【权限】修改数据库为所有人,这样你也可以自己的电脑用sql工具连接你的数据库编辑建表等

在这里插入图片描述

nginx配置

将下载的nginx版本SSL证书上传到你的服务器,可以任意位置,记住位置即可
同样在【软件商店】的【已安装】,定位到已经按照的nginx的位置,找到conf文件夹下的nginx.conf文件
我们需要在里面新增server配置
在http{}的结构下新增如下配置

    server {listen       443 ssl;server_name  springsso.top;root /home/data;ssl_certificate      /www/server/nginx/conf/www.springsso.top.pem;# nginx版本的ssl证书位置,根据实际调整ssl_certificate_key  /www/server/nginx/conf/www.springsso.top.key;# nginx版本的ssl证书位置,根据实际调整ssl_session_cache    shared:SSL:1m;ssl_session_timeout  5m;ssl_ciphers  HIGH:!aNULL:!MD5;ssl_prefer_server_ciphers  on;location / {root   html;index  index.html index.htm;}location /chat/  {index index.html;#需要反代的采集服务,具体的服务器配置在nodes对应的ip服务器中,实际公网IP根据自己项目调整proxy_pass http://公网ip:8080/chat/;proxy_set_header X-Real-IP     $remote_addr;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;client_max_body_size     4g;client_body_buffer_size  256k;} location /chatEnd/ {proxy_pass https://公网ip:8082/chatEnd/;proxy_set_header X-Real-IP $remote_addr;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;proxy_set_header Host $host;proxy_set_header X-Forwarded-Proto $scheme;proxy_set_header X-NginX-Proxy true;proxy_ssl_session_reuse off;proxy_redirect off;client_max_body_size     4g;client_body_buffer_size  256k;# WebSocket 相关配置,如果你的项目有webSocket,需要新增这个proxy_http_version 1.1;proxy_set_header Upgrade $http_upgrade;proxy_set_header Connection "upgrade";}}

该配置实际是利用了反向代理,将在访问域名反向代理访问到启动在tomcat的项目
然后找到【软件商店】的安装的nginx进行重启,你就可以用域名访问到项目了
以我的为例,我可以用https://springsso.top/chat访问到项目

假如你需要使用泛解析,可以使用如下配置:

        server {listen       443 ssl http2;server_name  chat.springsso.top;root /home/data;ssl_certificate      /www/server/nginx/conf/www.springsso.top.pem;ssl_certificate_key  /www/server/nginx/conf/www.springsso.top.key;ssl_session_cache    shared:SSL:1m;ssl_session_timeout  5m;ssl_ciphers  HIGH:!aNULL:!MD5;ssl_prefer_server_ciphers  on;ssl_protocols TLSv1.2 TLSv1.3;location / {proxy_pass http://47.120.3.49:8080/chat/;proxy_set_header X-Real-IP $remote_addr;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;client_max_body_size     4g;client_body_buffer_size  256k;}}

那么这个配置你可以使用域名:
https://chat.springsso.top进行访问项目,需要注意的是,如果需要使用泛解析,那么你的SSL证书需要配置解析的域名有泛解析的域名,
例:*.springsso.top

结语

以上就是配置域名访问和https可信证书的教程,有遗漏会更新

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.xdnf.cn/news/8915.html

如若内容造成侵权/违法违规/事实不符,请联系一条长河网进行投诉反馈,一经查实,立即删除!

相关文章

Chromium 中chrome.webRequest扩展接口定义c++

一、chrome.webRequest 注意 :从 Manifest V3 开始,"webRequestBlocking" 权限不再适用于大多数扩展程序。以 "declarativeNetRequest" 为例,它允许使用 declarativeNetRequest API。除了 "webRequestBlocking&quo…

.NET中通过C#实现Excel与DataTable的数据互转

在.NET框架中,使用C#进行Excel数据与DataTable之间的转换是数据分析、报表生成、数据迁移等操作中的常见需求。这一过程涉及到将Excel文件中的数据读取并加载至DataTable中,以便于利用.NET提供的丰富数据处理功能进行操作,同时也包括将DataTa…

多个NVR同时管理EasyNVR多品牌NVR管理工具/设备:IP常见问题解决方案

随着视频监控技术的不断发展,NVR(网络视频录像机)已经成为现代安防系统的重要组成部分。而为了更高效地管理多个品牌的NVR设备,EasyNVR这一多品牌NVR管理工具应运而生。然而,在实际使用过程中,尤其是在多个…

虚幻引擎 CEO 谈元宇宙:发展、策略与布局

在当今科技领域,元宇宙无疑是最热门的话题之一。Epic Games 首席执行官 Tim Sweeney 对元宇宙的未来发展充满信心,他认为开放元宇宙将融合娱乐、游戏和科技产业,带来一个光明的未来。本文将深入探讨采访中的关键内容,分析元宇宙的…

支付宝与华为终端联手,移动支付即将进入“碰时代”

大家好,我是小悟。 支付宝与华为终端强强联手,达成了战略合作!这可不仅仅是个简单的合作哦,它预示着我们的移动支付方式即将迎来一场革命性的变革,正式进入“碰时代”! 支付宝,作为全球领先的…

常用机器人算法原理介绍

一、引言 随着科技的不断发展,机器人技术在各个领域得到了广泛应用。机器人算法是机器人实现各种功能的核心,它决定了机器人的行为和性能。本文将介绍几种常用的机器人算法原理,包括路径规划算法、定位算法和运动控制算法。 二、路径规划算法…

【go从零单排】迭代器(Iterators)

🌈Don’t worry , just coding! 内耗与overthinking只会削弱你的精力,虚度你的光阴,每天迈出一小步,回头时发现已经走了很远。 📗概念 在 Go 语言中,迭代器的实现通常不是通过语言内置的迭代器类型&#x…

Java 连接操作 MySQL 数据库(增删查改操作)

环境 MySQL 5.5 版本eclipseMySQL 连接驱动 mysql-connector-java-5.1.18-bin.jar mysql8.0之前的版本与之后的版本使用的jar包是不同的,在使用时也有一定的区别。这里,我的 MySQL 版本为 5.5。 准备工作 将 jar 包添加到项目中,右键项目&a…

STL---迭代器

本文来源:《C语言程序设计》第10章 理解迭代器对于理解STL框架并掌握STL的使用至关重要。 迭代器是泛化的指针,STL算法利用迭代器对存储在容器中的元素序列进行遍历,迭代器提供了访问容器中每个元素的方法。 虽然指针也是一种迭代器&#…

TSMI252012PMX-3R3MT功率电感详细解析

TSMI252012PMX-3R3MT功率电感详细解析 一、引言 在现代电子设备的不断小型化和高性能化的趋势下,功率电感作为电路中的关键元件,其性能的好坏直接影响到整个电路的稳定性和效率。TSMI252012PMX-3R3MT作为深圳市时源芯微科技有限公司(TimeSo…

Ubuntu22.04安装DataEase

看到DataEase的驾驶舱,感觉比PowerBI要好用一点,于是搭建起来玩玩。Dataease推荐的操作系统是Ubuntu22.04/Centos 7。 下载了Ubuntu22.04和DataEase 最新版本的离线安装包 一.安装ubuntu22.04 在安装的时候,没有顺手设置IP地址信息&#xff…

OpenEuler 下 Docker 安装、配置与测试实例

文章目录 前言1. 环境准备2. 下载 Docker3.配置服务文件4.配置加速器加速下载docker镜像5. 验证 Docker 安装 前言 Docker 安装大致分为包管理器安装、脚本安装、离线手动安装、容器编排工具安装、桌面版安装等,每种安装各有特点,但涉及知识面不少&…

wordpress实用功能A5资源网同款 隐藏下载框 支付框 需要登录才能查看隐藏的内容

实用功能 隐藏下载框 支付框 需要登录才能查看隐藏的内容, 个人网站防天朝申查实测有效 。 登录前,未登录: 登录后,已登录: 功能说明 该代码段的主要功能是隐藏支付框并为未 登录用户显示一条提示信息,告知他们需要…

C 语言学习-05【数组】

1、一维数组元素的操作 输入一个数&#xff0c;按原来排序的规律将它插入到一个一排列好的数组中&#xff1a; #include <stdio.h>int main() {int i, data, a[10] {2, 3, 6, 9, 11, 12, 14, 17, 19};printf("Primitive series: \n");for (i 0; i < 9; i)…

H5移动端预览PDF方法

新建页面 新建一个页面以便去预览对应的pdf 新建完后在 pages.json 文件内去新增对应路由 页面内容 <template><view class"page"><view class"pdf"><view id"demo"></view></view><view class"b…

嵌入式学习(11)-WS2812灯珠

WS2812的级联控制协议非常简单。通过一根信号线就可以进行串行异步信号发送。 下面显示了四个WS2812通过数据性级联的方式。在串行通讯中使用不同高低电平脉冲表示数据0,1编码。 使用GPIO模拟时序时&#xff1a;GPIO的驱动频率大约是1MHz 硬件电路&#xff1a; 软件代码实现&…

流类库与输入输出

来源&#xff1a;《C语言程序设计》 像C语言一样&#xff0c;C语言也没有输入输出语句。 但C标准库中有一个面向对象的输入输出软件包&#xff0c;即I/O流类库。 流是I/O流类的中心概念。 ------ I/O流类库是C语言中I/O函数在面向对象的程序设计方法中的一个替换产品。 -…

RK3288 android7.1 适配 ilitek i2c接口TP

一&#xff0c;Ilitek 触摸屏简介 Ilitek 提供多种型号的触控屏控制器&#xff0c;如 ILI6480、ILI9341 等&#xff0c;采用 I2C 接口。 这些控制器能够支持多点触控&#xff0c;并具有优秀的灵敏度和响应速度。 Ilitek 的触摸屏控制器监测屏幕上的触摸事件。 当触摸发生时&am…

【AI写作宝-注册安全分析报告-无验证方式导致安全隐患】

前言 由于网站注册入口容易被黑客攻击&#xff0c;存在如下安全问题&#xff1a; 1. 暴力破解密码&#xff0c;造成用户信息泄露 2. 短信盗刷的安全问题&#xff0c;影响业务及导致用户投诉 3. 带来经济损失&#xff0c;尤其是后付费客户&#xff0c;风险巨大&#xff0c;造…

一文熟悉新版llama.cpp使用并本地部署LLAMA

0. 简介 最近是快到双十一了再给大家上点干货。去年我们写了一个大模型的系列&#xff0c;经过一年&#xff0c;大模型的发展已经日新月异。这一次我们来看一下使用llama.cpp这个项目&#xff0c;其主要解决的是推理过程中的性能问题。主要有两点优化&#xff1a; llama.cpp …