ajax 异步 跨域上传图片
客户端
<label for="text">名称</label>
<input type="text" id="text" name="name"/>
<label for="file">文件</label>
<input type="file" id="file" name="file"/>
<button type="button" onclick="ajaxUploadFile()">确定</button>
<script type="text/javascript">
function ajaxUploadFile(){
var formData = new FormData();
var xmlhttp;
if(window.XMLHttpRequest){//IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
}else{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("POST","http://upload.com/cors.php",true);
// xmlhttp.setRequestHeader("X-Requested-With","XMLHttpRequest");
formData.append("name",document.getElementById("text").value);
formData.append("file",document.getElementById("file").files[0]);
xmlhttp.send(formData);
xmlhttp.onreadystatechange = function(){
if(xmlhttp.readyState==4){
if(xmlhttp.status==200){
console.log("上传成功"+xmlhttp.responseText);//abc
}else{
console.log("上传失败"+xmlhttp.responseText);
}
}
}
}
</script>
服务端
header('Access-Control-Allow-Origin:*');//重要的跨域代码
move_uploaded_file($_FILES['file']['tmp_name'],dirname(__FILE__).'/cors.png');
echo 'abc';
ajax 异步 跨域上传图片的更多相关文章
- jQuery的ajax jsonp跨域请求
了解:ajax.json.jsonp.“跨域”的关系 要弄清楚以上ajax.json.jsonp概念的关系,我觉得弄清楚ajax是“干什么的”,“怎么实现的”,“有什么问题”,“如果解决存在的问题”等 ...
- JavaScript(10)——Ajax以及跨域处理
Ajax以及跨域处理 哈哈哈,终于写到最后一章了.不过也还没有结束,说,不要为了学习而学习,恩.我是为了好好学习而学习呀.哈哈哈.正在尝试爱上代码,虽然有一丢丢的难,不过,我相信我会的! [Ajax] ...
- 原生JS实现Ajax及Ajax的跨域请求
前 言 如今,从事前端方面的程序猿们,如果,不懂一些前后台的数据交互方面的知识的话,估计都不太好意思说自己是程序猿.当然,如今有着许多的框架,都有相对应的前后台数据交互的方法. ...
- ajax实现跨域访问
ajax跨域访问是一个老生畅谈的问题啦,网上解决方法很多,discuz用的p3p协议,有兴趣的朋友可以了解下,比较常用的是JSONP方法,貌似目前这种方法只支持GET方式,不如POST方式安全. 即使 ...
- jQuery ajax 302跨域
一.ajax 302 ajax用于异步获取服务器数据,但是某天有这么一个使用场景: > 基于安全考虑,登录的用户的信息失效时,系统的所有ajax接口都由服务器直接重定向到系统的登录页面,此时登录 ...
- AJAX POST&跨域 解决方案 - CORS
一晃又到新年了,于是开始着手好好整理下自己的文档,顺便把一些自认为有意义的放在博客上,记录成点的点滴. 跨域是我在日常面试中经常会问到的问题,这词在前端界出现的频率不低,主要原因还是 ...
- 解决Ajax不能跨域的方法
1. Ajax不能跨域请求的原因 同源策略(Same Origin Policy),是一种约定,该约定阻止当前脚本获取或者操作另一个域下的内容.所有支持Javascript的浏览器都支持同源策略,也 ...
- AJAX POST&跨域 解决方案 - CORS(转载)
跨域是我在日常面试中经常会问到的问题,这词在前端界出现的频率不低,主要原因还是由于安全限制(同源策略, 即JavaScript或Cookie只能访问同域下的内容),因为我们在日常的项目开发时会不可避免 ...
- javascript ajax 脚本跨域调用全解析
javascript ajax 脚本跨域调用全解析 今天终于有点时间研究了一下javsscript ajax 脚本跨域调用的问题,先在网上随便搜了一下找到一些解决的办法,但是都比较复杂.由是转到jqu ...
随机推荐
- winsock 收发广播包 【转】
winsock 收发广播包 ☛广播包的概念 广播包通常为了如下两个原因使用:1 一个应用程序希望在本地网络中找到一个资源,而应用程序对于该资源的地址又没有任何先验的知识. 2 一些重要的功能,例如路由 ...
- 2016.7.5 如何在maven中添加所需依赖(只知道jar包的部分名字的情况)
(1)进入官网仓库 http://mvnrepository.com/ (2)输入需要的jar包名 比如这里的jota-time (3)寻找需要的版本,并选取需要的版本 (4)复制需要的maven依赖 ...
- 怎么学习PS快?
PS快速入门笔记 软件界面: 菜单栏, 工具箱 工具属性栏 悬浮面板 画布 ctrl + N 新建画布 如果需要出图:分辨率:300 颜色模式:CMYK 屏幕显示: 分辨率: 72 颜色模式: ...
- struts2获取前台提交的参数
CreateTime--2017年8月25日16:30:11 Author:Marydon struts2对获取前台提交参数的封装 需要导入: import java.util.Enumerati ...
- WebService中获取request对象一例
@WebService @Service public class WeiXinWebServiceImpl implements IWeiXinWebService { @Resource priv ...
- versions 忽略 xcuserdata 目录
1.打开versions,选中xcuserdata目录 2.菜单条.Action->ignore "..." 3.versions不再显示不同
- 贷前系统ElasticSearch实践总结
贷前系统负责从进件到放款前所有业务流程的实现,其中涉及一些数据量较大.条件多样且复杂的综合查询,引入ElasticSearch主要是为了提高查询效率,并希望基于ElasticSearch快速实现一个简 ...
- iOS开发入门
https://github.com/qinjx/30min_guides/blob/master/ios.md 任何C源程序,不经修改,即可通过Objective-C编译器成功编译 Objectiv ...
- 深入浅出Stream和parallelStream
https://blog.csdn.net/darrensty/article/details/79283146
- JQuery中的text(),html()和val()区别
定义和用法 text() 方法方法设置或返回被选元素的文本内容 代码如下 <!DOCTYPE html> <html lang="en"> <head ...