之前我们可以通过“Access-Control-Allow-Origin”,实现跨域请求,那是不是所有跨域请求都可以通过设置Access-Control-Allow-Origin实现跨域请求呢?显然不是,它也会有一些限制
//server.js
const http = require('http');
const fs = require('fs'); http.createServer(function(req,res){
  console.log('req come', req.url);
  const html = fs.readFileSync('test.html', 'utf8');
  res.writeHead(200,{
    'Content-Type': 'text/html'
  })
  res.end(html);
}).listen(8888); console.log('server listening on 8888');
console.log('http://localhost:8888/')
//server2.js
const http = require('http'); http.createServer(function(req,res){
  console.log('req come', req.url);
  res.writeHead(200, {
    'Access-Control-Allow-Origin': '*'
  })
  res.end('345');
}).listen(8887); console.log('server listening on 8887');
console.log('http://localhost:8887/')
<!--test.html-->
<body>
<script>
fetch('http://localhost:8887/',{
  method:'post',
  headers:{
    'X-Test-Cors':'123'
  }
})
</script>
</body>

启动服务,运行server.js,请求8887,发现报错了,而且报错信息跟之前也会有点不一样,提示‘X-Test-Cors’,这个头信息在跨域里面是不被允许的,这就是今天要讲的cors跨域限制

一、跨域请求里面允许的方法
get
head
post
其它都是不允许的,比如put,delete等,浏览器预请求里面是做了验证的,
二、允许的Content-Type
text/plain
multipart/form-data
application/x-www-form-urlencoded
其它的content-type也需要经过预请求验证过才能发送
三、其他限制
请求头限制:比如刚才的自定义请求头,其他允许的请求头(https://fetch.spec.whatwg.org/#cors-safelisted-request-header)
XMLHttpRequestUpload对象均没有注册任何事件监听器
请求中没有使用ReadableStream对象
四、什么是预请求
刚才的请求是有返回值的,但是报错了,忽略了这个值,要不忽略这个值,需要在返回值里面允许这个自定义的头信息
// server2.js
const http = require('http');
http.createServer(function(req,res){
  console.log('req come', req.url);
  res.writeHead(200, {
    'Access-Control-Allow-Origin': '*',
    'Access-Control-Allow-Headers': 'X-Test-Cors',
    //'Access-Control-Allow-Methods': 'post,put,delete',
    //'Access-Control-Max-Age': "1000", //1000秒内不用再次发送预请求来验证,直接发起正式的请求就可以
  })
  res.end('345');
}).listen(8887);
console.log('server listening on 8887');
console.log('http://localhost:8887/')

这样设置,这个请求就成功了,但是可以观测到多了一个请求,这个多出来的请求就是预请求,告诉浏览器,这个自定义请求是允许的,然后再正式的发送这个请求,通过验证之后就请求成功了,浏览器为什么要做这些限制,是因为保证安全,不允许随便一个人都可以进行跨域

CORS跨域限制以及预请求验证的更多相关文章

  1. CORS 跨域中的 preflight 请求

    我们知道借助Access-Control-Allow-Origin响应头字段可以允许跨域 AJAX, 对于非简单请求,CORS 机制跨域会首先进行 preflight(一个 OPTIONS 请求), ...

  2. ajax跨域通过 Cors跨域资源共享 进行GetPost请求

    using System; using System.Collections.Generic; using System.Linq; using System.Net; using System.Ne ...

  3. JSONP跨域和CORS跨域

    什么是跨域? 跨域:指的是浏览器不能执行其它网站的脚本,它是由浏览器的同源策略造成的,是浏览器的安全限制! 同源策略 同源策略:域名.协议.端口均相同. 浏览器执行JavaScript脚本时,会检查这 ...

  4. SpringBoot配置Cors跨域请求

    一.同源策略简介 同源策略[same origin policy]是浏览器的一个安全功能,不同源的客户端脚本在没有明确授权的情况下,不能读写对方资源. 同源策略是浏览器安全的基石. 什么是源 源[or ...

  5. CORS跨域请求规则以及在Spring中的实现

    CORS: 通常情况下浏览器禁止AJAX从外部获取资源,因此就衍生了CORS这一标准体系,来实现跨域请求. CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origi ...

  6. CORS——跨域请求那些事儿

    在日常的项目开发时会不可避免的需要进行跨域操作,而在实际进行跨域请求时,经常会遇到类似 No 'Access-Control-Allow-Origin' header is present on th ...

  7. CORS跨域请求

    一.问题: 服务器端代码 from flask import Flask from flask import make_response from flask import jsonify app = ...

  8. 4 伪ajax:jsonp、cors 跨域请求

    一.同源策略 https://www.cnblogs.com/yuanchenqi/articles/7638956.html 同源策略(Same origin policy)是一种约定,它是浏览器最 ...

  9. [转] 重定向 CORS 跨域请求

    非简单请求不可重定向,包括第一个preflight请求和第二个真正的请求都不行. 简单请求可以重定向任意多次,但如需兼容多数浏览器,只可进行一次重定向. 中间服务器应当同样配置相关 CORS 响应头. ...

随机推荐

  1. SQL 十分位

    -- 十分位,这个算法不是很准确 select family_agreement_cnt -- 字段 ,dt -- 分区 ,rn -- 排序 ,cnt -- 总行数 ,percent2 -- 分位值 ...

  2. java课内容2019.3.1

    java的相关了解博客:答疑 https://www.cnblogs.com/aishangJava/p/6862917.html 一.构造方法: 1.构造方法只能被编译器调用一次,并且是在创建对象时 ...

  3. java编程--04比较几个常用的日期时间相关类的区别

    第一篇,介绍日期的比较 第二篇,介绍日期的格式化 第三篇,介绍关于日期常用的计算 第四篇,比较几个常用的日期时间相关类的区别 第五篇,jdk9对日期类进行了更新,写一些i自己的学习心得. 下面以一组思 ...

  4. python-综合练习题(if条件语句,while循环,奇数偶数

    练习题: 1.使用while循环输入1 2 3 4 5 6      8 9 10 2.求1-100的所有数的和 3.输出1-100内所有的奇数 4.输出1-100内所有的偶数 5.求1-2+3-4+ ...

  5. python Gensim库建立word2vec参数说明

    from gensim.models import word2vec model = word2vec.Word2Vec(sentences, size=80, window=10,workers=6 ...

  6. python get_dummies与cut离散化数据

  7. 性能测试工具LoadRunner31-LR之链接mysql

    步骤: 1.建好mysql数据库并启动 2.下载libmysql.dll,放到保存脚本的文件夹下 3.编写脚本并运行 Action() { int rc; //定义状态变量,0表示成功,非0表示失败 ...

  8. windows 7下安装Apache 2.2

    一. 软件下载 软件版本:apache_2.2.25-win32-x86-no_ssl.msi 二. 软件安装 双击安装,一路Next下去,直到安装完成. 三. 配置 在安装结束之后,在右下角的状态栏 ...

  9. Ubuntu 16.04下安装Charles抓包工具

    Charles是一个跨平台的抓包工具,虽然没有Fiddler做的这么完美,但是也算是另一个选择. 下载: https://www.charlesproxy.com/download/ 注册: http ...

  10. 《深入浅出Node.js》学习笔记(一)

    看了朴灵前辈的node.js系列文章,很开阔视野,虽然能力有限还是有很多不懂,但是还是希望能写下笔记,初步对node.js有点了解. 一.概念 Node.js不是JS应用.而是JS运行平台 Node. ...