乐优商城学习笔记04-编写分类查询和解决跨域问题

1.首先将后台前端页面的多级分类树的组件引入：

• 打开Category.vue:
  
• 在script标签内添加代码：

import {treeData} from "../../mockDB";

• 并将组件引入：
  
• 此时前端页面还没有数据，我们需要将sql文件数据先导入数据库
• 导入成功后就可以编写后端代码

2.引入通用mapper注解依赖：

• 打开leyou-item的pom文件，添加通用mapper依赖：

<dependencies>
        <dependency>
            <groupId>javax.persistence</groupId>
            <artifactId>persistence-api</artifactId>
            <version>1.0</version>
        </dependency>
    </dependencies>

3.创建Category的实体类：

• 打开leyou-item-interface，创建实体类Category.class:
  
• 编辑Category:

package com.leyou.item.pojo;

import javax.persistence.GeneratedValue;
import javax.persistence.GenerationType;
import javax.persistence.Id;
import javax.persistence.Table;

@Table(name="tb_category")     //数据库中对应的表名
public class Category {
    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private Long id;
    private String name;
    private Long parentId;
    private Boolean isParent;  //注意isParent生成的getter和setter方法需要手动加上Is
    private Integer sort;

    public Long getId() {
        return id;
    }

    public void setId(Long id) {
        this.id = id;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public Long getParentId() {
        return parentId;
    }

    public void setParentId(Long parentId) {
        this.parentId = parentId;
    }

    public Boolean getIsParent() {
        return isParent;
    }

    public void setIsParent(Boolean isParent) {
        this.isParent = isParent;
    }

    public Integer getSort() {
        return sort;
    }

    public void setSort(Integer sort) {
        this.sort = sort;
    }
}

4.添加表示层、dao层、业务层代码：

• 打开item-service，创建如下的目录结构：
  
• dao层代码：

package com.leyou.item.mapper;

import com.leyou.item.pojo.Category;
import tk.mybatis.mapper.common.Mapper;
//继承通用mapper类
public interface CategoryMapper extends Mapper<Category> {
}

• 业务层

package com.leyou.item.service;

import com.leyou.item.pojo.Category;
import com.leyou.item.mapper.CategoryMapper;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import java.util.List;

@Service
public class CategoryService {

    @Autowired
    private CategoryMapper categoryMapper;

    /**
     * 根据父节点查询子节点
     * @param pid
     * @return
     */
    public List<Category> queryCategoriesByPid(Long pid){
        Category record = new Category();
        record.setParentId(pid);
        return this.categoryMapper.select(record);
    }
}

• 表示层（添加了错误返回状态码）：

package com.leyou.item.Controller;

import com.leyou.item.pojo.Category;
import com.leyou.item.service.CategoryService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.ResponseEntity;
import org.springframework.stereotype.Controller;
import org.springframework.util.CollectionUtils;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;

import java.util.List;

@Controller
@RequestMapping("category")
public class CategoryController {
    @Autowired
    private CategoryService categoryService;

    /**
     * 根据父节点的id查询子节点
     * @param pid
     * @return
     */
    @GetMapping("list")
    public ResponseEntity<List<Category>> queryCategoriesByPid(@RequestParam(value = "pid",defaultValue = "0")Long pid){
        if (pid == null || pid < 0) {
            //400:参数不合法
            //return ResponseEntity.status(HttpStatus.BAD_REQUEST).build();
            //return new ResponseEntity<>(HttpStatus.BAD_REQUEST);
            return ResponseEntity.badRequest().build();
        }
        List<Category> categories = this.categoryService.queryCategoriesByPid(pid);
        if (CollectionUtils.isEmpty(categories)) {
            //404：资源服务器未找到
            //return ResponseEntity.status(HttpStatus.NOT_FOUND).build();
            return ResponseEntity.notFound().build();
        }
        //200：查询成功
        return ResponseEntity.ok(categories);
    }
}

5.修改hosts文件：

• 由于前端的请求路径为：
  
• 所以我们还要去系统的hosts里添加api.leyou.com的域名：
  
• 但是这样访问不同端口、不同域名会产生跨域问题。

6.服务端编写解决跨域问题代码：

• 在leyou-gateway（网关）里添加LeyouCorsConfiguration.class:
  
• LeyouCorsConfiguration.class代码：

package com.leyou.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.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;

@Configuration
public class LeyouCorsConfiguration {

    @Bean
    public CorsFilter corsFilter(){

        //初始化cors配置对象
        CorsConfiguration configuration = new CorsConfiguration();
        //允许跨域的域名，可以使用*来表示允许所有域名跨域访问
        configuration.addAllowedOrigin("http://manage.leyou.com");
        //是否允许携带cookie，如果允许则跨域域名不能使用*
        configuration.setAllowCredentials(true);
        configuration.addAllowedMethod("*");  //代表所有请求方法：get/post...
        configuration.addAllowedHeader("*");  //允许携带任何头信息


        //初始化cors配置源对象
        UrlBasedCorsConfigurationSource configurationSource = new UrlBasedCorsConfigurationSource();
        configurationSource.registerCorsConfiguration("/**",configuration);


        //返回corsFilter实例，参数：cors配置源对象
        return new CorsFilter(configurationSource);
    }
}

7.最后启动eureka注册中心(leyou-tegistry)、zuul网关(leyou-gateway)、业务模块（leyou-item）、后台前端页面：

• 打开商品分类：
  
• 显示成功。