首页 > 其他分享 >laravel 跨域

laravel 跨域

时间:2024-01-24 11:12:55浏览次数:27  
标签:laravel Origin 跨域 Access header CorsMiddleware Allow

laravel怎么设置跨域(两种方法)

在前后端分离的项目中,前端请求后端接口时可能会遇到跨域的问题。其中,一个典型的场景是:前端项目运行在 http://localhost:8080,而后端项目运行在 http://localhost:8000,这时候就需要设置跨域。

在 Laravel 中,要设置跨域可以采用以下两种方法。

1、中间件方式(已测试验证)

先创建一个中间件 CorsMiddleware

php artisan make:middleware CorsMiddleware

在 CorsMiddleware 中处理跨域:

<?php

namespace App\Http\Middleware;

use Closure;
use Illuminate\Http\Request;

class CorsMiddleware
{
    /**
     * Handle an incoming request.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \Closure(\Illuminate\Http\Request): (\Illuminate\Http\Response|\Illuminate\Http\RedirectResponse)  $next
     * @return \Illuminate\Http\Response|\Illuminate\Http\RedirectResponse
     */
    public function handle(Request $request, Closure $next)
    {
        $origin = $request->header('Origin') ?: '*';

        header('Access-Control-Allow-Origin:' . $origin);
        header('Access-Control-Allow-Headers:Origin,Content-Type,Authorization');
        header('Access-Control-Allow-Methods:GET,POST,PUT,DELETE,OPTIONS');
        return $next($request);
    }
}

  该中间件会在 Http/Kernel.php 中的 $middleware 数组中注册:

    protected $middleware = [
       .....
        \App\Http\Middleware\CorsMiddleware::class,
    ];

这时候 Laravel 将在响应头中添加 Access-Control-Allow-Origin 等跨域相关的信息

2、Laravel-cors 扩展包

参考如下: (这种没有经过我测试验证)

标签:laravel,Origin,跨域,Access,header,CorsMiddleware,Allow
From: https://www.cnblogs.com/andydao/p/17984169

相关文章

  • 接口数据传递中的跨域问题
    跨域问题产生原因原因大部分浏览器自带的保护措施,限制用户在一个域名下请求另一个域名的数据一、关于跨域跨域对于前后端开发者来说,就像一块狗皮膏药,无论是面试还是开发中,都会经常遇到。之所以出现跨域问题,是因为浏览器的同源策略,为了隔离潜在的恶意文件,为了防御来自歪门邪......
  • nginx配置支持ws,并解决跨域
    修改配置文件nginx.confserver{listen443ssl;server_nameexcalidraw.haimaotv.com;ssl_certificate/opt/nginx-1.24.0/excalidraw.haimaotv.com_bundle.crt;ssl_certificate_key/opt/nginx-1.24.0/excalidraw.haimaotv.com.key;ssl_se......
  • laravel collect结果集group分组合并数据
    1、需求将相同apply_id的apply_remark用;拼接$r=[['apply_id'=>1,'apply_remark'=>'xxx'],['apply_id'=>1,'apply_remark'=>'xxx2'],['apply_id'=>2......
  • 跨域问题
    浏览器同源策略:协议、域名、端口全都必须相同,作用是防止一些攻击类型; 问题还原:  在浏览器中输入http://localhost:8080启动了前端项目,在页面上进行点击发送请求给后端,但此时该请求路径为http://localhost:8081/list,故发生了跨域;注意此时后端接口仍能正常响应数据,只是浏......
  • net6 webapi cors 跨域
    1、nuget安装microsoft.aspnetcore.cors2、program.cs文件中usingSystem.Reflection;usingMicrosoft.OpenApi.Models;varbuilder=WebApplication.CreateBuilder(args);//设置跨域builder.Services.AddCors(options=>{options.AddPolicy("Cors",builder......
  • 前后端分离,Asp.net core webapi 简单 2 步,轻松配置跨域
    前言可以说,前后端分离已经成为当今信息系统项目开发的主流软件架构模式,微服务的出现,让前后端分离发展更是迅速,大量优秀的前端框架如vue.js、react的出现,也让前后端分离趋势加快。所谓的前后端分离软件架构模式,就是指将前端和后端的开发完全分离,后端负责提供API接口和数据处理......
  • 处理跨域请求的API接口数据
     在Web开发中,跨域请求是一个常见的问题。由于浏览器的安全策略限制,JavaScript在发送HTTP请求时只能访问同源下的资源,即协议、域名、端口号都必须一致。然而,有时我们需要从不同域名下获取数据,这就涉及到了跨域请求的问题。为了解决这个问题,我们可以使用API接口来处理跨域请求。......
  • 前端跨域三种解决方式(CORS、JSONP、代理跨域)
    什么是跨域?跨域是浏览器为了安全而作出的限制策略(所以服务端不涉及到跨域);浏览器请求必须遵循同源策略,即同域名、同端口、同协议;例如:http://www.abc.com到http://www.def.com的请求会出现跨域(域名不同)http://www.abc.com:3000到http://www.abc.com:3001的请求会出现跨域(端口不同......
  • NGINX 路由配置与参数详解(https配置、跨域配置、socket配置)
    目录一、概述二、https配置1)获取SSL证书2)安装SSL证书3)Nginx配置修改4)重新加载Nginx配置三、nginx跨域配置四、nginxsocket配置五、NGINX路由配置1)基本的URI匹配2)nginx中斜杠(/)1、location以斜杠结尾,proxy_pass不以斜杠结尾2、location不以斜杠结尾,proxy_pass......
  • Spring Boot3 系列:Spring Boot3 跨域配置 Cors
    目录什么是CORS?SpringBoot如何配置CORS?前端代码注解配置全局配置过滤器配置注意事项什么是CORS?CORS,全称是“跨源资源共享”(Cross-OriginResourceSharing),是一种Web应用程序的安全机制,用于控制不同源的资源之间的交互。在Web应用程序中,CORS定义了一种机制,通过该机制,浏览器能......