深入解析javascript与asp.net对Cookie操作的异同,以及如何共用(一)。

简介: 原文 http://www.cnblogs.com/leleroyn/archive/2012/02/22/2362746.html 在网站开发过程中,不管是前台用javascript还是在后台用服务器端语言处理cookie,是作为一个web开发者都必须要熟练掌握的技能。

原文 http://www.cnblogs.com/leleroyn/archive/2012/02/22/2362746.html

在网站开发过程中,不管是前台用javascript还是在后台用服务器端语言处理cookie,是作为一个web开发者都必须要熟练掌握的技能。

相信大家在开发过程中都经常用到。然而如何让前端和后端同时获取同一份cookie我们还是需要花费上点心思。

下面我将着重介绍下这方面的见容:

1,首先多们用js向网站写入一cookie(单键值的比较容易,我这里只讲述下一个cookie下多键值的处理)

为了简单,这里我们用jquery.cookie.js插件来操作cookie,代码如下:

?
1
$.cookie( 'book' , 'sn=081245&title=你不能不知道的.net' );

执行后我们得到的结果是:

image

 

2,接下来我们用C#代码在后端来实现同样的功能,代码如下:

?
1
2
3
4
HttpCookie bookCookie = new HttpCookie( "book" );
            bookCookie[ "sn" ] = "081245" ;
            bookCookie[ "title" ] =  HttpUtility.UrlEncode( "你不能不知道的.net" );
            Response.AppendCookie(bookCookie);

image

细心的你一定发现其实里面的cookie其实有点还不一样,对那就是“=”在用jquery.cookie.js插件处理时也被编码啦,这样的结果当然不符合我们的目标的。

其实这不难理解,jquery.cookie.js内部把'sn=081245&title=你不能不知道的.net'当作一个字串给编码啦,那好,我们就去jquery.cookie.js修改下代码,把编码的工作交给我们自己来处理。

我们找到相应的代码

?
1
document.cookie = [name, '=' , encodeURIComponent(value), expires, path, domain, secure].join( '' );

 

修改为

?
1
document.cookie = [name, '=' , value, expires, path, domain, secure].join( '' );
这样我们上面的js的代码也要做相应的处理啦,修改后为:
?
1
function writeCookie()
?
1
2
3
{
   $.cookie( 'book' , 'sn=081245' + '&title=' +encodeURIComponent( '你不能不知道的.net' ));
}

经过这样的处理我们保证了前端各后端写入的cookie值是一致的,为后面的的读取作基础,下一篇我将继续讲述 cookie在前,后端读取一致,并提供相应源码下载。

本章需要注意的几点问题:

1,对于非英文和数字等一定要编码后再写入。

2,js和asp.net后台对应的编码函数为encodeURIComponent。

源码:猛击下载

 

原创文字只代表本人某一时间内的观点或结论,本人不对涉及到的任何代码担保。转载请标明出处!

目录
相关文章
|
7天前
|
缓存 JavaScript 前端开发
【JavaScript 技术专栏】DOM 操作全攻略:从基础到进阶
【4月更文挑战第30天】本文深入讲解JavaScript与DOM交互,涵盖DOM基础、获取/修改元素、创建/删除元素、事件处理结合及性能优化。通过学习,开发者能掌握动态改变网页内容、结构和样式的技能,实现更丰富的交互体验。文中还讨论了DOM操作在实际案例、与其他前端技术结合的应用,助你提升前端开发能力。
|
14天前
|
JavaScript 前端开发 C++
|
7天前
|
JSON 前端开发 JavaScript
【JavaScript技术专栏】JavaScript异步编程:Promise、async/await解析
【4月更文挑战第30天】JavaScript中的异步编程通过Promise和async/await来解决回调地狱问题。Promise代表可能完成或拒绝的异步操作,有pending、fulfilled和rejected三种状态。它支持链式调用和Promise.all()、Promise.race()等方法。async/await是ES8引入的语法糖,允许异步代码以同步风格编写,提高可读性和可维护性。两者结合使用能更高效地处理非阻塞操作。
|
1天前
|
SQL 缓存 JavaScript
深入解析JavaScript中的模板字符串
深入解析JavaScript中的模板字符串
13 1
|
1天前
|
JavaScript 前端开发 安全
javascript操作DOM的方法
javascript操作DOM的方法
|
1天前
|
JavaScript 前端开发
javascript操作BOM的方法
javascript操作BOM的方法
|
1天前
|
JavaScript 前端开发 容器
js操作dom元素
js操作dom元素
7 0
|
1天前
|
JavaScript 前端开发 索引
js操作字符串的方法
js操作字符串的方法
9 2
|
7天前
|
JavaScript 网络协议 数据处理
Node.js中的Buffer与Stream:深入解析与使用
【4月更文挑战第30天】本文深入解析了Node.js中的Buffer和Stream。Buffer是处理原始数据的全局对象,适用于TCP流和文件I/O,其大小在V8堆外分配。创建Buffer可通过`alloc`和`from`方法,它提供了读写、切片和转换等操作。Stream是处理流式数据的抽象接口,分为可读、可写、双工和转换四种类型,常用于处理大量数据而无需一次性加载到内存。通过监听事件和调用方法,如读取文件的可读流示例,可以实现高效的数据处理。理解和掌握Buffer及Stream能提升Node.js应用的性能。
|
8天前
|
JavaScript 前端开发 开发者
Node.js的包管理和npm工具深度解析
【4月更文挑战第30天】本文深入解析Node.js的包管理和npm工具。包管理促进代码复用和社区协作,包包含元数据描述文件`package.json`和入口文件。npm提供搜索、安装、发布等功能,通过命令行进行操作,如`install`、`search`、`uninstall`。npm支持版本控制、全局安装、脚本定义及私有仓库。理解和熟练运用npm能提升Node.js开发效率。