狼行天下3 - 前端页面添加+跨域配置

资料

链接：https://pan.baidu.com/s/1fQCdMrHcA6FP62jigbGZsQ?pwd=1234 
提取码：1234

一.前端页面添加

然后放到resources目录下 

在trip-web-site下的resources中创建static目录,然后将前端文件放入

二.跨域配置 

跨域配置是用在前后端项目中,解决浏览器因同源策略(url要求一致)引起跨域问题导致前端访问不到后端(端口号不一致);

此项目中,前台程序(trip-website和trip-website-api)是前后端分离项目,所以需要配置跨域;

可以通过在controller上面加@CrossOrigin注解,但这样需要一个个配置太麻烦,所以我们在trip-website-api下的启动类(WebsiteApp)上(或者写个配置类也行,这里因为启动类本身就是一个配置类,所以直接写启动类上了)进行统一配置跨域:

package com.example;

import org.mybatis.spring.annotation.MapperScan;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.context.annotation.Bean;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;


@SpringBootApplication
@MapperScan("com.example.mapper")
public class WebsiteApiApp {
    public static void main(String[] args) {
        SpringApplication.run(WebsiteApiApp.class, args);
    }
    //跨域访问
    @Bean
    public WebMvcConfigurer corsConfigurer() {
        return new WebMvcConfigurer() {
            @Override
            //重写父类提供的跨域请求处理的接口
            public void addCorsMappings(CorsRegistry registry) {
                //添加映射路径
                registry.addMapping("/**")
                        //放行哪些原始域
                        .allowedOrigins("*")
                        //是否发送Cookie信息
                        .allowCredentials(true)
                        //放行哪些原始域(请求方式)
                        .allowedMethods("GET", "POST", "PUT", "DELETE","OPTIONS")
                        //放行哪些原始域(头部信息)
                        .allowedHeaders("*")
                        //暴露哪些头部信息（因为跨域访问默认不能获取全部头部信息）
                        .exposedHeaders("Header1", "Header2");
            }
        };
    }
}