微服务项目实战-黑马头条(一):环境搭建 + APP登录功能【前端静态资源+nginx反向代理+网关+过滤器】
一万年可长否 2024-06-15 13:03:05 阅读 73
文章目录
一、搭建nacos二、初始工程的搭建2.1 环境准备2.2主体结构 三、APP登录3.1 需求分析3.2 表结构分析3.3 接口定义3.4 功能实现 四、接口工具postman、swagger、knife4j4.1 postman4.2 swagger4.3 knife4j 五、网关5.1 网关搭建5.2 全局过滤器实现jwt校验 六、前端集成6.1 前端项目部署思路6.2 配置nginx
一、搭建nacos
①:docker拉取镜像
docker pull nacos/nacos-server:1.2.0
②:创建容器
docker run --env MODE=standalone --name nacos --restart=always -d -p 8848:8848 nacos/nacos-server:1.2.0
MODE=standalone 单机版
–restart=always 开机启动
-p 8848:8848 映射端口
-d 创建一个守护式容器在后台运行
③:访问地址:http://192.168.200.130:8848/nacos
二、初始工程的搭建
2.1 环境准备
①:项目依赖环境(需提前安装好)
JDK1.8
Intellij Idea
maven-3.6.1
Git
②:在当天资料中解压heima-leadnews.zip文件,拷贝到一个没有中文和空格的目录,使用idea打开即可
③:IDEA开发工具配置
设置本地仓库,建议使用资料中提供好的仓库
④:设置项目编码格式
2.2主体结构
heima-leadnews-common:负责处理通用异常
三、APP登录
3.1 需求分析
3.2 表结构分析
关于app端用户相关的内容较多,可以单独设置一个库leadnews_user
表名称 | 说明 |
---|---|
ap_user | APP用户信息表 |
ap_user_fan | APP用户粉丝信息表 |
ap_user_follow | APP用户关注信息表 |
ap_user_realname | APP实名认证信息表 |
从当前资料中找到对应数据库并导入到mysql中
登录需要用到的是ap_user表,表结构如下:
项目中的持久层使用的mybatis-plus,一般都使用mybais-plus逆向生成对应的实体类
app_user表对应的实体类如下:
package com.heima.model.user.pojos;import com.baomidou.mybatisplus.annotation.IdType;import com.baomidou.mybatisplus.annotation.TableField;import com.baomidou.mybatisplus.annotation.TableId;import com.baomidou.mybatisplus.annotation.TableName;import lombok.Data;import java.io.Serializable;import java.util.Date;/** * <p> * APP用户信息表 * </p> * * @author itheima */@Data@TableName("ap_user")public class ApUser implements Serializable { private static final long serialVersionUID = 1L; /** * 主键 */ @TableId(value = "id", type = IdType.AUTO) private Integer id; /** * 密码、通信等加密盐 */ @TableField("salt") private String salt; /** * 用户名 */ @TableField("name") private String name; /** * 密码,md5加密 */ @TableField("password") private String password; /** * 手机号 */ @TableField("phone") private String phone; /** * 头像 */ @TableField("image") private String image; /** * 0 男 1 女 2 未知 */ @TableField("sex") private Boolean sex; /** * 0 未 1 是 */ @TableField("is_certification") private Boolean certification; /** * 是否身份认证 */ @TableField("is_identity_authentication") private Boolean identityAuthentication; /** * 0正常 1锁定 */ @TableField("status") private Boolean status; /** * 0 普通用户 1 自媒体人 2 大V */ @TableField("flag") private Short flag; /** * 注册时间 */ @TableField("created_time") private Date createdTime;}
手动加密(md5+随机字符串)
md5是不可逆加密,md5相同的密码每次加密都一样,不太安全。在md5的基础上手动加盐(salt)处理
注册->生成盐
登录->使用盐来配合验证
3.3 接口定义
heima-leadnews-service的pom文件解析
引导类UserApplication
package com.heima.user;import org.mybatis.spring.annotation.MapperScan;import org.springframework.boot.SpringApplication;import org.springframework.boot.autoconfigure.SpringBootApplication;import org.springframework.cloud.client.discovery.EnableDiscoveryClient;@SpringBootApplication@EnableDiscoveryClient@MapperScan("com.heima.user.mapper")public class UserApplication { public static void main(String[] args) { SpringApplication.run(UserApplication.class,args); }}
bootstrap.yml
server: port: 51801spring: application: name: leadnews-user cloud: nacos: discovery: server-addr: 192.168.200.130:8848 config: server-addr: 192.168.200.130:8848 file-extension: yml
在nacos中创建配置文件
其中mysql和mybatis-plus 与 com.heima.model.user.pojos映射,而com.heima.model.user.pojos目录在heima-leadnews-model服务下
spring: datasource: driver-class-name: com.mysql.jdbc.Driver url: jdbc:mysql://localhost:3306/leadnews_user?useUnicode=true&characterEncoding=UTF-8&serverTimezone=UTC username: root password: root# 设置Mapper接口所对应的XML文件位置,如果你在Mapper接口中有自定义方法,需要进行该配置mybatis-plus: mapper-locations: classpath*:mapper/*.xml # 设置别名包扫描路径,通过该属性可以给包中的类注册别名 type-aliases-package: com.heima.model.user.pojos
logback.xml 注意:以下第四行设置日志文件存放在e:/logs下
<?xml version="1.0" encoding="UTF-8"?><configuration> <!--定义日志文件的存储地址,使用绝对路径--> <property name="LOG_HOME" value="e:/logs"/> <!-- Console 输出设置 --> <appender name="CONSOLE" class="ch.qos.logback.core.ConsoleAppender"> <encoder> <!--格式化输出:%d表示日期,%thread表示线程名,%-5level:级别从左显示5个字符宽度%msg:日志消息,%n是换行符--> <pattern>%d{yyyy-MM-dd HH:mm:ss.SSS} [%thread] %-5level %logger{36} - %msg%n</pattern> <charset>utf8</charset> </encoder> </appender> <!-- 按照每天生成日志文件 --> <appender name="FILE" class="ch.qos.logback.core.rolling.RollingFileAppender"> <rollingPolicy class="ch.qos.logback.core.rolling.TimeBasedRollingPolicy"> <!--日志文件输出的文件名--> <fileNamePattern>${LOG_HOME}/leadnews.%d{yyyy-MM-dd}.log</fileNamePattern> </rollingPolicy> <encoder> <pattern>%d{yyyy-MM-dd HH:mm:ss.SSS} [%thread] %-5level %logger{36} - %msg%n</pattern> </encoder> </appender> <!-- 异步输出 --> <appender name="ASYNC" class="ch.qos.logback.classic.AsyncAppender"> <!-- 不丢失日志.默认的,如果队列的80%已满,则会丢弃TRACT、DEBUG、INFO级别的日志 --> <discardingThreshold>0</discardingThreshold> <!-- 更改默认的队列的深度,该值会影响性能.默认值为256 --> <queueSize>512</queueSize> <!-- 添加附加的appender,最多只能添加一个 --> <appender-ref ref="FILE"/> </appender> <logger name="org.apache.ibatis.cache.decorators.LoggingCache" level="DEBUG" additivity="false"> <appender-ref ref="CONSOLE"/> </logger> <logger name="org.springframework.boot" level="debug"/> <root level="info"> <!--<appender-ref ref="ASYNC"/>--> <appender-ref ref="FILE"/> <appender-ref ref="CONSOLE"/> </root></configuration>
3.4 功能实现
①:接口定义
@RestController@RequestMapping("/api/v1/login")public class ApUserLoginController { @PostMapping("/login_auth") public ResponseResult login(@RequestBody LoginDto dto) { return null; }}
②:持久层mapper
package com.heima.user.mapper;import com.baomidou.mybatisplus.core.mapper.BaseMapper;import com.heima.model.user.pojos.ApUser;import org.apache.ibatis.annotations.Mapper;@Mapperpublic interface ApUserMapper extends BaseMapper<ApUser> { }
③:业务层service
package com.heima.user.service;import com.baomidou.mybatisplus.extension.service.IService;import com.heima.model.common.dtos.ResponseResult;import com.heima.model.user.dtos.LoginDto;import com.heima.model.user.pojos.ApUser;public interface ApUserService extends IService<ApUser>{ /** * app端登录 * @param dto * @return */ public ResponseResult login(LoginDto dto); }
实现类:
package com.heima.user.service.impl;import com.baomidou.mybatisplus.core.toolkit.Wrappers;import com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;import com.heima.model.common.dtos.ResponseResult;import com.heima.model.common.enums.AppHttpCodeEnum;import com.heima.model.user.dtos.LoginDto;import com.heima.model.user.pojos.ApUser;import com.heima.user.mapper.ApUserMapper;import com.heima.user.service.ApUserService;import com.heima.utils.common.AppJwtUtil;import org.apache.commons.lang3.StringUtils;import org.springframework.stereotype.Service;import org.springframework.util.DigestUtils;import java.util.HashMap;import java.util.Map;@Servicepublic class ApUserServiceImpl extends ServiceImpl<ApUserMapper, ApUser> implements ApUserService { @Override public ResponseResult login(LoginDto dto) { //1.正常登录(手机号+密码登录) if (!StringUtils.isBlank(dto.getPhone()) && !StringUtils.isBlank(dto.getPassword())) { //1.1查询用户 ApUser apUser = getOne(Wrappers.<ApUser>lambdaQuery().eq(ApUser::getPhone, dto.getPhone())); if (apUser == null) { return ResponseResult.errorResult(AppHttpCodeEnum.DATA_NOT_EXIST,"用户不存在"); } //1.2 比对密码 String salt = apUser.getSalt(); String pswd = dto.getPassword(); pswd = DigestUtils.md5DigestAsHex((pswd + salt).getBytes()); if (!pswd.equals(apUser.getPassword())) { return ResponseResult.errorResult(AppHttpCodeEnum.LOGIN_PASSWORD_ERROR); } //1.3 返回数据 jwt Map<String, Object> map = new HashMap<>(); map.put("token", AppJwtUtil.getToken(apUser.getId().longValue())); apUser.setSalt(""); apUser.setPassword(""); map.put("user", apUser); return ResponseResult.okResult(map); } else { //2.游客 同样返回token id = 0 Map<String, Object> map = new HashMap<>(); map.put("token", AppJwtUtil.getToken(0l)); return ResponseResult.okResult(map); } }}
④:控制层controller
package com.heima.user.controller.v1;import com.heima.model.common.dtos.ResponseResult;import com.heima.model.user.dtos.LoginDto;import com.heima.user.service.ApUserService;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.web.bind.annotation.PostMapping;import org.springframework.web.bind.annotation.RequestBody;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.RestController;@RestController@RequestMapping("/api/v1/login")public class ApUserLoginController { @Autowired private ApUserService apUserService; @PostMapping("/login_auth") public ResponseResult login(@RequestBody LoginDto dto) { return apUserService.login(dto); }}
四、接口工具postman、swagger、knife4j
4.1 postman
Postman是一款功能强大的网页调试与发送网页HTTP请求的Chrome插件。postman被500万开发者和超100,000家公司用于每月访问1.3亿个API。
官方网址:https://www.postman.com/
解压资料文件夹中的软件,安装即可
通常的接口测试查看请求和响应,下面是登录请求的测试
4.2 swagger
一、简介
Swagger 是一个规范和完整的框架,用于生成、描述、调用和可视化 RESTful 风格的 Web 服务(https://swagger.io/)。
它的主要作用是:
使得前后端分离开发更加方便,有利于团队协作
接口的文档在线自动生成,降低后端开发人员编写接口文档的负担
功能测试
Spring已经将Swagger纳入自身的标准,建立了Spring-swagger项目,现在叫Springfox。通过在项目中引入Springfox ,即可非常简单快捷的使用Swagger。
二、SpringBoot集成Swagger
引入依赖,在heima-leadnews-model
和heima-leadnews-common
模块中引入该依赖
<dependency> <groupId>io.springfox</groupId> <artifactId>springfox-swagger2</artifactId></dependency><dependency> <groupId>io.springfox</groupId> <artifactId>springfox-swagger-ui</artifactId></dependency>
只需要在heima-leadnews-common中进行配置即可,因为其他微服务工程都直接或间接依赖即可。
在heima-leadnews-common工程中添加一个配置类
新增:com.heima.common.swagger.SwaggerConfiguration
package com.heima.common.swagger;import org.springframework.context.annotation.Bean;import org.springframework.context.annotation.Configuration;import springfox.documentation.builders.ApiInfoBuilder;import springfox.documentation.builders.PathSelectors;import springfox.documentation.builders.RequestHandlerSelectors;import springfox.documentation.service.ApiInfo;import springfox.documentation.service.Contact;import springfox.documentation.spi.DocumentationType;import springfox.documentation.spring.web.plugins.Docket;import springfox.documentation.swagger2.annotations.EnableSwagger2;@Configuration@EnableSwagger2public class SwaggerConfiguration { @Bean public Docket buildDocket() { return new Docket(DocumentationType.SWAGGER_2) .apiInfo(buildApiInfo()) .select() // 要扫描的API(Controller)基础包 .apis(RequestHandlerSelectors.basePackage("com.heima")) .paths(PathSelectors.any()) .build(); } private ApiInfo buildApiInfo() { Contact contact = new Contact("黑马程序员","",""); return new ApiInfoBuilder() .title("黑马头条-平台管理API文档") .description("黑马头条后台api") .contact(contact) .version("1.0.0").build(); }}
在heima-leadnews-common模块中的resources目录中新增以下目录和文件
文件:resources/META-INF/Spring.factories
org.springframework.boot.autoconfigure.EnableAutoConfiguration=\ com.heima.common.swagger.SwaggerConfiguration
三、Swagger常用注解
在Java类中添加Swagger的注解即可生成Swagger接口文档,常用Swagger注解如下:
@Api:修饰整个类,描述Controller的作用
@ApiOperation:描述一个类的一个方法,或者说一个接口
@ApiParam:单个参数的描述信息
@ApiModel:用对象来接收参数
@ApiModelProperty:用对象接收参数时,描述对象的一个字段
@ApiResponse:HTTP响应其中1个描述
@ApiResponses:HTTP响应整体描述
@ApiIgnore:使用该注解忽略这个API
@ApiError :发生错误返回的信息
@ApiImplicitParam:一个请求参数
@ApiImplicitParams:多个请求参数的描述信息
@ApiImplicitParam属性:
属性 | 取值 | 作用 |
---|---|---|
paramType | 查询参数类型 | |
path | 以地址的形式提交数据 | |
query | 直接跟参数完成自动映射赋值 | |
body | 以流的形式提交 仅支持POST | |
header | 参数在request headers 里边提交 | |
form | 以form表单的形式提交 仅支持POST | |
dataType | 参数的数据类型 只作为标志说明,并没有实际验证 | |
Long | ||
String | ||
name | 接收参数名 | |
value | 接收参数的意义描述 | |
required | 参数是否必填 | |
true | 必填 | |
false | 非必填 | |
defaultValue | 默认值 |
我们在ApUserLoginController中添加Swagger注解,代码如下所示:
@RestController@RequestMapping("/api/v1/login")@Api(value = "app端用户登录", tags = "ap_user", description = "app端用户登录API")public class ApUserLoginController { @Autowired private ApUserService apUserService; @PostMapping("/login_auth") @ApiOperation("用户登录") public ResponseResult login(@RequestBody LoginDto dto){ return apUserService.login(dto); }}
LoginDto
@Datapublic class LoginDto { /** * 手机号 */ @ApiModelProperty(value="手机号",required = true) private String phone; /** * 密码 */ @ApiModelProperty(value="密码",required = true) private String password;}
启动user微服务,访问地址:http://localhost:51801/swagger-ui.html
4.3 knife4j
一、简介
knife4j是为Java MVC框架集成Swagger生成Api文档的增强解决方案,前身是swagger-bootstrap-ui,取名kni4j是希望它能像一把匕首一样小巧,轻量,并且功能强悍!
gitee地址:https://gitee.com/xiaoym/knife4j
官方文档:https://doc.xiaominfo.com/
效果演示:http://knife4j.xiaominfo.com/doc.html
二、核心功能
该UI增强包主要包括两大核心功能:文档说明 和 在线调试
文档说明:根据Swagger的规范说明,详细列出接口文档的说明,包括接口地址、类型、请求示例、请求参数、响应示例、响应参数、响应码等信息,使用swagger-bootstrap-ui能根据该文档说明,对该接口的使用情况一目了然。在线调试:提供在线接口联调的强大功能,自动解析当前接口参数,同时包含表单验证,调用参数可返回接口响应内容、headers、Curl请求命令实例、响应时间、响应状态码等信息,帮助开发者在线调试,而不必通过其他测试工具测试接口是否正确,简介、强大。个性化配置:通过个性化ui配置项,可自定义UI的相关显示信息离线文档:根据标准规范,生成的在线markdown离线文档,开发者可以进行拷贝生成markdown接口文档,通过其他第三方markdown转换工具转换成html或pdf,这样也可以放弃swagger2markdown组件接口排序:自1.8.5后,ui支持了接口排序功能,例如一个注册功能主要包含了多个步骤,可以根据swagger-bootstrap-ui提供的接口排序规则实现接口的排序,step化接口操作,方便其他开发者进行接口对接
三、快速集成
在heima-leadnews-common
模块中的pom.xml
文件中引入knife4j
的依赖,如下:
<dependency> <groupId>com.github.xiaoymin</groupId> <artifactId>knife4j-spring-boot-starter</artifactId></dependency>
创建Swagger配置文件
在heima-leadnews-common模块中新建配置类
新建Swagger的配置文件SwaggerConfiguration.java
文件,创建springfox提供的Docket分组对象,代码如下:
package com.heima.common.knife4j;import com.github.xiaoymin.knife4j.spring.annotations.EnableKnife4j;import org.springframework.context.annotation.Bean;import org.springframework.context.annotation.Configuration;import org.springframework.context.annotation.Import;import springfox.bean.validators.configuration.BeanValidatorPluginsConfiguration;import springfox.documentation.builders.ApiInfoBuilder;import springfox.documentation.builders.PathSelectors;import springfox.documentation.builders.RequestHandlerSelectors;import springfox.documentation.service.ApiInfo;import springfox.documentation.spi.DocumentationType;import springfox.documentation.spring.web.plugins.Docket;import springfox.documentation.swagger2.annotations.EnableSwagger2;@Configuration@EnableSwagger2@EnableKnife4j@Import(BeanValidatorPluginsConfiguration.class)public class Swagger2Configuration { @Bean(value = "defaultApi2") public Docket defaultApi2() { Docket docket=new Docket(DocumentationType.SWAGGER_2) .apiInfo(apiInfo()) //分组名称 .groupName("1.0") .select() //这里指定Controller扫描包路径 .apis(RequestHandlerSelectors.basePackage("com.heima")) .paths(PathSelectors.any()) .build(); return docket; } private ApiInfo apiInfo() { return new ApiInfoBuilder() .title("黑马头条API文档") .description("黑马头条API文档") .version("1.0") .build(); }}
以上有两个注解需要特别说明,如下表:
注解 | 说明 |
---|---|
@EnableSwagger2 | 该注解是Springfox-swagger框架提供的使用Swagger注解,该注解必须加 |
@EnableKnife4j | 该注解是knife4j 提供的增强注解,Ui提供了例如动态参数、参数过滤、接口排序等增强功能,如果你想使用这些增强功能就必须加该注解,否则可以不用加 |
在Spring.factories中新增配置
org.springframework.boot.autoconfigure.EnableAutoConfiguration=\ com.heima.common.swagger.Swagger2Configuration, \ com.heima.common.swagger.SwaggerConfiguration
访问
在浏览器输入地址:http://host:port/doc.html
五、网关
5.1 网关搭建
(1)在heima-leadnews-gateway
的pom文件导入以下网关
和nacos
依赖
<dependencies> <dependency> <groupId>org.springframework.cloud</groupId> <artifactId>spring-cloud-starter-gateway</artifactId> </dependency> <dependency> <groupId>com.alibaba.cloud</groupId> <artifactId>spring-cloud-starter-alibaba-nacos-discovery</artifactId> </dependency> <dependency> <groupId>com.alibaba.cloud</groupId> <artifactId>spring-cloud-starter-alibaba-nacos-config</artifactId> </dependency> <dependency> <groupId>io.jsonwebtoken</groupId> <artifactId>jjwt</artifactId> </dependency></dependencies>
(2)在heima-leadnews-gateway
(用来管理网关)下创建heima-leadnews-app-gateway
微服务
引导类:
package com.heima.app.gateway;import org.springframework.boot.SpringApplication;import org.springframework.boot.autoconfigure.SpringBootApplication;import org.springframework.cloud.client.discovery.EnableDiscoveryClient;@SpringBootApplication@EnableDiscoveryClient //开启注册中心public class AppGatewayApplication { public static void main(String[] args) { SpringApplication.run(AppGatewayApplication.class,args); }}
bootstrap.yml
server: port: 51601spring: application: name: leadnews-app-gateway cloud: nacos: discovery: server-addr: 192.168.200.130:8848 config: server-addr: 192.168.200.130:8848 file-extension: yml
在nacos的配置中心
创建Data Id为leadnews-app-gateway的yml配置
spring: cloud: gateway: globalcors: add-to-simple-url-handler-mapping: true corsConfigurations: '[/**]': allowedHeaders: "*" allowedOrigins: "*" allowedMethods: - GET - POST - DELETE - PUT - OPTION routes: # 平台管理 - id: user uri: lb://leadnews-user # 监控 名为leadnews-user的微服务 predicates: - Path=/user/** # 会在leadnews-user服务的请求路径前面加上user/,实际调用时会被删除 filters: - StripPrefix= 1
环境搭建完成以后,启动项目网关和用户两个服务,使用postman进行测试
请求地址:http://localhost:51601/user/api/v1/login/login_auth
5.2 全局过滤器实现jwt校验
思路分析:
用户进入网关开始登陆,网关过滤器进行判断,如果是登录,则路由到后台管理微服务进行登录用户登录成功,后台管理微服务签发JWT TOKEN信息返回给用户用户再次进入网关开始访问,网关过滤器接收用户携带的TOKEN网关过滤器解析TOKEN ,判断是否有权限,如果有,则放行,如果没有则返回未认证错误
具体实现:
第一:在认证过滤器中需要用到jwt的解析,所以需要把工具类AppJwtUtil.java
拷贝一份到网关微服务
第二:在网关微服务中新建全局过滤器:
package com.heima.app.gateway.filter;import com.heima.app.gateway.util.AppJwtUtil;import io.jsonwebtoken.Claims;import lombok.extern.slf4j.Slf4j;import org.apache.commons.lang.StringUtils;import org.springframework.cloud.gateway.filter.GatewayFilterChain;import org.springframework.cloud.gateway.filter.GlobalFilter;import org.springframework.core.Ordered;import org.springframework.http.HttpStatus;import org.springframework.http.server.reactive.ServerHttpRequest;import org.springframework.http.server.reactive.ServerHttpResponse;import org.springframework.stereotype.Component;import org.springframework.web.server.ServerWebExchange;import reactor.core.publisher.Mono;@Component@Slf4jpublic class AuthorizeFilter implements Ordered, GlobalFilter { @Override public Mono<Void> filter(ServerWebExchange exchange, GatewayFilterChain chain) { //1.获取request和response对象 ServerHttpRequest request = exchange.getRequest(); ServerHttpResponse response = exchange.getResponse(); //2.判断请求是否从界面登录来 if(request.getURI().getPath().contains("/login")){ //放行 return chain.filter(exchange); } // 如果请求从其他页面来,判断token是否存在/有效 //3.获取token String token = request.getHeaders().getFirst("token"); //4.判断token是否存在 if(StringUtils.isBlank(token)){ // 不存在 response.setStatusCode(HttpStatus.UNAUTHORIZED); return response.setComplete(); } //5.判断token是否有效 try { Claims claimsBody = AppJwtUtil.getClaimsBody(token); //是否是过期 int result = AppJwtUtil.verifyToken(claimsBody); if(result == 1 || result == 2){ // 过期 response.setStatusCode(HttpStatus.UNAUTHORIZED); return response.setComplete(); } }catch (Exception e){ e.printStackTrace(); response.setStatusCode(HttpStatus.UNAUTHORIZED); // 解析token出错 return response.setComplete(); } //6.放行 return chain.filter(exchange); } /** * 优先级设置 值越小 优先级越高 * @return */ @Override public int getOrder() { return 0; }}
测试:启动user服务,继续访问其他微服务,会提示需要认证才能访问,这个时候需要在heads中设置设置token才能正常访问。
六、前端集成
6.1 前端项目部署思路
通过nginx来进行配置,功能如下
通过nginx的反向代理功能访问后台的网关资源通过nginx的静态服务器功能访问前端静态页面
6.2 配置nginx
①:解压资料文件夹中的压缩包nginx-1.18.0.zip
②:解压资料文件夹中的前端项目app-web.zip
③:配置nginx.conf文件
在nginx安装的conf目录下新建一个文件夹leadnews.conf
,在当前文件夹中新建heima-leadnews-app.conf
文件
heima-leadnews-app.conf
配置如下:server下的location用来指定前端项目
upstream heima-app-gateway{ server localhost:51601;}server { listen 8801;location / { # 静态资源root D:/workspace/app-web/;index index.html;}location ~/app/(.*) { # 反向代理proxy_pass http://heima-app-gateway/$1; # 反向代理给网关proxy_set_header HOST $host; # 不改变源请求头的值proxy_pass_request_body on; #开启获取请求体proxy_pass_request_headers on; #开启获取请求头proxy_set_header X-Real-IP $remote_addr; # 记录真实发出请求的客户端IPproxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; #记录代理信息}}
在nginx.conf
把里面内容全部删除,替换成以下,引入heima-leadnews-app.conf文件加载
#user nobody;worker_processes 1;events { worker_connections 1024;}http { include mime.types; default_type application/octet-stream; sendfile on; keepalive_timeout 65;# 引入自定义配置文件:leadnews.conf目录下的所有.conf文件include leadnews.conf/*.conf;}
④ :启动nginx
在nginx安装包中使用命令提示符打开,输入命令nginx启动项目
可查看进程,检查nginx是否启动
重新加载配置文件:nginx -s reload
⑤:打开前端项目进行测试 – > http://localhost:8801
用谷歌浏览器打开,调试移动端模式进行访问
声明
本文内容仅代表作者观点,或转载于其他网站,本站不以此文作为商业用途
如有涉及侵权,请联系本站进行删除
转载本站原创文章,请注明来源及作者。