跨域问题经常需要面对,前端需要做的比较直接
要么选择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方式跨域提交同样适用

原文地址:https://segmentfault.com/a/1190000016979232

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

  1. WordPress搭建教程---购买域名+购买VPS主机+域名DNS解析+网站环境+上传网站程序

    WordPress搭建教程 购买域名---NameSilo 购买VPS主机---Vultr 域名DNS解析 网站环境 上传网站程序 参考文章: 1. WordPress搭建教程 https://zhu ...

  2. vue+Ueditor集成 [前后端分离项目][图片、文件上传][富文本编辑]

    后端DEMO:https://github.com/coderliguoqing/UeditorSpringboot 前端DEMO:https://github.com/coderliguoqing/ ...

  3. form表单上传域(type="file")的使用----上传文件

    一,单个文件的上传 1.html/jsp页面 <%@ page language="java" contentType="text/html; charset=UT ...

  4. 七牛---以一个七牛上传的实例小结下AJAX跨域【转】

    http://blog.csdn.net/netdxy/article/details/50699842 使用七牛过程中,很多用户或多或少遇到跨域的问题,这篇文章主要介绍下跨域的概念来看什么情况下会出 ...

  5. spring mvc 图片上传,图片压缩、跨域解决、 按天生成文件夹 ,删除,限制为图片代码等相关配置

    spring mvc 图片上传,跨域解决 按天生成文件夹 ,删除,限制为图片代码,等相关配置 fs.root=data/ #fs.root=/home/dev/fs/ #fs.root=D:/fs/ ...

  6. 【转】php通过curl跨域向asp.net服务器上传文件及参数

    转:http://blog.sina.com.cn/s/blog_13331dce50102vq32.html 这是一个由php通过调用asp.net接口向asp.net服务器post上传文件及参数并 ...

  7. easy ui 异步上传文件,跨域

    easy ui 跨域上传文件,代码如下: 1.html代码:(这段代码是个win窗体,我在点击上传图片按钮然后弹出一个上传图片的窗体,选择图片再进行上传,这样在form提交时,提交的参数会少一点.) ...

  8. kindedit,uedit 上传跨域返回

    1.kindedit 跨域上传图片的时候,a.com 上传到b.com接收图片服务器,然后返回图片地址. 2.一般如果不做任何处理是获取不到返回的信息的.原因是跨域了 3.所以一般在上传成功后,在跳转 ...

  9. Asp.Net Core 3.0 学习3、Web Api 文件上传 Ajax请求以及跨域问题

    1.创建Api项目 我用的是VS2019 Core3.1 .打开Vs2019 创建Asp.Net Core Web应用程序命名CoreWebApi 创建选择API 在Controller文件夹下面添加 ...

随机推荐

  1. Creative Cloud 安装出错,错误代码:207

    C:\Users\xxx\AppData\Local\Temp\CreativeCloud\ACC\AdobeDownload %Temp%\CreativeCloud\ACC\AdobeDownlo ...

  2. SQLServer 错误: 15404,维护计划无法执行

    错误症状: D:\Program Files\Microsoft SQL Server\MSSQL.1\MSSQL\LOG下面的ERROELOG,用文本打,查看运行维维计划不成功是生成的错误日志详细信 ...

  3. vue项目,封装api并使用

    封装api index.js let uploadBase = '' if(process.env.NODE_ENV === 'production'){ uploadBase = 'https:// ...

  4. POJ 3134 Power Calculus (迭代剪枝搜索)

    题目大意:略 题目里所有的运算都是幂运算,所以转化成指数的加减 由于搜索层数不会超过$2*log$层,所以用一个栈存储哪些数已经被组合出来了,不必暴力枚举哪些数已经被搜出来了 然后跑$iddfs$就行 ...

  5. LAMP环境搭建备忘 -- Apache、pHp 安装 (二)

    上一篇 Linux 已经安装好了,我们选择了 CentOS 7 的最小化安装,即没有图形界面,并且我们在安装时设置了网络连接即能够连上外部网络,还设置了 root 密码.下面我们要在此基础上继续安装 ...

  6. [vue插件]基于vue2.x的电商图片放大镜插件

    最近在撸一个电商网站,有一个需求是要像淘宝商品详情页那样,鼠标放在主图上,显示图片放大镜效果,找了一下貌似没有什么合适的vue插件,于是自己撸了一个,分享一下.小白第一次分享,各位大神莫见笑. vue ...

  7. 配置 IntelliJ IDEA VM options

    今天在使用maven build flex 项目的时候,build failure ,查看log后发现[ERROR] Java heap space. 原来是内存不够了.需要修改maven的运行时内存 ...

  8. 通过HttpURLConnection 上传和下载文件(二)

    HttpURLConnection文件上传 HttpURLConnection采用模拟浏览器上传的数据格式,上传给服务器 上传代码如下: package com.util; import java.i ...

  9. Docker_入门?只要这篇就够了!(纯干货适合0基础小白)

    与sgy一起开启你的Docker之路 关键词: Docker; mac; Docker中使用gdb无法进入断点,无法调试; 更新1: 看起来之前那一版博文中参考资料部分引用的外站链接太多,被系统自动屏 ...

  10. ADT+NDK搭建jni编译环境

    jni是android调用C++编写的库的接口.C++和java的差别不在此文的讨论范畴,另外这里也仅仅是记录下.怎样搭建好开发环境. 首先是下载ADT包和NDK包. ADT包包括了eclipse.所 ...