Nginx实战部署常用功能演示(超详细版)，绝对给力~~~

最新推荐文章于 2024-04-21 21:05:33 发布

Code综艺圈

最新推荐文章于 2024-04-21 21:05:33 发布

阅读量364

点赞数 1

分类专栏：部署文章标签： nginx 部署

本文链接：https://blog.csdn.net/zyq025/article/details/117510004

版权

前言

上次分享了一些开发过程中常用的功能，但如果到真实环境中，其实还需要一些额外的配置，比如说跨域、缓存、配置SSL证书、高可用等，老规矩，还是挑几个平时比较常用的进行演示分享。上篇详见Nginx超详细常用功能演示，够用啦~~~。

正文

1. 跨域

跨域是因为浏览器同源策略的保护，不能直接执行或请求其他站点的脚本和数据；一般我们认为的同源就是指协议、域名、端口都相同，否则就不是同源。

现在前后端分离开发已经很普遍了，跨域问题肯定少不了，但解决的方式也很多，比如JsonP、后端添加相关请求头等；很多时候，不想改动代码，如果用到nginx做代理服务器，那就可以轻松配置解决跨域问题。

1.1 环境准备

需要准备两个项目，一个前端项目发布在80端口上，一个API项目发布在5000端口上，这里需要在阿里云的安全组中将这两个端口开放；

API项目环境(对外是5000端口)

API接口还是使用上次演示的项目，很简单，过程我就不再重复上图啦，直接来两张重要的；

配置nginx反向代理，然后运行看效果：

前端环境(对外是80端口)

前端页面(kuayu.html)

<!DOCTYPE html>
<html>
<head>
	<title>跨域测试</title>
	<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
	<script type="text/javascript">
		$(document).ready(function(){
		  // 点击按钮 请求数据，
		  $("#b01").click(function(){
		  		// 请求数据
		  		htmlobj=$.ajax({url:"http://47.113.204.41:5000/weatherforecast/getport",async:false});
		  		// 将请求的数据显示在div中
		  		$("#myDiv").html(htmlobj.responseText);
		  });
		});
	</script>
</head>
<body>
	<h2>获取结果</h2>
	<div id="myDiv">结果显示</div>
	<button id="b01" type="button">GetPort</button>
</body>
</html>
复制代码

将kuayu.html通过xFtp拷贝到服务器上，对应的static目录是自己创建的，如下图：

nginx配置及运行测试

配置nginx，在原有配置文件中再新增一个server块，如下配置：

运行测试：

跨域问题出现了，现在前后端都不想改代码，要干架吗？nginx说：和谐，一定要和谐~~~

1.2 配置跨域及运行

在API的server中进行跨域配置，如下：

重启nginx之后，再测试，看看搞定了没？

2. 配置SSL证书

现在的站点几乎都是https了，所以这个功能必须要实操一把；为了更符合真实线上场景，我特意准备了域名和证书，真真实实在阿里云服务器上演示；这里需要登录到阿里云上购买域名，然后根据域名申请免费的SSL证书，最后进行配置使用，详情如下：

2.1 准备域名

这里我注册了一个域名为：codezyq.cn；下面先说说注册域名的流程：

登录阿里云，找到域名注册入口
进入到一个页面，然后输入需要注册的域名
然后就出现搜索结果，如果被注册就会提示，可以选择其他类型或更换域名
买了域名之后，需要进行实名认证，个人上传身份证就完事啦，一会就实名完成；完成之后就需要配置域名解析，即解析到自己的云服务器上，后续通过域名才可以访问；
测试是否能解析成功，直接在自己电脑上ping一下域名，看看是否解析到指定IP即可，简单直接；这样域名就可以用啦~~~

2.2 准备证书

免费证书这块的申请需要用到买的域名，大概步骤如下：

领取免费证书数量(20个)
进入SSL证书(应用安全页面)进行证书创建
进行证书申请，即绑定域名

填写申请信息，如下：

这里一般填完申请信息，后续验证那块直接过也能签发，列表状态如下：
签发完成之后，下载对应服务器

最低0.47元/天解锁文章

Code综艺圈

关注

1
点赞
踩
3

收藏

觉得还不错? 一键收藏
1
评论
Nginx实战部署常用功能演示(超详细版)，绝对给力~~~

前言上次分享了一些开发过程中常用的功能，但如果到真实环境中，其实还需要一些额外的配置，比如说跨域、缓存、配置SSL证书、高可用等，老规矩，还是挑几个平时比较常用的进行演示分享。上篇详见Nginx超详细常用功能演示，够用啦~~~。正文1. 跨域跨域是因为浏览器同源策略的保护，不能直接执行或请求其他站点的脚本和数据；一般我们认为的同源就是指协议、域名、端口都相同，否则就不是同源。现在前后端分离开发已经很普遍了，跨域问题肯定少不了，但解决的方式也很多，比如JsonP、后端添加相关请求头等；很多
复制链接

扫一扫

专栏目录