学习搭建后台管理系统中遇到的问题和处理方法

学习梳理

前言

这两天在做毕业设计，需要自己写页面，由于之前只是简单的了解了一下html、css、js的标签和样式什么的，要拿来用的时候也忘得差不多了，而且只有这些也写不了一个好看点的页面，所以就去随便翻了一下，然后就去学vue，4h的视频教学，由于我要做的是管理员和商家后台部分内容，所以我找了vue-element-admin并下载了集成方案和基础模板。然后以下就是这段时间学习的梳理。

遇见的问题

问题一：vue-element-admin的安装

问题出现在安装依赖那一步上

# 安装依赖
npm install

# 建议不要用 cnpm 安装 会有各种诡异的bug 可以通过如下操作解决 npm 下载速度慢的问题
npm install --registry=https://registry.npm.taobao.org

我的操作有：

1、先卸载 npm uninstall node-sass，
2、重新安装 npm install --registry=[https://registry.npm.taobao.org](https://registry.npm.taobao.org/)
3、安装Nodejs
4、npm install webpack -g或者（npm install -g webpack）
5、npm install --global vue-cli
6、npm install vue-axious
7、在main.js中加入
    import axios from 'axios'
    import VueAxios from 'vue-axios'
    Vue.use(VueAxios,axios)

安装vue-admin-template则只需要第6和7步即可。

问题二：图片上传与显示

最重要的就是跨域问题了，我最终是用了基于过滤器的方式，再response中写入响应头。

import org.springframework.context.annotation.Configuration;

import javax.servlet.*;
import javax.servlet.annotation.WebFilter;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

@WebFilter(filterName = "CorsFilter ")
@Configuration
public class CorsFilter implements Filter {
    @Override
    public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
        HttpServletResponse response = (HttpServletResponse) res;
        response.setHeader("Access-Control-Allow-Origin","*");
        response.setHeader("Access-Control-Allow-Credentials", "true");
        response.setHeader("Access-Control-Allow-Methods", "POST, GET, PATCH, DELETE, PUT");
        response.setHeader("Access-Control-Max-Age", "3600");
        response.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
        chain.doFilter(req, res);
    }
}

一开始也有用**@CrossOrigin**注解加在controller上，但为了将图片保存在项目的静态资源路径下，我还是又配置了基于过滤器的方法去解决，同时还要在maven工程文件中加上支持，并在resource下新建static文件夹，在里面放图片（IDE为IDEA）

<dependency>
      <groupId>org.springframework.bootgroupId>
      <artifactId>spring-boot-starter-thymeleafartifactId>
dependency>

问题三：常识之String类型比较使用equals

问题四：idea+springboot的项目中静态资源如何更新？

热加载，``idea配置+spring-boot-devtools依赖``。