Laravel API 允许跨域访问
服务器A请求服务器B的接口,那么一般会出现跨域问题。全解跨域请求处理办法
XMLHttpRequest cannot load http://api.console.vms3.com/api/user. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' istherefore not allowed access.
意思就是服务器响应不允许跨域访问.
那我们就需要让服务器支持跨域访问, 也就是在响应头部中添加
```'Access-Control-Allow-Origin: *'
```
第一步: 创建中间件
创建 `app/Http/Middleware/AccessControlAllowOrigin.php` middleware 把 'Access-Control-Allow-Origin: *' 写入头部.
app/Http/Middleware/AccessControlAllowOrigin.php
<?php
namespace App\Http\Middleware;
use Closure;
use Illuminate\Support\Facades\Auth;
class AccessControlAllowOrigin
{
/**
*
* Handle an incoming request.
*
* @param \Illuminate\Http\Request $request
* @param \Closure $next
* @return mixed
*/
public function handle($request, Closure $next)
{
header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Credentials: true");
header("Access-Control-Allow-Methods: *");
header("Access-Control-Allow-Headers: Content-Type,Access-Token");
header("Access-Control-Expose-Headers: *");
return $next($request);
}
}
第二步: 注册路由
注册这个 middleware
到 kernel
中.
分别在 protected $middleware
数组中和 protected $routeMiddleware
数组中
添加我们刚才创建的那个文件class
名, 使用 cors
这个别名.
第三步: 设置中间件保护接口
然后在设置它保护 api , 就是$middlewareGroups['api']
的数组中添加它的别名, 本文中是 'cors'
app/Http/Kernel.php
<?php
namespace App\Http;
use Illuminate\Foundation\Http\Kernel as HttpKernel;
class Kernel extends HttpKernel
{
/**
* The application's global HTTP middleware stack.
*
* These middleware are run during every request to your application.
*
* @var array
*/
protected $middleware = [
\Illuminate\Foundation\Http\Middleware\CheckForMaintenanceMode::class,
\Illuminate\Foundation\Http\Middleware\ValidatePostSize::class,
\App\Http\Middleware\TrimStrings::class,
\Illuminate\Foundation\Http\Middleware\ConvertEmptyStringsToNull::class,
\App\Http\Middleware\AccessControlAllowOrigin::class,
];
/**
* The application's route middleware groups.
*
* @var array
*/
protected $middlewareGroups = [
'web' => [
\App\Http\Middleware\EncryptCookies::class,
\Illuminate\Cookie\Middleware\AddQueuedCookiesToResponse::class,
\Illuminate\Session\Middleware\StartSession::class,
// \Illuminate\Session\Middleware\AuthenticateSession::class,
\Illuminate\View\Middleware\ShareErrorsFromSession::class,
\App\Http\Middleware\VerifyCsrfToken::class,
\Illuminate\Routing\Middleware\SubstituteBindings::class,
],
'api' => [
'throttle:60,1',
'bindings',
'cors'
],
];
/**
* The application's route middleware.
*
* These middleware may be assigned to groups or used individually.
*
* @var array
*/
protected $routeMiddleware = [
'auth' => \Illuminate\Auth\Middleware\Authenticate::class,
'auth.basic' => \Illuminate\Auth\Middleware\AuthenticateWithBasicAuth::class,
'bindings' => \Illuminate\Routing\Middleware\SubstituteBindings::class,
'can' => \Illuminate\Auth\Middleware\Authorize::class,
'guest' => \App\Http\Middleware\RedirectIfAuthenticated::class,
'throttle' => \Illuminate\Routing\Middleware\ThrottleRequests::class,
'cors' => \App\Http\Middleware\AccessControlAllowOrigin::class,
];
}
第四步:在路由中添加路由
Route::middleware('cors')->group(function () {
//
});
原文地址:https://segmentfault.com/a/1190000016815828
Laravel API 允许跨域访问的更多相关文章
- ASP.net Web API允许跨域访问解决办法
来源 http://blog.csdn.net/wxg_kingwolfmsncn/article/details/48545099 遇到此跨域访问问题,解决办法如下: 方法一: 1. 在we ...
- AngulaJs+Web Api Cors 跨域访问失败的解决办法
//在服务的WebConfig文件中添加以下代码即可 //如节点已存在请去掉 <system.webServer> <httpProtocol> <customHeade ...
- ASP.NET Web API 启用跨域访问
自定义特性 要在WebApi中实现JSONP,一种方式是实现自定义特性 http://stackoverflow.com/questions/9421312/jsonp-with-asp-net-w ...
- 在dotnet core web api中支持CORS(跨域访问)
最近在写的Office add-in开发系列中,其中有一个比较共性的问题就是在add-in的客户端脚本中访问远程服务时,要特别注意跨域访问的问题. 关于CORS的一些基本知识,请参考维基百科的说明:h ...
- Laravel API跨域访问的实现步骤
本篇文章给大家带来的内容是关于Laravel API跨域访问的实现步骤,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 服务器A请求服务器B的接口,那么一般会出现跨域问题. 1 XML ...
- 支持Ajax跨域访问ASP.NET Web Api 2(Cors)的简单示例教程演示
随着深入使用ASP.NET Web Api,我们可能会在项目中考虑将前端的业务分得更细.比如前端项目使用Angularjs的框架来做UI,而数据则由另一个Web Api 的网站项目来支撑.注意,这里是 ...
- ArcGIS API for Silverlight 调用WebService出现跨域访问报错的解决方法
原文:ArcGIS API for Silverlight 调用WebService出现跨域访问报错的解决方法 群里好几个朋友都提到过这样的问题,说他们在Silverlight中调用了WebServi ...
- 如何让你的 Asp.Net Web Api 接口,拥抱支持跨域访问。
由于 web api 项目通常是被做成了一个独立站点,来提供数据,在做web api 项目的时候,不免前端会遇到跨域访问接口的问题. 刚开始没做任何处理,用jsonp的方式调用 web api 接口, ...
- REST API之前端跨域访问
关键字:跨域访问,cross-origin, NodeJS, REST API, JavaScript, Access-Control-Allow-Origin 1.新建并运行一个 NodeJS的se ...
随机推荐
- crontab任务调度
基本语法 crontab [选项] 选项: -e: 编辑crontab定时任务 -l: 查询crontab任务 -r: 删除当前用户所有的crontab任务 2)参数说明 [root ...
- SpringMVC(二) 参数绑定 与 JSON
参数绑定 http请求传输的参数都是String类型,但是Hanlder业务方法中的参数都是我们指定的数据类型,如int,Object等,所以需要处理参数的类型转换.此项工作不需要我们开发人员去完成, ...
- (转载)Android中的Service:Binder,Messenger,AIDL(2)
前言 前面一篇博文介绍了关于Service的一些基本知识,包括service是什么,怎么创建一个service,创建了一个service之后如何启动它等等.在这一篇博文里有一些需要前一篇铺垫的东西,建 ...
- 理解 this.initialize.apply ( this, arguments )定义对象的一种方式
var Class = { create:function() { return function() { this.initialize.apply(this, arguments); }; } } ...
- img标签IE下有边距——2017/7/21
设置css 在全局变量的是和给img标签设置 img{ border:0;} 1,img{float:left}2,img{display:block}
- swift语言点评十三-Lazy
Lazy Stored Properties A lazy stored property is a property whose initial value is not calculated un ...
- 模块-时间模块(new)
模块-时间模块 导入: import time 方法: _STRUCT_TM_ITEMS __doc__ __loader__ __name__ __package__ __spec__ altzon ...
- hdu5321 beautiful set(莫比乌斯反演)
设\(cnt[i]\)为权值为i的倍数的数的数量. \(f0[i],f1[i]\)分别为两种方法\(gcd=i\)的贡献是i的多少倍. \(F0[i],F1[i]\)分别为两种方法\(gcd\)为\( ...
- 单机Mongo复制集安装配置(数据库版本:4.x)
官方文档: https://docs.mongodb.com/manual/tutorial/deploy-replica-set-with-keyfile-access-control/#dep ...
- 洛谷P5087 数学
DP. 设f[i][j]为前j个数中选i个数的所有组合的分数之和 决策: 不选这个数,得分为f[i][j - 1] 选这个数,得分为f[i - 1][j - 1] * a[j] 可以得到状态转移方程为 ...