1):引入 jquery.cookie.js 

/*!
* jQuery Cookie Plugin v1.4.1
* https://github.com/carhartl/jquery-cookie
*
* Copyright 2006, 2014 Klaus Hartl
* Released under the MIT license
*/
(function(factory) {
if (typeof define === 'function' && define.amd) {
// AMD (Register as an anonymous module)
define([ 'jquery' ], factory);
} else if (typeof exports === 'object') {
// Node/CommonJS
module.exports = factory(require('jquery'));
} else {
// Browser globals
factory(jQuery);
}
}
(function($) { var pluses = /\+/g; function encode(s) {
return config.raw ? s : encodeURIComponent(s);
} function decode(s) {
return config.raw ? s : decodeURIComponent(s);
} function stringifyCookieValue(value) {
return encode(config.json ? JSON.stringify(value)
: String(value));
} function parseCookieValue(s) {
if (s.indexOf('"') === 0) {
// This is a quoted cookie as according to RFC2068,
// unescape...
s = s.slice(1, -1).replace(/\\"/g, '"').replace(/\\\\/g,
'\\');
} try {
// Replace server-side written pluses with spaces.
// If we can't decode the cookie, ignore it, it's unusable.
// If we can't parse the cookie, ignore it, it's unusable.
s = decodeURIComponent(s.replace(pluses, ' '));
return config.json ? JSON.parse(s) : s;
} catch (e) {
}
} function read(s, converter) {
var value = config.raw ? s : parseCookieValue(s);
return $.isFunction(converter) ? converter(value) : value;
} var config = $.cookie = function(key, value, options) { // Write if (arguments.length > 1 && !$.isFunction(value)) {
options = $.extend({}, config.defaults, options); if (typeof options.expires === 'number') {
var days = options.expires, t = options.expires = new Date();
t.setMilliseconds(t.getMilliseconds() + days * 864e+5);
} return (document.cookie = [
encode(key),
'=',
stringifyCookieValue(value),
options.expires ? '; expires='
+ options.expires.toUTCString() : '', // use
// expires
// attribute,
// max-age
// is
// not
// supported
// by
// IE
options.path ? '; path=' + options.path : '',
options.domain ? '; domain=' + options.domain : '',
options.secure ? '; secure' : '' ].join(''));
} // Read var result = key ? undefined : {},
// To prevent the for loop in the first place assign an empty
// array
// in case there are no cookies at all. Also prevents odd result
// when
// calling $.cookie().
cookies = document.cookie ? document.cookie.split('; ') : [], i = 0, l = cookies.length; for (; i < l; i++) {
var parts = cookies[i].split('='), name = decode(parts
.shift()), cookie = parts.join('='); if (key === name) {
// If second argument (value) is a function it's a
// converter...
result = read(cookie, value);
break;
} // Prevent storing a cookie that we couldn't decode.
if (!key && (cookie = read(cookie)) !== undefined) {
result[name] = cookie;
}
} return result;
}; config.defaults = {}; $.removeCookie = function(key, options) {
// Must not alter options, thus extending a fresh object...
$.cookie(key, '', $.extend({}, options, {
expires : -1
}));
return !$.cookie(key);
}; }));

2):引入 jquery.base64.js (这是自己写的 js )

(function ($) {

    var _keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";

    $.extend({
"Base64encode": function (e) {
var t = "";
var n, r, i, s, o, u, a;
var f = 0;
e = $.Base64_utf8_encode(e);
while (f < e.length) {
n = e.charCodeAt(f++);
r = e.charCodeAt(f++);
i = e.charCodeAt(f++);
s = n >> 2;
o = (n & 3) << 4 | r >> 4;
u = (r & 15) << 2 | i >> 6;
a = i & 63;
if (isNaN(r)) {
u = a = 64
} else if (isNaN(i)) {
a = 64
}
t = t + _keyStr.charAt(s) + _keyStr.charAt(o) + _keyStr.charAt(u) + _keyStr.charAt(a)
}
return t
},
"Base64decode": function (e) {
var t = "";
var n, r, i;
var s, o, u, a;
var f = 0;
e = e.replace(/[^A-Za-z0-9+/=]/g, "");
while (f < e.length) {
s = _keyStr.indexOf(e.charAt(f++));
o = _keyStr.indexOf(e.charAt(f++));
u = _keyStr.indexOf(e.charAt(f++));
a = _keyStr.indexOf(e.charAt(f++));
n = s << 2 | o >> 4;
r = (o & 15) << 4 | u >> 2;
i = (u & 3) << 6 | a;
t = t + String.fromCharCode(n);
if (u != 64) {
t = t + String.fromCharCode(r)
}
if (a != 64) {
t = t + String.fromCharCode(i)
}
}
t = $.Base64_utf8_decode(t);
return t
},
"Base64_utf8_encode": function (e) {
e = e.replace(/rn/g, "n");
var t = "";
for (var n = 0; n < e.length; n++) {
var r = e.charCodeAt(n);
if (r < 128) {
t += String.fromCharCode(r)
} else if (r > 127 && r < 2048) {
t += String.fromCharCode(r >> 6 | 192);
t += String.fromCharCode(r & 63 | 128)
} else {
t += String.fromCharCode(r >> 12 | 224);
t += String.fromCharCode(r >> 6 & 63 | 128);
t += String.fromCharCode(r & 63 | 128)
}
}
return t
},
"Base64_utf8_decode": function (e) {
var t = "";
var n = 0;
var r = c1 = c2 = 0;
while (n < e.length) {
r = e.charCodeAt(n);
if (r < 128) {
t += String.fromCharCode(r);
n++
} else if (r > 191 && r < 224) {
c2 = e.charCodeAt(n + 1);
t += String.fromCharCode((r & 31) << 6 | c2 & 63);
n += 2
} else {
c2 = e.charCodeAt(n + 1);
c3 = e.charCodeAt(n + 2);
t += String.fromCharCode((r & 15) << 12 | (c2 & 63) << 6 | c3 & 63);
n += 3
}
}
return t
}
});
})(jQuery);

3):cookie_0.1.js  封装 (这是自己写的 js)

/**
* 全局cookies操作
*/
(function ($) { /**
* 设置cookie
*/
$.setCookie = function (key, value, expires) {
/*var _key = $.base64.encode(encodeURIComponent(key));*/
if (value) {
if (typeof value == "object" || typeof value == "number") {
value = JSON.stringify(value);
}
value = $.Base64encode(value);
}
var options = {path: '/'};
if (expires) {
options.expires = expires;
}
return $.cookie(key, value, options);
}; /**
* 获取cookie
*/
$.getCookie = function (key) {
/*var _key = $.base64.encode(encodeURIComponent(key));*/
var value = $.cookie(key);
if (value) {
value = $.Base64decode(value);
value = decodeURIComponent(value);
try {
value = JSON.parse(value);
} catch (e) {
}
}
return value;
}; /**
* 清理cookie
*/
$.cleanCookie = function (key) {
$.removeCookie(key, {path: '/'});
return !$.cookie(key);
}; }(jQuery));

4):使用  

CookieUtil:在 本博客 java 分类中

    @RequestMapping("add")
public String add(HttpServletResponse response) {
CookieUtil.addCookie(response, "string", "string", 0);
Map<String, String> map = new HashMap<String, String>() {{
put("a", "a");
}};
CookieUtil.addCookie(response, "map", JSON.toJSONString(map), 0);
return "OK";
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CookiePage</title>
<script src="/js/jquery-3.2.0.min.js"></script>
<script type="text/javascript" src="/js/cookie/jquery.cookie.js"></script>
<script src="/js/cookie/jquery.base64.js"></script>
<script type="text/javascript" src="/js/cookie/cookie_0.1.js"></script>
</head>
<body>
<script type="text/javascript"> $(function () { var _string = $.getCookie("string");
var _map = $.getCookie("map"); alert(_string + "--" + _map["a"]);
}); </script>
</body>
</html>

通过上述编写 可读|可写|可删

coding++:js实现基于Base64的编码及解码的更多相关文章

  1. 在LoadRunner中进行Base64的编码和解码

    <Base64 Encode/Decode for LoadRunner>这篇文章介绍了如何在LoadRunner中对字符串进行Base64的编码和解码: http://ptfrontli ...

  2. 利用openssl进行base64的编码与解码

    openssl可以直接使用命令对文件件进行base64的编码与解码,利用openssl提供的API同样可以做到这一点. 废话不多说,直接上代码了.需要注意的是通过base64编码后的字符每64个字节都 ...

  3. javascript中的Base64.UTF8编码与解码详解

    javascript中的Base64.UTF8编码与解码详解 本文给大家介绍的是javascript中的Base64.UTF8编码与解码的函数源码分享以及使用范例,十分实用,推荐给小伙伴们,希望大家能 ...

  4. js和C#中的编码和解码

    同一个字符串,用URL编码和HTML编码,结果是完全不同的. JS中的URL编码和解码.对 ASCII 字母和数字及以下特殊字符无效: - _ . ! ~ * ' ( ) ,/?:@&=+$# ...

  5. [Swift]扩展String类:Base64的编码和解码

    扩展方式1: extension String { //Base64编码 func encodBase64() -> String? { if let data = self.data(usin ...

  6. 利用window对象自带atob和btoa方法进行base64的编码和解码

    项目中一般需要将表单中的数据进行编码之后再进行传输到服务器,这个时候就需要base64编码 现在可以使用window自带的方法window.atob() 和  window.btoa()  方法进行 ...

  7. js与java encodeURI 进行编码与解码

    JS escape()使用转义序列替换某些字符来对字符串进行编码  JavaScript 中国 编码后 JavaScript %u4E2D%u56FD unescape()对使用   encodeUR ...

  8. 在 Java 中如何进行 BASE64 编码和解码

    BASE64 编码是一种常用的字符编码,在很多地方都会用到.JDK 中提供了非常方便的 BASE64Encoder 和 BASE64Decoder,用它们可以非常方便的完成基于 BASE64 的编码和 ...

  9. js实现base64编码与解码(原生js)

    一直以来很多人使用到 JavaScript 进行 base64 编码解码时都是使用的 Base64.js,但事实上,浏览器很早就原生支持 base64 的编码与解码了 以前的方式 编码: <ja ...

随机推荐

  1. sofa-bolt源码阅读(1)-服务端的启动

    Bolt服务器的核心类是RpcServer,启动的时候调用父类AbstractRemotingServer的startup方法. com.alipay.remoting.AbstractRemotin ...

  2. java快速开发平台可视化开发表单

    XJR java快速开发平台,简单的理解就是:开发人员以某种编程语言或者某几种编程语言(比如:目前流行的多种web技术,包括springboot, JPA,Druid, Activiti,Lombok ...

  3. 前端H5,点击选择图片控件,图片直接在页面上展示~

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. vmware企业虚拟化平台vSphere管理与配置

    ├─1-CCIE-DC课程介绍.avi ├─2-vSphere-简介.avi ├─3-vSphere-新功能介绍.avi ├─4-vSphere-授权介绍.avi ├─5-vSphere-课程拓扑介绍 ...

  5. intel硬件视频加速介绍

    目录 硬件视频加速技术 intel 硬件加速技术 intel 的开源媒体栈 VA-API 安装 样例 Intel Quick Sync(QSV) API支持情况 vaapi/mfx比较 安装 样例 硬 ...

  6. linux 安装 memcached

    1.Linux系统安装memcached,首先要先安装libevent库. yum install libevent libevent-deve 2.安装memcached yum install - ...

  7. Oracle - 坏块修复(一)

    一.概述 本文将介绍如何模拟坏块,以及出现坏块该如何修复.实验分为以下几个步骤. 1. 表出现坏块 2. 索引出现坏块 二.环境准备 本实验都是在oracle 11G归档模式下进行. 1. 准备相关表 ...

  8. vue-element-admin 模板 登录页面 post请求通过django的csrf认证,处理304错误

    经过一天的研究,终于把 vue-admin-template 模板的 post 请求 和django的api 弄通了 没有了那该死的304报错了 直接贴代码: 在main.js中 我直接给设置了一个 ...

  9. 【11】openlayers 地图交互

    地图交互interaction 关于map的方法: //添加地图交互 map.addInteraction(interaction) //删除地图交互 map.removeInteraction(in ...

  10. 前端BOM和DOM

      前端基础之BOM和DOM   前戏 到目前为止,我们已经学过了JavaScript的一些简单的语法.但是这些简单的语法,并没有和浏览器有任何交互. 也就是我们还不能制作一些我们经常看到的网页的一些 ...