跨域复习(放松一下)

目录

问题描述

跨域是什么

解决跨域

解决图片上传阿里云跨域

图片不能回显的原因

解决

---

问题描述

从登录地址：http://localhost:8001 访问 网关地址：http://localhost:88/api/sys/login 端口号不同造成的跨域问题。

跨域是什么

解决跨域

@Configuration
public class GulimallCorsConfiguration {

    @Bean
    public CorsWebFilter corsWebFilter() {
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        // 1、配置跨域
        corsConfiguration.addAllowedHeader("*");
        corsConfiguration.addAllowedMethod("*");
        // 否则跨域请求会丢失cookie信息
        corsConfiguration.setAllowCredentials(true);
        corsConfiguration.addAllowedOrigin("*");
        //新版本使用addAllowedOriginPattern这个替代addAllowedOrigin
        //corsConfiguration.addAllowedOriginPattern("*");

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

解决图片上传阿里云跨域

配置阿里云post的所有请求都能跨域。

 

图片不能回显的原因

 1、图片能上传不回显，检查bucket名称与OSS客户端是否一致。

2、检查 singleUpload中action设置是否正确。

action为Bucket的外网访问域名，记得前面加上 http://

解决

解决方法1、在配置文件中配置的endpoint 加了前缀 http://，由于配置中心的配置文件会覆盖本地的文件，所以需要先把配置中心的配置删除，然后再检查本地配置文件中的endpoint

解决方法2、搜索show-file-list这个属性把里面绑定的换个名字，然后定义在data中的handleUploadSuccess方法中将它改为true就好啦。

解决方法3、查看一下引入的single-upload这个标签里面是不是没有v-model="dataForm.logo"

显示403则可以去后台延长OssController里的expireTime。同时注意singleUpload 注意 accessId 是大写的Id

上传成功

VUE插件查看