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 ...
随机推荐
- c 数组做为形參时 该參数退化为指针
当数组做为函数的形參的时候,该參数退化为指针,而且是无法直接求得数组的大小. 传数组给一个函数.数组类型自己主动转换为指针类型,因而传的实际是地址. void func(int array[10]) ...
- Yii2 数据操作Query Builder
转载地址: http://blog.csdn.net/hzqghost/article/details/44117081 Yii2 数据操作Query Builder 分类: Yii22015-03- ...
- ES聚合查询实例
查询特定渠道分享数量最大的30个文章的uuid: { , "query": { "bool": { "must": [ { "te ...
- 点击页面li显示li中文字
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
- 又一次遇到Data truncation: Data too longData truncation: Data too long问题
往MySQL的blob字段上传文件,结果又出现了Data truncation: Data too longData truncation: Data too long异常. 我的第一反应是查看/et ...
- [转载]使用RoboCopy 命令
经常进行文件管理操作的朋友们,不满意于Windows系统内置的复制功能,因为它太龟速了.于是大家就使用FastCopy.TeraCopy之类的软件来加速复制,但是你是否知道Windows 7已经内置快 ...
- Python & Django & Pycharm 安装
一.下载安装Python 从https://www.python.org/上下载 Python 2.7.6,双击安装包开始安装: 单击“Next”按钮,进入Python安装组件选择界面.这里我们安装全 ...
- vue.js+koa2项目实战(三)登录注册模态框
登录注册模态框 注: [Vue warn]: Do not use built-in or reserved HTML elements as component id: diaLog 原因:diaL ...
- spring(16)------spring的数据源配置
在spring中,通过XML的形式实现数据源的注入有三种形式. 一.使用spring自带的DriverManagerDataSource 使用DriverManagerDataSource配置数据源与 ...
- HDOJ2084数塔问题
数塔问题 题目要求从顶层走究竟层.若每一步仅仅能走到相邻的结点,求经过的结点的数字之和最大值. 非常经典的DP,能够这样考虑,要求从塔顶到塔底最大路径之和.计算时能够考虑自底向上,走最后一步所选的数一 ...