cookie all in one

credentials: "include"

https://developers.google.com/web/updates/2015/03/introduction-to-fetch

why & solution

cookie & Fetch & credentials

https://github.com/github/fetch#sending-cookies

https://github.com/github/fetch#receiving-cookies

https://github.com/github/fetch#read-this-first

https://developer.mozilla.org/en-US/docs/Glossary/Forbidden_header_name



Set-Cookie & Secure & HttpOnly & SameSite

HTTP/Headers/Set-Cookie

Set-Cookie

https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Set-Cookie


https

https://stackoverflow.com/questions/37234687/how-to-set-cookie-secure-flag-using-javascript

cookie


document.cookie = "testCookie=javascript2050; Expires=Wed, 21 Oct 2020 07:28:00 GMT; path=/;domain=.cnblogs.com;Secure;";
// "testCookie=javascript2050; Expires=Wed, 21 Oct 2020 07:28:00 GMT; path=/;domain=.cnblogs.com;Secure; document.cookie;;
// "testCookie=javascript2050"

HttpOnly

A HttpOnly cookie means that it's not available to scripting languages like JavaScript.

https://stackoverflow.com/questions/14691654/set-a-cookie-to-httponly-via-javascript

https://stackoverflow.com/questions/14691654/set-a-cookie-to-httponly-via-javascript/14691716#14691716

https://github.com/js-cookie/js-cookie/issues/344

SameSite

https://stackoverflow.com/questions/50361460/samesite-cookie-attribute-not-being-set-using-javascript



cookie

不支持 fill:// 协议,无法写 cookie!

一次只能写一个?

http://javascript.ruanyifeng.com/bom/cookie.html

逗号进行转义? 瞎扯


document.cookie = 'jwt=aaa.bbb.ccc';
// "jwt=aaa.bbb.ccc"
document.cookie;


http only & path & expires


// document.cookie = ".test=javascript2020;Expires=Wed, 21 Oct 2020 07:28:00 GMT;path=/;domain=www.cnblogs.com";

document.cookie = ".test=javascript2020;Expires=Wed, 21 Oct 2020 07:28:00 GMT;path=/;domain=cnblogs.com";

// ".test=javascript2020;Expires=Wed, 21 Oct 2020 07:28:00 GMT;path=/;domain=www.cnblogs.com"

document.cookie;


https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Set-Cookie

https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookies

Request & header

https://developer.mozilla.org/en-US/docs/Glossary/Request_header

https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers

???

cookie


new headers({})

https://davidwalsh.name/fetch

https://stackoverflow.com/questions/35733138/send-cookie-in-http-post-request-in-javascript



const fetchJSON = (url = ``) => {
let headers = new Headers({
"Content-Type": "application/json; charset=utf-8;",
"cookie": "access_token=eyJhbGciOiJIUzI1NiJ9.eyJyb2xlIjoiQWRtaW4iLCJ1c2VyX25hbWUiOiJhZG1pbiJ9.k82neq7nQXjz3xBu0P7jnbukOx57WUo4_V3DLStkEss; Expires=Wed, 21 Oct 2020 07:28:00 GMT; path=/; Secure; HttpOnly;",
"Set-Cookie": "access_token=eyJhbGciOiJIUzI1NiJ9.eyJyb2xlIjoiQWRtaW4iLCJ1c2VyX25hbWUiOiJhZG1pbiJ9.k82neq7nQXjz3xBu0P7jnbukOx57WUo4_V3DLStkEss; Expires=Wed, 21 Oct 2020 07:28:00 GMT; path=/; Secure; HttpOnly;",
});
return fetch(url, {
// method: "POST",
method: "GET",
mode: "no-cors",
headers: headers,
})
.then(res => res.json())
.then(
(json) => {
return json;
}
)
.catch(err => console.log(`fetch error`, err));
};


"use strict"; /**
*
* @author xgqfrms
* @license MIT
* @copyright cookie
* @description
* @augments
* @example
*
*/
const = ( = ``, debug = false) => {
// do something...
return ;
};
const commments = {
"commentId":3997788,
"voteType":"Digg"
}; const url = "https://www.cnblogs.com/mvc/vote/VoteComment.aspx"; // https://www.cnblogs.com/mvc/vote/VoteBlogPost.aspx // blog = {
// "blogApp": "xgqfrms",
// "postId": 9178897,
// "voteType": "Digg",
// "isAbandoned": false
// }; fetch(url, {
method: "POST",
headers: {
"Accept": "application/json",
"Content-Type": "application/json",
"Cache": "no-cache"
},
credentials: "same-origin",
body: JSON.stringify(commments),
});


bug

前端如果不设置 credentials, 字段,后端无法写入 cookie(Set-Cookie), 前端无法发送 cookie ???

conclusion

  1. cookie 必须同源, domain 不许一致。

  2. 前端如果不设置 credentials, 字段, 前端无法发送 cookie !

  3. 后端无法写入 cookie(Set-Cookie) ???


credentials: "include",

const fetchJSON = (url = ``, data = {}) => {
// let headers = new Headers({
// "Content-Type": "application/json; charset=utf-8;",
// "cookie": "access_token=eyJhbGciOiJIUzI1NiJ9.eyJyb2xlIjoiQWRtaW4iLCJ1c2VyX25hbWUiOiJhZG1pbiJ9.k82neq7nQXjz3xBu0P7jnbukOx57WUo4_V3DLStkEss; Expires=Wed, 21 Oct 2020 07:28:00 GMT; path=/; Secure; HttpOnly;",
// "Set-Cookie": "access_token=eyJhbGciOiJIUzI1NiJ9.eyJyb2xlIjoiQWRtaW4iLCJ1c2VyX25hbWUiOiJhZG1pbiJ9.k82neq7nQXjz3xBu0P7jnbukOx57WUo4_V3DLStkEss; Expires=Wed, 21 Oct 2020 07:28:00 GMT; path=/; Secure; HttpOnly;",
// });
return fetch(url, {
// method: "POST",
method: "GET",
mode: "no-cors",
credentials: "include",
// credentials: "same-origin",
headers: {
"Accept": "application/json; charset=utf-8;",
"Content-Type": "application/json; charset=utf-8;",
"Cache": "no-cache",
// "Set-Cookie": "access_token=eyJhbGciOiJIUzI1NiJ9.eyJyb2xlIjoiQWRtaW4iLCJ1c2VyX25hbWUiOiJhZG1pbiJ9.k82neq7nQXjz3xBu0P7jnbukOx57WUo4_V3DLStkEss",
// "XYZ": "access_token=eyJhbGciOiJIUzI1NiJ9.eyJyb2xlIjoiQWRtaW4iLCJ1c2VyX25hbWUiOiJhZG1pbiJ9.k82neq7nQXjz3xBu0P7jnbukOx57WUo4_V3DLStkEss",
// "Cookie": "access_token=eyJhbGciOiJIUzI1NiJ9.eyJyb2xlIjoiQWRtaW4iLCJ1c2VyX25hbWUiOiJhZG1pbiJ9.k82neq7nQXjz3xBu0P7jnbukOx57WUo4_V3DLStkEss; Expires=Wed, 21 Oct 2020 07:28:00 GMT; path=/; Secure; HttpOnly;",
// "Set-Cookie": "access_token=eyJhbGciOiJIUzI1NiJ9.eyJyb2xlIjoiQWRtaW4iLCJ1c2VyX25hbWUiOiJhZG1pbiJ9.k82neq7nQXjz3xBu0P7jnbukOx57WUo4_V3DLStkEss; Expires=Wed, 21 Oct 2020 07:28:00 GMT; path=/; Secure; HttpOnly;",
// "Cookie": "access_token=eyJhbGciOiJIUzI1NiJ9.eyJyb2xlIjoiQWRtaW4iLCJ1c2VyX25hbWUiOiJhZG1pbiJ9.k82neq7nQXjz3xBu0P7jnbukOx57WUo4_V3DLStkEss; Expires=Wed, 21 Oct 2020 07:28:00 GMT; path=/; HttpOnly;",
// Secure; & cookie只会被https传输 (boolean或null)。
},
// body: JSON.stringify({
// user_name: "admin",
// password: "admin",
// }),
// headers: new Headers({
// "Content-Type": "application/json; charset=utf-8;",
// "cookie": "access_token=eyJhbGciOiJIUzI1NiJ9.eyJyb2xlIjoiQWRtaW4iLCJ1c2VyX25hbWUiOiJhZG1pbiJ9.k82neq7nQXjz3xBu0P7jnbukOx57WUo4_V3DLStkEss; Expires=Wed, 21 Oct 2020 07:28:00 GMT; path=/; Secure; HttpOnly;",
// "Set-Cookie": "access_token=eyJhbGciOiJIUzI1NiJ9.eyJyb2xlIjoiQWRtaW4iLCJ1c2VyX25hbWUiOiJhZG1pbiJ9.k82neq7nQXjz3xBu0P7jnbukOx57WUo4_V3DLStkEss; Expires=Wed, 21 Oct 2020 07:28:00 GMT; path=/; Secure; HttpOnly;",
// }),
})
// .then(res => res.json())
.then(
(json) => {
return json;
}
)
.catch(err => console.log(`fetch error`, err));
};


# cookie Generator > cookieGenerator(); ```js /**
*
* @author xgqfrms
* @license MIT
* @copyright xgqfrms
*
* @description cookieGenerator
*
* @param {String} name cookie name
* @param {String} value cookie value
* @param {Number} days
* @param {String} path
* @param {String} domain
* @param {String} HttpOnly (JavaScript absolutely no API available to get/set the HttpOnly attribute of the cookie!)
* @param {Boolean} Secure
* @param {ENUM} SameSite=Lax / SameSite=Strict (This is an attribute that can only be set by server (like HttpOnly) in response cookies it sends to browser.)
*
*/ const cookieGenerator = (
options = {
name: "testCookie",
value: "testcookie",
days: 0,
path: "/",
domain: window.parent.document.domain,
// HttpOnly: false,
Secure: false
}) => {
let {
name,
value,
days,
path,
domain,
// HttpOnly,
secure
} = options;
let result = ``,
expires = ``,
date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
expires = date.toUTCString();
result = `${name}=${value}; Expires=${expires}; Path=${path}; Domain=${domain};`;
// if (httponly) {
// result += `Http;`;
// result += `HttpOnly;`;
// }
if (secure) {
result += `Secure;`;
}
// document.cookie = result;
return result;
};



xgqfrms 2012-2020

www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!


cookie all in one的更多相关文章

  1. 超大 Cookie 拒绝服务攻击

    有没有想过,如果网站的 Cookie 特别多特别大,会发生什么情况? 不多说,马上来试验一下: for (i = 0; i < 20; i++) document.cookie = i + '= ...

  2. IE10、IE11 User-Agent 导致的 ASP.Net 网站无法写入Cookie 问题

    你是否遇到过当使用一个涉及到Cookie操作的网站或者管理系统时,IE 6.7.8.9下都跑的好好的,唯独到了IE10.11这些高版本浏览器就不行了?好吧,这个问题码农连续2天内遇到了2次.那么,我们 ...

  3. 解决cookie跨域访问

    一.前言 随着项目模块越来越多,很多模块现在都是独立部署.模块之间的交流有时可能会通过cookie来完成.比如说门户和应用,分别部署在不同的机器或者web容器中,假如用户登陆之后会在浏览器客户端写入c ...

  4. jquery插件的用法之cookie 插件

    一.使用cookie 插件 插件官方网站下载地址:http://plugins.jquery.com/cookie/ cookie 插件的用法比较简单,直接粘贴下面代码示例: //生成一个cookie ...

  5. 一个诡异的COOKIE问题

    今天下午,发现本地的测试环境突然跑不动了,thinkphp直接跑到异常页面,按照正常的排错思路,直接看thinkphp的log 有一条 [ error ] [2]setcookie() expects ...

  6. [转载]Cookie/Session的机制与安全

    Cookie和Session是为了在无状态的HTTP协议之上维护会话状态,使得服务器可以知道当前是和哪个客户在打交道.本文来详细讨论Cookie和Session的实现机制,以及其中涉及的安全问题. 因 ...

  7. jquery.cookie的使用

    今天想到了要为自己的影像日记增加赞的功能,并且需要用到cookie. 记得原生的js操作cookie也不是很麻烦的,但似乎jquery更简单,不过相比原生js,需要额外引入2个文件,似乎又不是很好,但 ...

  8. 跨域问题,前端主动向后台发送cookie

    跨域是什么? 从一个域名的网页访问另一个域名的资源,就会出现跨域.只要协议.端口.域名有一个不同就会出现跨域 例如: 1.协议不同  http://www.baidu.com:80 和 https:/ ...

  9. 【流量劫持】沉默中的狂怒 —— Cookie 大喷发

    精简版:http://www.cnblogs.com/index-html/p/mitm-cookie-crack.html 前言 上一篇文章 讲解了如何借助前端技术,打造一个比 SSLStrip 更 ...

  10. 好好了解一下Cookie

    Cookie的诞生 由于HTTP协议是无状态的,而服务器端的业务必须是要有状态的.Cookie诞生的最初目的是为了存储web中的状态信息,以方便服务器端使用.比如判断用户是否是第一次访问网站.目前最新 ...

随机推荐

  1. Jmeter非GUI界面对阿里云服务器压测

    一.Jmeter非GUI界面 参数讲解 讲解:非GUI界面,压测参数讲解             -h 帮助            -n 非GUI模式            -t 指定要运行的 JMe ...

  2. https://nginx.org/en/docs/http/request_processing.html

    https://nginx.org/en/docs/http/request_processing.html

  3. c++ 三五法则 自己理解

    简介 三五法则规定了什么时候需要  1 拷贝构造函数   2 拷贝赋值函数  3 析构函数 1. 需要析构函数的类也需要拷贝构造函数和拷贝赋值函数. 通常,若一个类需要析构函数,则代表其合成的析构函数 ...

  4. 微信小程序--使用云开发完成支付闭环

    微信小程序--使用云开发完成支付闭环 1.流程介绍 2. 代码实现和逻辑思想描述 云函数统一下单 对应云函数 unipay [CloudPay.unifiedOrder] 函数思路 : 调用云函数封装 ...

  5. MongoTemplate聚合(一)$lookup

    mongodb   最近入职了新的公司,新公司统一使用的mongodb,es等非关系型数据库.以前对es有一些了解,其实就是灵活的文档类型结构,不受限于关系型数据库的那种字段唯一确定的"死板 ...

  6. python模块----paramicko模块 (ssh远程主机并命令或传文件)

    paramiko模块 paramicko模块是非标准库模块,需要pip下载 paramicko:模拟ssh登陆linux主机,也有上传下载功能.ansible自动化部署软件底层就有应用paramick ...

  7. C++基本之 运算符重载

    =====>友元运算符#include <iostream> using namespace std; class Test { public: Test(int a = 0) { ...

  8. npm qs 模块(中文)

    本文基本使用谷歌翻译加上自己的理解,权当加深记忆. npm 简介 qs 是一个增加了一些安全性的查询字符串解析和序列化字符串的库.主要维护者:Jordan Harband最初创建者和维护者:TJ Ho ...

  9. cassandra权威指南读书笔记--Cassandra架构(3)

    分阶段事件驱动架构 SEDASEDA(Staged Event-Driven Architecture)的核心思想是把一个请求处理过程分成几个Stage,不同资源消耗的Stage使用不同数量的线程来处 ...

  10. [译]Rxjs&Angular-退订可观察对象的n中方式

    原文/出处: RxJS & Angular - Unsubscribe Like a Pro 在angular项目中我们不可避免的要使用RxJS可观察对象(Observables)来进行订阅( ...