一个简单,轻巧的JavaScript API,用于处理饼干
如果您在https://github.com/js-cookie/js-cookie上查看此信息,则您正在阅读主分支的文档。查看最新版本的文档。 ?
JavaScript Cookie以js-cookie
名义支持NPM。
npm i js-cookie
NPM软件包具有一个module
字段,指向库的ES模块变体,主要是为ES模块Aware Aware Bundlers提供支持,而其browser
字段则指向UMD模块,以实现完整的向后兼容性。
并非所有浏览器本地都支持ES模块。因此,NPM软件包/发行版同时提供了ES和UMD模块变体,您可能需要将ES模块与UMD后备一起包括在内:
或者,通过JSDELIVR CDN包括JS-Cookie。
导入库:
import Cookies from 'js-cookie'
// or
const Cookies = require ( 'js-cookie' )
在整个网站上创建一个有效的cookie:
Cookies . set ( 'name' , 'value' )
创建一个从现在起7天到期的cookie,在整个网站上有效:
Cookies . set ( 'name' , 'value' , { expires : 7 } )
创建一个到期的cookie,对当前页面的路径有效:
Cookies . set ( 'name' , 'value' , { expires : 7 , path : '' } )
阅读cookie:
Cookies . get ( 'name' ) // => 'value'
Cookies . get ( 'nothing' ) // => undefined
阅读所有可见的饼干:
Cookies . get ( ) // => { name: 'value' }
注意:不可能通过传递一个cookie属性来读取特定的cookie(在撰写有关cookie时可能会或可能不使用它):
Cookies . get ( 'foo' , { domain : 'sub.example.com' } ) // `domain` won't have any effect...!
如果从.get()可见,则只有在.get()
上可用foo
的cookie;读取时域和/或路径属性不会产生效果。
删除cookie:
Cookies . remove ( 'name' )
删除有效到当前页面路径的cookie:
Cookies . set ( 'name' , 'value' , { path : '' } )
Cookies . remove ( 'name' ) // fail!
Cookies . remove ( 'name' , { path : '' } ) // removed!
重要的!删除cookie并且不依赖默认属性时,您必须通过完全相同的path
, domain
, secure
和sameSite
属性,这些属性用于设置cookie:
Cookies . remove ( 'name' , { path : '' , domain : '.yourdomain.com' , secure : true } )
注意:删除不存在的cookie既不会引起任何例外,也不会返回任何值。
如果与命名空间Cookies
发生冲突的危险, noConflict
方法将允许您定义一个新的名称空间并保留原始的空间。当在第三方站点上运行脚本时,这是一个特别有用的,例如,作为小部件或SDK的一部分。
// Assign the js-cookie api to a different variable and restore the original "window.Cookies"
var Cookies2 = Cookies . noConflict ( )
Cookies2 . set ( 'name' , 'value' )
注意:使用AMD或COMPORJS时,不需要使用.noConflict
方法,因此在这些环境中不会暴露出来。
该项目符合RFC 6265。使用cookie-name或cookie-value中不允许的所有特殊字符都使用每个人的UTF-8 HEX等效编码使用百分比编码。 cookie-name或cookie-value中唯一的字符是允许且仍在编码的角色是%
字符,它被逃脱了,以将百分比输入解释为字面。请注意,默认的编码/解码策略只能在JS-Cookie读/书写的cookie之间进行互操作。要覆盖默认编码/解码策略,您需要使用转换器。
注意:根据RFC 6265,如果您的饼干太大,或者同一域中的cookie太多,则可能会被删除。
cookie属性默认值可以通过通过withAttributes()
创建API的实例,也可以单独使用Cookies.set(...)
通过将普通对象作为最后一个参数来设置。每个属性覆盖默认属性。
定义何时删除cookie。价值必须是一个Number
,该数字将被解释为创建或Date
实例的天数。如果省略,cookie将成为会话cookie。
要创建一个在不到一天的时间内到期的饼干,您可以检查Wiki上的常见问题解答。
默认值:当用户关闭浏览器时,将删除cookie。
示例:
Cookies . set ( 'name' , 'value' , { expires : 365 } )
Cookies . get ( 'name' ) // => 'value'
Cookies . remove ( 'name' )
一个指示可见曲奇的路径的String
。
默认: /
示例:
Cookies . set ( 'name' , 'value' , { path : '' } )
Cookies . get ( 'name' ) // => 'value'
Cookies . remove ( 'name' , { path : '' } )
有关Internet Explorer的注意:
由于基础Wininet InternetgetCookie实现中的错误错误,IE的文档。如果将其设置为包含文件名的路径属性,则Cookie将不会返回cookie。
(来自Internet Explorer Cookie内部(FAQ))
这意味着一个人不能使用window.location.pathname
设置路径,以防该路径名包含一个so: /check.html
之类的文件名(或者至少无法正确读取此类cookie)。
实际上,您绝不应该允许不受信任的输入设置cookie属性,否则您可能会暴露于XSS攻击。
一个指示有效域String
应在其中可见。所有子域也可以看到cookie。
默认值: cookie仅在创建cookie的页面的域或子域中可见,除了Internet Explorer(见下文)。
示例:
假设在site.com
上创建的cookie:
Cookies . set ( 'name' , 'value' , { domain : 'subdomain.site.com' } )
Cookies . get ( 'name' ) // => undefined (need to read at 'subdomain.site.com')
有关Internet Explorer默认行为的注意:
Q3:如果我不指定域属性(对于)cookie,则无论如何将其发送到所有嵌套子域吗?答:是的,example.com上的cookie集将发送到sub2.sub1.example.com。在这方面,Internet Explorer不同于其他浏览器。
(来自Internet Explorer Cookie内部(FAQ))
这意味着,如果您省略了domain
属性,那么IE中的子域将是可见的。
是true
还是false
,表明Cookie传输是否需要安全协议(HTTPS)。
默认值:无安全协议要求。
示例:
Cookies . set ( 'name' , 'value' , { secure : true } )
Cookies . get ( 'name' ) // => 'value'
Cookies . remove ( 'name' )
一个String
,可以控制浏览器是否正在发送cookie以及跨站点请求。
默认值:未设置。
请注意,最近的浏览器即使没有在此处指定任何内容,也可以使默认值“ lax”。
示例:
Cookies . set ( 'name' , 'value' , { sameSite : 'strict' } )
Cookies . get ( 'name' ) // => 'value'
Cookies . remove ( 'name' )
const api = Cookies . withAttributes ( { path : '/' , domain : '.example.com' } )
创建一个覆盖默认解码实现的API的新实例。所有获得依赖适当解码工作的方法,例如Cookies.get()
和Cookies.get('name')
,将为每个cookie运行给定的转换器。返回的值将用作cookie值。
示例从读取只能使用escape
功能解码的cookie:
document . cookie = 'escaped=%u5317'
document . cookie = 'default=%E5%8C%97'
var cookies = Cookies . withConverter ( {
read : function ( value , name ) {
if ( name === 'escaped' ) {
return unescape ( value )
}
// Fall back to default for all other cookies
return Cookies . converter . read ( value , name )
}
} )
cookies . get ( 'escaped' ) // 北
cookies . get ( 'default' ) // 北
cookies . get ( ) // { escaped: '北', default: '北' }
创建一个API的新实例,该实例覆盖默认编码实现:
Cookies . withConverter ( {
write : function ( value , name ) {
return value . toUpperCase ( )
}
} )
npm i @types/js-cookie
查看服务器文档
查看贡献指南
应通过Release
github Action工作流进行发布,以便在NPMJS.COM上发布的软件包具有包装来源。
GitHub版本是作为草稿创建的,需要手动发布! (这是这样,我们能够在发布前制作合适的发行说明。)
非常感谢Browserstack免费提供无限制的浏览器测试。