允许多域名跨域 php,php后端控制可跨域的域名,允许图片跨域上传

跨域问题经常需要面对，前端需要做的比较直接

要么选择ajax异步提交，XML或者jsonp，要么表单提交

jsonp基本可以搞定大部分跨域问题，但问题也比较明显，只能通过get方式提交

并且jsonp是通过把参数拼到URL上提交请求的

但是所有浏览器有URL长度限制，不同浏览器长度限制不一样

当出现要提交大段落内容的时候，比如说文章，用jsonp的话超出长度只能分割提交

很麻烦，而且说到底对安全性有些影响

而且axiox现在也不支持jsonp了，虽然有方式解决

尤其是图片类的资源上传，无法很好的用jsonp之类的方法实现

需要图片上传跨域的场景

当然可以不跨域最好不跨域，但是目前大部分项目都已经前后端分离了

静态资源和接口分别是不同的域名或者二级域名，这样就涉及到了跨域

如果是资源上传，跨域的时候需要后端Access-Control-Allow-Origin和当前请求的Origin一样,不能设置为*

php解决方法

如果是传统数据请求，那后端直接将Access-Control-Allow-Origin设置为*就好

header('Access-Control-Allow-Origin:*');

但图片之类的资源上传Origin需要跟Access-Control-Allow-Origin的值一样

如果设置Access-Control-Allow-Origin跟当前的Origin一样的话就限制死了能上传的域名只有一个

要有其他域名需要调用这个接口的话就会被禁止

所以最好的方法就是限定能够调用这个接口的域名列表，也提高了一定的安全性

做法就是先获取当前请求的Origin，如果在允许访问的域名列表里

就将Access-Control-Allow-Origin的值设置为当前请求的Origin

$originList = [

'http://127.0.0.1',

'http://www.linkvall.cn',

'http://mobile.linkvall.cn',

];

if(in_array($_SERVER['HTTP_ORIGIN'], $originList)){

header('Access-Control-Allow-Origin:'.$_SERVER['HTTP_ORIGIN']);

header("Access-Control-Allow-Credentials: true");

header('Access-Control-Allow-Headers:x-requested-with,content-type');

header("Access-Control-Allow-Methods: POST,GET，OPTIONS");

}

这样就能控制可以跨域的域名了，图片类资源就能像同域一样开心的上传上来了

post方式跨域提交同样适用

允许多域名跨域 php,php后端控制可跨域的域名,允许图片跨域上传相关推荐

前后端分离微服务管理系统项目实战SaaS-HRM项目(九)——文件上传与PDF报表入门
文章目录九.文件上传与PDF报表入门 1.图片上传 <1>.Data URL (1).概述 (2).入门 (3).基本原理 (4).优缺点分析 <2>.实现用户头像上传 2. ...
Vue3.0中WangEditor本地上传图片（解决跨域问题，后端返回问题）
官方文档:http://www.wangeditor.com/ 编辑器自带上传网络链接图片本地上传图片需要自己设置效果: 注意事项: 1.自定义上传方法来上传图片,使用FromData对象来传参,但 ...
SpringMvc+ajax实现文件跨域上传
最近开始学习SpringMVC框架,在学习数据绑定的时候,发现可以使用@RequestParam注解绑定请求数据,实现了文件上传.但是如果一个项目是前后端分离的,前端系统向后端服务上传文件该怎么解决了 ...
axios nodejs 上传图片_Vue Axios跨域、文件上传
本文以vue-cli中使用axios为例安装 npm install --save axios 引用(注册到VUE实例中) import Vue from 'vue' import Axios fr ...
解决Canvas.toDataURL 图片跨域问题
解决Canvas.toDataURL 图片跨域问题参考文章: (1)解决Canvas.toDataURL 图片跨域问题 (2)https://www.cnblogs.com/ajg016/p/547 ...
图片上传的两种方式（前端和后端）
1:前端 HTML: <html> <script type="text/javascript" src="js/jquery-3.1.1.min.js ...
SpringBoot上传文件到后端服务器或云服务器（七牛云、阿里云、腾讯云等等都是一样的操作步骤）
文章目录一.新建SpringBoot项目 1.pom.xml 2.application.yml 3.配置Swagger3 4.统一返回类Result 5.统一异常响应ErrorCode 二.上传文 ...
spring boot+iview 前后端分离架构之文件上传的实现（三十一）
spring boot 与 iview 前后端分离架构之文件上传的实现(三十一) 公众号文件上传前端改造 main.js引入配置的全局变量编写baseImgUpload图片上传组件 baseIm ...
UEditor 富文本编辑器-后端实现文件上传功能
一.背景前端使用 UEditor 富文本编辑器,前后端分离情况下,需要后端提供一个接口实现文件上传功能本文根据文章:vue+Ueditor集成 [前后端分离项目][图片.文件上传][富文本编辑] ...

允许多域名跨域 php,php后端控制可跨域的域名,允许图片跨域上传

允许多域名跨域 php,php后端控制可跨域的域名,允许图片跨域上传相关推荐

最新文章

热门文章