网络编程-跨域资源共享 CORS

时间：2022-09-06 16:06:10

1.什么是同源策略？

如果两个 URL 的 protocol、port 和 host 都相同的话，则这两个 URL 是同源。同源策略对Web应用程序具有特殊意义，因为Web应用程序广泛依赖于HTTP cookie来维持用户会话，所以必须将不相关网站严格分隔，以防止丢失数据泄露。

值得注意的是同源策略仅适用于脚本，这意味着某网站可以通过相应的HTML标签访问不同来源网站上的图像、CSS和动态加载脚本等资源。而跨站请求伪造就是利用同源策略不适用于HTML标签的缺陷。

2.跨域资源共享 CORS

跨域资源共享（英语：Cross-origin resource sharing，缩写：CORS），用于让网页的受限资源能够被其他域名的页面访问的一种机制。

通过该机制，页面能够*地使用不同源（英语：cross-origin）的图片、样式、脚本、iframes以及视频。一些跨域的请求（特别是Ajax）常常会被同源策略所禁止的。跨源资源共享定义了一种方式，为的是浏览器和服务器之间能互相确认是否足够安全以至于能使用跨源请求。比起纯粹的同源请求，这将更为*和功能性的（functionality ），但比纯粹的跨源请求更为安全。

3.预检请求

需预检的请求要求必须首先使用 OPTIONS 方法发起一个预检请求到服务器，以获知服务器是否允许该实际请求。"预检请求“的使用，可以避免跨域请求对服务器的用户数据产生未预期的影响。

不会触发CORS预检的请求称为简单请求，满足以下所有条件的才会被视为简单请求

1）使用GET、POST、HEAD其中一种方法

2）只使用了如下的安全首部字段，不得人为设置其他首部字段

  • Accept
  • Accept-Language
  • Content-Language
  • Content-Type 只限于三个值application/x-www-form-urlencoded、multipart/form-data、text/plain

4.CORS相关字段

  • Access-Control-Allow-Origin：该字段是必须的。它的值要么是请求时Origin字段的值，要么是一个*，表示接受任意域名的请求。
  • Access-Control-Allow-Headers：表明服务器允许请求中携带的头信息字段。值为逗号分割的列表。
  • Access-Control-Allow-Credentials：该字段可选。它的值是一个布尔值，表示是否允许发送Cookie。默认情况下，Cookie不包括在CORS请求之中。设为true，即表示服务器明确许可，Cookie可以包含在请求中，一起发给服务器。这个值也只能设为true，如果服务器不要浏览器发送Cookie，删除该字段即可。
  • Access-Control-Allow-Methods：该字段必需，用于预检请求的响应。其指明了实际请求所允许使用的 HTTP 方法。
  • Access-Control-Max-Age：该字段可选，用来指定本次预检请求的有效期，单位为秒。在此期间，不用发出另一条预检请求。

5.Golang实现跨域

客户端

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>XMLHttpRequest CORS</title>

</head>

<body>

    <h2>XMLHttpRequest CORS</h2>

    <button id="send">发送POST（application/x-www-form-urlencoded）</button>

    <button id="sendJSON">发送POST（application/json）</button>

    <script type="application/javascript">

        document.getElementById('send').onclick = function (evt) {

            let xhr = new XMLHttpRequest();

            xhr.open("POST", "http://127.0.0.1:8080/index", true)

            xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded")

            xhr.setRequestHeader("x-Custome-Header", "true")

            let params = new URLSearchParams()

            params.append("name", "dazuo")

            params.append("age", "24")

            xhr.send(params)

        }

        document.getElementById('sendJSON').onclick = function (evt) {

            let xhr = new XMLHttpRequest();

            xhr.open("POST", "http://127.0.0.1:8080/index", true)

            xhr.setRequestHeader("Content-Type", "application/json")

            xhr.setRequestHeader("x-Custome-Header", "true")

            let postData = JSON.stringify({

                name: "dazuo",

                age: 24

            })

            xhr.send(postData)

        }

    </script>

</body>

</html>

服务端

package main

import (

	"fmt"

	"io/ioutil"

	"log"

	"net/http"

)

func HTTPCORS() {

	http.HandleFunc("/index", func(w http.ResponseWriter, r *http.Request) {

		header := w.Header()

		header.Set("Access-Control-Allow-Origin", "*")

		header.Set("Access-Control-Allow-Headers", "x-Custome-Header,Content-Type")

		header.Set("Access-Control-Allow-Credentials", "false")

		header.Set("Access-Control-Allow-Methods", "POST,GET,DELETE,PUT,OPTIONS")

		header.Set("Access-Control-Max-Age", "5")

		if r.Method == "OPTIONS" {

			w.WriteHeader(http.StatusNoContent)

		}

		reqBody, _ := ioutil.ReadAll(r.Body)

		fmt.Printf("RequestURI: %s, Methods: %s, ReqBody: %s\n", r.RequestURI, r.Method, reqBody)

		_, _ = w.Write([]byte("welcome !"))

	})

	err := http.ListenAndServe("127.0.0.1:8080", nil)

	if err != nil {

		log.Panic(err)

	}

}

6.参考资料

1.同源策略 - *

2.跨域资源共享 - *

3.跨域资源共享 CORS 详解 - 阮一峰的网络日志

网络编程-跨域资源共享 CORS的更多相关文章

  1. 跨域资源共享CORS与JSONP

    同源策略限制: 同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能,如果没有同源策略,攻击者可以通过JavaScript获取你的邮件以及其他敏感信息,比如说 ...

  2. VUE SpringCloud 跨域资源共享 CORS 详解

    VUE  SpringCloud 跨域资源共享 CORS 详解 作者:  张艳涛 日期: 2020年7月28日 本篇文章主要参考:阮一峰的网络日志 » 首页 » 档案 --跨域资源共享 CORS 详解 ...

  3. 跨域资源共享&lpar;CORS&rpar;问题解决方案

    CORS:Cross-Origin Resource Sharing(跨域资源共享) CORS被浏览器支持的版本情况如下:Chrome 3+.IE 8+.Firefox 3.5+.Opera 12+. ...

  4. 跨域解决方案 - 跨域资源共享cors

    目录 1. cors 介绍 2. 原理 3. cors 解决跨域 4. 自定义HTTP 头部字段解决跨域 5. 代码演示 5. 参考链接 1. cors 介绍 cors 说的是一个机制,其实相当于一个 ...

  5. 【转】跨域资源共享 CORS 详解

    本文来源:http://www.ruanyifeng.com/blog/2016/04/cors.html 阮一峰老师的网络日志 CORS是一个W3C标准,全称是"跨域资源共享"( ...

  6. 跨域资源共享 CORS

    CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origin resource sharing). 它允许浏览器向跨源服务器,发出XMLHttpRequest请求,从 ...

  7. 跨域资源共享 CORS 详解

    CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origin resource sharing). 它允许浏览器向跨源服务器,发出XMLHttpRequest请求,从 ...

  8. 使Web Api 支持跨域资源共享&lpar;CORS&rpar;

    Reference:http://www.asp.net/web-api/overview/security/enabling-cross-origin-requests-in-web-api Imp ...

  9. 跨域资源共享CORS详解

    简介 CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origin resource sharing). 它允许浏览器向跨源服务器,发出XMLHttpRequest请 ...

随机推荐

  1. SJPullDownMenu下拉菜单框架使用

    SJPullDownMenu 快速集成类似淘宝筛选下拉菜单 如果页面显示不全等问题请转至:http://www.jianshu.com/p/d07c6393830c 查看使用 Getting Star ...

  2. RabbitMQ学习总结 第七篇：RCP&lpar;远程过程调用协议&rpar;

    在http://www.cnblogs.com/leocook/p/mq_rabbitmq_2.html 这篇博文中我们实现了怎么去使用work queue来把比较耗时的任务分散给多个worker. ...

  3. SoapUI 使用笔记

    1. 构建项目 安装完成后 右键Project --> New SOAP Project 在弹出的 New SOAP Project框中输入名字 和 webservice服务地址(example ...

  4. 查找&OpenCurlyDoubleQuote;CDN、负载均衡、反向代理”等大型网络真实IP地址的方法

    首先,CDN.负载均衡.反向代理还分为很多层,有时查出来的是最外层的 CDN 服务器群,真实的机器是不对外开放的,类似这样的: 用户 → CDN 网络 → 一台或多台真实机器 ↗ CDN Server ...

  5. Servlet相关接口和Servlet的生命周期

    http://www.cnblogs.com/luotaoyeah/p/3860292.html Servlet相关接口和Servlet的生命周期 创建一个Servlet类最直接的方式是实现javax ...

  6. php图片上传

    //处理图片 private function imageDeal($param){ $arrType=array('image/jpg','image/bmp','image/png','image ...

  7. Android多点触控（图片的缩放Demo）

    本文主要介绍Android的多点触控,使用了一个图片缩放的实例,来更好的说明其原理.须要实现OnTouchListener接口,重写当中的onTouch方法. 实现效果图:       源码: 布局文 ...

  8. &lbrack;批处理&rsqb;使用IncrediBuilder加速自动化测试过程

    背景 1.目前单机全部跑完一次测试的时间大概是5个小时 2.7个虚拟机进行分布式执行的时间大概为3.5小时(包含复制.收集日志的时间) 预期 期望通过IncrediBuilder的虚拟进程的功能在单机 ...

  9. Md5混淆因子

    package cn.springmvc.utils;import org.apache.commons.codec.digest.DigestUtils;import org.apache.comm ...

  10. jQuery 学习笔记1 弹出一个对话框

    这里推荐使用sublime text 2来写,外加zen coding. 首先是写html 只需要html:xt,然后tab就可以得到一个html的完整结构. <!DOCTYPE html PU ...

相关文章