RuoYi -Cloud开源框架-跨域配置

Posted 小黄鸭技术

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了RuoYi -Cloud开源框架-跨域配置相关的知识,希望对你有一定的参考价值。

🦆博主介绍:小黄鸭技术

🌈擅长领域:Java、实用工具、运维

👀 系列专栏:📢开发工具 Java之路 八股文之路

📧如果文章写作时有错误的地方,请各位大佬指正,一起进步!!!

🧡欢迎大家点赞➕收藏⭐➕评论💬支持博主🤞  

目录

 什么是跨域

RoYi-Cloud如何解决跨域

            💖 配置方式

代码方式                

Nginx反向代理方式

参数解析


什么是跨域

        简单来说就是违背了浏览器的同源策略,指协议,域名,端口都要相同,其中有一个不同都会产生跨域。

RoYi-Cloud如何解决跨域

配置方式:

                通过在gateway的nacos中的gateway.yml添加以下配置

spring:
  cloud:
    gateway:
      globalcors:
        corsConfigurations:
          '[/**]':
            allowedOriginPatterns: "*"
            allowed-methods: "*"
            allowed-headers: "*"
            allow-credentials: true
            exposedHeaders: "Content-Disposition,Content-Type,Cache-Control"

代码方式:                

                在gateway项目中新增CorsConfig.java

package com.ruoyi.gateway.config;

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.http.HttpHeaders;
import org.springframework.http.HttpMethod;
import org.springframework.http.HttpStatus;
import org.springframework.http.server.reactive.ServerHttpRequest;
import org.springframework.http.server.reactive.ServerHttpResponse;
import org.springframework.web.cors.reactive.CorsUtils;
import org.springframework.web.server.ServerWebExchange;
import org.springframework.web.server.WebFilter;
import org.springframework.web.server.WebFilterChain;
import reactor.core.publisher.Mono;

/**
 * 跨域配置
 * 
 * @author ruoyi
 */
@Configuration
public class CorsConfig

    /**
     * 这里为支持的请求头,如果有自定义的header字段请自己添加
     */
    private static final String ALLOWED_HEADERS = "X-Requested-With, Content-Type, Authorization, credential, X-XSRF-TOKEN, token, Admin-Token, App-Token";
    private static final String ALLOWED_METHODS = "GET,POST,PUT,DELETE,OPTIONS,HEAD";
    private static final String ALLOWED_ORIGIN = "*";
    private static final String ALLOWED_EXPOSE = "*";
    private static final String MAX_AGE = "18000L";

    @Bean
    public WebFilter corsFilter()
    
        return (ServerWebExchange ctx, WebFilterChain chain) -> 
            ServerHttpRequest request = ctx.getRequest();
            if (CorsUtils.isCorsRequest(request))
            
                ServerHttpResponse response = ctx.getResponse();
                HttpHeaders headers = response.getHeaders();
                headers.add("Access-Control-Allow-Headers", ALLOWED_HEADERS);
                headers.add("Access-Control-Allow-Methods", ALLOWED_METHODS);
                headers.add("Access-Control-Allow-Origin", ALLOWED_ORIGIN);
                headers.add("Access-Control-Expose-Headers", ALLOWED_EXPOSE);
                headers.add("Access-Control-Max-Age", MAX_AGE);
                headers.add("Access-Control-Allow-Credentials", "true");
                if (request.getMethod() == HttpMethod.OPTIONS)
                
                    response.setStatusCode(HttpStatus.OK);
                    return Mono.empty();
                
            
            return chain.filter(ctx);
        ;
    

nginx反向代理方式:

location /api 
    add_header Access-Control-Allow-Origin http://localhost:3000 always;
    add_header Access-Control-Allow-Headers "Accept,Accept-Encoding,Accept-Language,Connection,Content-Length,Content-Type,Host,Origin,Referer,User-Agent";
    add_header Access-Control-Allow-Methods "GET, POST, PUT, OPTIONS";
    add_header Access-Control-Allow-Credentials true;
    if ($request_method = 'OPTIONS') 
        return 200;
    
    proxy_cookie_domain ~\\.?duck.com $host;
    proxy_pass https://duck.com;

参数解析

allowedOriginPatterns: 放行域名,可以多个,用","分割

allowed-methods: 放行请求方式,可以多个,例如

"GET", "HEAD", "POST", "PUT", "DELETE", "OPTIONS", "PATCH"

allowed-headers: 放行头部信息

allow-credentials: 是否发送Cookie信息

exposedHeaders: 暴露哪些头部信息(因为跨域访问默认不能获取全部头部信息)

🧡欢迎大家点赞➕收藏⭐➕评论💬支持博主🤞   

利用 Ruoyi 开发自己的业务管理系统__测试结构完成

前言铺垫不多说

(1)Ruoyi这个平台不错;如果你觉得你比Ruoyi的作者牛逼,你就不用看我这个文章了,你可以走了,因为我自认为比Ruoyi的作者要烂;

(2)必须已经成功搭建Ruoyi,并能在自己机器上运行正常。如果没有搭建完成,我的博客里有,你自己找怎么搭建;

正文开始

我利用 Ruoyi 现有平台和他的自动生成代码工具,做了一个简单的 CURD ,效果如下图

没做修饰,直接用平台代码做的前台画面,所以有NULL之类,也正常;有关这个null后续我会解释;

 

技术图片

 

步骤:

(1)最早我是用Eclipse跑的Ruoyi,跑起来了,也正常运行了,所以我想用股票代码表为例,创建一个简单的增删改查

用它的代码生成功能;

大家注意我的表名称

 

技术图片

注意包的路径

技术图片

 

原本我以为用 用Maven创建一个新的Maven Module ,直接挂到总的 POM.XML文件中就好了,其实没有那么简单:

 

(1)POM.XML文件的修改

我是用Eclipse创建的 Maven Module ,名字就叫 ruoyi-stock

项目总的POM.XML要添加我的模块

 

技术图片

 

 

(2)原来的 ruoyi-admin 也要做一个依赖,把我的模块加入;

技术图片

 

(3)把JAVA文件放入 ruoyi-admin 对应的JAVA类下,一定要注意路径: 

需要强调的是,按照我这种配置,一定要:

把Controller类放在ruoyi-admin中,尽量上按照 ruoyi-admin 的路径来,都放在 ruoyi-admin 下面的 web下(注意下图的路径),否则项目启动会找不到

对应的HTML文件,我也没有做任何修改,直接也放到 ruoyi-admin 对应的资源下面了,

技术图片

 

对相应JAVA中的包的路径,就不用我说了,手动改下吧。

要强调的是 要在controller类中,加入@Component

要在service的实现类中加入@service

 

技术图片

技术图片

 

 

(4) 我自己后建的 ruoyi-stock ,除了POM.XML 就剩一个 StockCodeMapper.xml文件了

要注意:这个XML文件中,映射的类的路径,要改成对应 ruoyi-admin 中的类的路径及类名称(因为JAVA对应的类路径不在与生成时一样了)

 

 技术图片

 

 总结:

(1)因为不太了解这个Ruoyi的架构,以为会按照Maven模块启动的依赖关系来,把Controller放在ruoyi-stock文件中,是不会被启动的;

原因很简单:SpringBoot按照文件夹的路径来;不会跨文件夹;

这样让我疑惑的是,那么 Maven 仅仅是起到了包引用的作用,其他不管?

(2)因为生成的Service类,没有@Service注释,Controller类没有那个  @Component 注释,导致无法被注入;

同样还有一个疑问,就是 别的对应的业务的 service类、service实现类、Domain类,为什么可以放在自己的文件夹中?

 

总之,我还算弄出来了,至少给自己一个交代了。

先记录到这吧。

 

扩展:

很早之前,我自己为了接私活方便,自己做了一个基于Spring+Struts2+IBatis框架的,自动生成所有代码脚本的一个小工具;

最早提出这个思路的哥们,他和我既是高中同学,又是公司同事,不过他后来辞职离开了,不久我也离开了;

我接着他最早的思路,做了这个自动生成工具,恰好自己又接了私活,一边做私活,一边对这个工具进行迭代开发,的确为我省了不少时间;

后来我再接私活时,确定大概业务后,我直接就用那个工具把所有代码生成一遍,所有的增删改查基本功能就弄好了,然后再到具体页面中勾连具体的功能;

相对来说,大大节省了时间;

所以,看到Ruoyi目前这些个功能,还是让我兴奋了一把;

慢慢弄吧,反正我不着急;

以上是关于RuoYi -Cloud开源框架-跨域配置的主要内容,如果未能解决你的问题,请参考以下文章

ruoyi后台管理系统分析

RuoYi 若依后台管理系统-学习笔记-忘记密码

ruoyi 去除页面登录限制

ruoyi分页优化方案

ruoyi 去除页面登录限制

ruoyi 去除页面登录限制