一、前端脚手架工程构建

1. 页面配置菜单

通过观察，系统会将 "/" 替换为 "-"
对应到VUE项目中就是在 src/views/modules/product/category.vue

2.在前端项目中导入element-ui组件

二、网关配置

我们发现各个微服务对应的地址以及端口都不一样，所以我们要统一配置网关路由和路径重写。

1.前端项目配置请求地址

2.renrne-fast配置

1.配置yml以及网关

2.开启注册服务

3.网关项目配置路由规则

spring:
  cloud:
    gateway:
      routes:
        - id: test_route
          uri: https://www.baidu.com
          predicates:
            - Query=url,baidu
        - id: qq_route
          uri: https://www.qq.com
          predicates:
            - Query=url,qq
        - id: admin_route
          uri: lb://renren-fast
          predicates:
            - Path=/api/**

lb表示负载均衡

4.网关重写路由

我们这时候访问项目还是会报错，这是因为访问路径有问题
前端项目请求 http://localhost:89/api/captcha.jpg
会被网关路由到 http://localhost:8080/api/captcha.jpg
需要重写路由

filters:
  - RewritePath=/api/(?<segment>.*),/renren-fast/${segment}

5.网关配置跨域

http协议、地址、端口有任意一个不同就会引发跨域问题

跨域流程

解决方案-nginx部署同一域

解决方案-配置档次请求允许跨域

网关统一配置跨域

package com.atguigu.gulimall.gateway.config;

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.reactive.CorsWebFilter;
import org.springframework.web.cors.reactive.UrlBasedCorsConfigurationSource;

/**
 * @description:
 * @author: qiaoyuhang
 * @date: 2022/3/2 10:37 上午
 */
@Configuration
public class GulimallCorsConfiguration {
    @Bean
    public CorsWebFilter corsWebFilter(){
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        //1.配置跨域
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        corsConfiguration.addAllowedHeader("*");
        corsConfiguration.addAllowedMethod("*");
        corsConfiguration.addAllowedOrigin("*");
        corsConfiguration.setAllowCredentials(true);

        source.registerCorsConfiguration("/**",corsConfiguration);
        return new CorsWebFilter(source);
    }

}

三、逻辑删除

通过更新标识符，展示或隐藏

1.配置mybatis-plus逻辑删除配置

2.逻辑删除字段添加@TableLogic注解

四、云存储

1.项目引入SDK

<dependency> 
<groupId>com.aliyun.oss</groupId>
<artifactId>aliyun-sdk-oss</artifactId>
<version>3.10.2</version> 
</dependency>

或者

<!--        oss存储-->
<dependency>
    <groupId>com.alibaba.cloud</groupId>
    <artifactId>spring-cloud-starter-alicloud-oss</artifactId>
</dependency>

2.服务端签名后上传

官方文章地址：help.aliyun.com/document_de…

谷粒商城-基础篇-DAY3