corspost请求失败_利用CORS实现POST方式跨域请求数据
CORS全名Cross-Origin Resource Sharing,顾名思义:跨域分享资源,这是W3C制定的跨站资源分享标准。
目前包括IE10+、chrome、safari、FF都提供了XMLHttpRequest对象对该标准的支持,在更老的IE8中则提供了xDomainRequest对象,部分实现了该标准。
下面是创建request对象的代码:
var url = "http://www.111cn.net /1.php";
if (XMLHttpRequest) {
var req = new XMLHttpRequest();
// 利用withCredentials属性来判断是否支持跨域请求
if (!("withCredentials" in req)) { // w3c先行
if (window.XDomainRequest) {
req = new XDomainRequest();
}
}
req.open('POST', url, true);
req.onload = function (data) {
alert(this.responseText);
};
req.send();
}
注意xDomainRequest对象只支持http和https协议
在利用XMLHttpRequest对象发POST请求前会发一个options嗅探来确定是否有跨域请求的权限;同时在header头上带上Origin信息来指示来源网站信息,服务器响应时需要带上Access-Control-Allow-Origin头的值是否和Origin信息相匹配。
header("Access-Control-Allow-Origin: http://localhost"); // *为全部域名
一、使用php代码实现
#
# CORS config for php
# Code by anrip[mail@anrip.com]
#
function make_cors($origin = '*') {
$request_method = $_SERVER['REQUEST_METHOD'];
if ($request_method === 'OPTIONS') {
header('Access-Control-Allow-Origin:'.$origin);
header('Access-Control-Allow-Credentials:true');
header('Access-Control-Allow-Methods:GET, POST, OPTIONS');
header('Access-Control-Max-Age:1728000');
header('Content-Type:text/plain charset=UTF-8');
header('Content-Length: 0',true);
header('status: 204');
header('HTTP/1.0 204 No Content');
}
if ($request_method === 'POST') {
header('Access-Control-Allow-Origin:'.$origin);
header('Access-Control-Allow-Credentials:true');
header('Access-Control-Allow-Methods:GET, POST, OPTIONS');
}
if ($request_method === 'GET') {
header('Access-Control-Allow-Origin:'.$origin);
header('Access-Control-Allow-Credentials:true');
header('Access-Control-Allow-Methods:GET, POST, OPTIONS');
}
}
二、使用nginx配置实现
# CORS config for nginx
# Code by anrip[mail@anrip.com]
#
location / {
set $origin '*';
if ($request_method = 'OPTIONS') {
add_header 'Access-Control-Allow-Origin' $origin;
#
# Om nom nom cookies
#
add_header 'Access-Control-Allow-Credentials' 'true';
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
#
# Custom headers and headers various browsers *should* be OK with but aren't
#
add_header 'Access-Control-Allow-Headers' 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
#
# Tell client that this pre-flight info is valid for 20 days
#
add_header 'Access-Control-Max-Age' 1728000;
add_header 'Content-Type' 'text/plain charset=UTF-8';
add_header 'Content-Length' 0;
return 204;
}
if ($request_method = 'POST') {
add_header 'Access-Control-Allow-Origin' $origin;
add_header 'Access-Control-Allow-Credentials' 'true';
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
add_header 'Access-Control-Allow-Headers' 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
}
if ($request_method = 'GET') {
add_header 'Access-Control-Allow-Origin' $origin;
add_header 'Access-Control-Allow-Credentials' 'true';
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
add_header 'Access-Control-Allow-Headers' 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
}
}
corspost请求失败_利用CORS实现POST方式跨域请求数据相关推荐
- 利用Access-Control-Allow-Origin响应头解决跨域请求
标签:cors 跨域请求 ACAO 2015-11-28 18:53 12103人阅读 评论(0) 收藏 举报 分类: web前端(5) J2EE服务器(2) 传统的跨域请求没有好的解决方案,无 ...
- 利用JQuery jsonp实现Ajax跨域请求 .Net 的*.handler 和 WebService,返回json数据
原文: http://blog.csdn.net/polarissky/article/details/6429554 1.新建数据源项目CrossDomain 主要文件如下: 1.Handler. ...
- ajax 请求_你了解前端出现Ajax跨域请求的原因吗?
ajax的跨域真正面目 作为一名前端开发人员,谈到Ajax几乎是无人不知无人不晓,每天都会跟Ajax打打交道,特别在如今提倡前后端分离的时代,更是相处甚多,使用过程中碰到最多的一个问题相信应该是请求跨 ...
- node代理请求 vue_vue-cli项目开发/生产环境代理实现跨域请求+webpack配置开发/生产环境的接口地址...
使用 Vue-cli 创建的项目,开发地址是 localhost:8080,需要访问非本机上的接口http://10.1.0.34:8000/queryRole.不同域名之间的访问,需要跨域才能正确请 ...
- ajax跨域请求 html5,HTML5中使用postMessage实现Ajax跨域请求的方法
由于同源策略的限制,Javascript存在跨域通信的问题,典型的跨域问题有iframe与父级的通信等. 常规的几种解决方法: (1) document.domain+iframe: (2) 动态创建 ...
- 跨站点请求伪造_十大常见web漏洞——跨站点请求伪造(CSRF)
CSRF介绍 什么是CSRF呢?我们直接看例子. https://mp.toutiao.com/profile_v3/graphic/preview?do=delete&pgc_id=6829 ...
- linux 虚拟机大量udp请求失败_利用PXE远程装机服务批量部署Linux
1.安装并配置DHCP服务器 (要先安装yum源) yum -y install dhcp cd /usr/share/doc/ cd dhcp-4.2.5/ 拷贝example文件到另一目录并覆盖: ...
- java 移动页面中的图片上传_移动端上传图片(ajax跨域请求)
第一次写项目开发经验,望担待. 除了前端以外的事就不叨叨了,下面开始弄干活(两个页面首页.列表页). 项目 开发简述 项目需求:上传图片并展示. 项目地址:项目的链接地址 开发工具:sublime 后 ...
- 利用cors,实现js跨域访问Tomcat下资源
第一步:页面js代码: function createCORSRequest(method, url){var xhr = new XMLHttpRequest();if ("withCre ...
- CORS——跨域请求那些事儿
[本期嘉宾介绍]睿得,具有多年研发.运维.安全等IT相关从业经历.目前从事CDN.存储.视频直播点播的技术支持.喜爱钻研,喜爱编码,喜爱分享. 在日常的项目开发时会不可避免的需要进行跨域操作,而在实际 ...
最新文章
- Linux Exploit系列之三 Off-By-One 漏洞 (基于栈)
- 02.Web大前端时代之:HTML5+CSS3入门系列~H5结构元素
- 【Android工具】wifi概观360中文专业版,wifi overview 360 pro,wifi信息查看工具
- python文件读read()、readline()、readlines()对比
- 垂直居中重要方法理解---重点是方法三
- 华为开源构建工具_为什么我构建了用于大数据测试和质量控制的开源工具
- 基于springboot断点续传或分片上传
- anaconda python no module named ‘past‘的解决方法
- java 过滤器filter使用案例
- 善用assert函数
- 前端每日实战:4# 视频演示如何用纯 CSS 创作一个金属光泽 3D 按钮特效
- 112358序列c语言,112358(112358的规律是什么)
- 《SolidWorks 2014中文版完全自学手册》——1.2 SolidWorks 2014简介
- mac远程连接腾讯云虚拟机
- OpenCV——line、circle、rectangle、ellipse、polylines函数的使用和绘制文本putText函数以及绘制中文的方法。
- java jbutton 不可点击_JTable和JButton点击不起作用
- 化妆品企业迎来的机遇和挑战
- TX2上的Raspberry Pi相机
- easyx游戏编程:五子棋(C语言游戏开发)
- 操作系统:线程死锁、饥饿、活锁
热门文章
- ugmented reality(AR) equipment
- 常见掌握类库与工具体系图 艾提拉总结 Atitit 文档资料处理重要类库与工具体系树 Configuration yml xml jsoup Net apache commons net
- Atitit 常见数据结构之编程语言源文件与编译文件 目录 1.1. 通过反射api得到结构	1 1.2. 通过源码ast信息	1 2. 常见语言	1 2.1. Php ast 解析	1 2.2.
- Atitit s2018 s3 doc list alldvc.docx .docx s2018 s3f doc compc s2018 s3f doc homepc sum doc dvcCom
- Atitit 移动互联网 技术维度 1. 1.3 移动互联网网络技术13	1 2. 第2章 移动终端53 手机 平板	2 3. 移动操作系统67	2 4. 移动互联网应用技术99	2 5. 	3 6.
- PAIP.MYSQL SLEEP 连接太多解决
- 易方达、鹏华、京东数科基金投顾访谈
- (转)详解Windows Hash
- (转)采访 | ETHNews 对 Vitalik Buterin 的独家专访
- (转)曹锋、宋天玮:区块链技术在证券市场中的应用探索