cookie all in one


cookie all in one

credentials: "include"

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

image

why & solution

cookie & Fetch & credentials

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

image

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

image

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



Set-Cookie & Secure & HttpOnly & SameSite

Set-Cookie

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

image


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"

image

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!

image

一次只能写一个?

image

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

image

逗号进行转义? 瞎扯


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

image


http only & path & expires

image


image

image

// 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;

image


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

???

image

cookie

image


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),
});


image

image


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;
};



Flag Counter

&copyxgqfrms 2012-2020

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



免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM