服务端配置解决前端访问出现跨域的问题

第一种办法:
@Configuration
public class CorsConfig implements WebMvcConfigurer {
    
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**").allowedOriginPatterns("*").allowCredentials(true).allowedMethods("*").maxAge(3600);
    }

}

第二种办法:
@Configuration
public class CorsConfig {
    
    /**
     * 允许任何域名使用
     * 允许任何头
     * 允许任何方法(post、get等)
     */
    private CorsConfiguration buildConfig() {
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        corsConfiguration.addAllowedOrigin("*");
        corsConfiguration.addAllowedHeader("*");
        corsConfiguration.addAllowedMethod("*");
        // allowCredential 需设置为true
        corsConfiguration.setAllowCredentials(true);
        return corsConfiguration;
    }

    @Bean
    public CorsFilter corsFilter() {
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", buildConfig());
        return new CorsFilter(source);
    }
}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
前端页面中嵌入了来自其他域名的 iframe 时,由于浏览器的同源策略,iframe 中的页面无法直接访问父页面的 DOM,也无法与父页面进行通信。为了解决这个问题,可以通过代理页面来实现跨域访问。 具体实现步骤如下: 1. 在同域名下创建一个代理页面,例如 proxy.html。 2. 在代理页面中使用 JavaScript 代码获取 iframe 中页面的内容,并将其渲染到代理页面中。 3. 配置代理页面的服务端,使其能够将获取到的 iframe 页面内容返回给前端页面。 4. 在前端页面中嵌入代理页面,并通过代理页面的 URL 来访问 iframe 中的内容。 示例代码: proxy.html ```html <html> <head> <script> window.onload = function() { var iframe = document.createElement("iframe"); iframe.src = "http://otherdomain.com/page.html"; // 要访问的 iframe 页面 URL document.body.appendChild(iframe); iframe.onload = function() { var iframeDoc = iframe.contentWindow.document; var iframeContent = iframeDoc.documentElement.innerHTML; // 获取 iframe 页面内容 document.documentElement.innerHTML = iframeContent; // 渲染 iframe 页面内容到代理页面中 }; }; </script> </head> <body></body> </html> ``` 服务端代码(Node.js): ```javascript const http = require("http"); const request = require("request"); http .createServer((req, res) => { const url = "http://otherdomain.com/page.html"; // 要访问的 iframe 页面 URL request(url, (error, response, body) => { if (!error && response.statusCode === 200) { res.writeHead(200, { "Content-Type": "text/html" }); res.end(body); // 将获取到的 iframe 页面内容返回给前端页面 } }); }) .listen(8080); ``` 在前端页面中嵌入代理页面: ```html <iframe src="http://localhost:8080/proxy.html"></iframe> <!-- 代理页面 URL --> ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值