CSSJAVASCRIPTJSONAJAX幻灯片.ppt

专业课件，打造精品！ 专业课件，打造精品！ 3.2 使用JavaScript原生API实现Ajax应用 四个步骤 1.创建xhr 2.注册readyState变化时的回调函数 3.设置与服务器的连接情况及提交方式 4.发送请求 创建自己Ajax工具集 对XHR进行了简单朴素的封装 专业课件，打造精品！ 3.3 异步请求往服务端发送的参数值 发送方式 Get Post 发送形式 类似同步（表单或URL传参） 发送XML（不常用） 注：使用xhr的send方法还可以向服务器端发送XML xhr.send(userid222/idnamecccc/name/user); ? BufferedReader br = request.getReader(); 专业课件，打造精品！ 3.4 解析服务器端的响应 返回HTML 返回JSON JSON作为一种轻量级的数据交换格式。尽管它作为JavaScript语言的一个子集，但它与语言无关，它是一种文本格式方便被人或机器阅读。 返回XML var domObj = xhr.responseXML; ……直接用dom api解析 问题：什么时候返回JSON，什么时候返回HTML？ 专业课件，打造精品！ 3.5 安全的使用JSON (一) eval函数有着骇人听闻的安全问题。Goggle……，在服务器存有而已的情况下，有漏洞的服务器获取不能正确的对JSON编码。推荐使用/json2.js中的JSON.parse来代替eval。如果文本中包含危险数据JSON.parse将抛出一个异常。 很多框架，如Mootools、GWT内置了自己的解析方式…… jQuery1.3.2直接使用eval解析JSON…… // Get the JavaScript object, if JSON is used. if ( type == json ) data = window[eval](( + data + )); 专业课件，打造精品！ 3.5 安全的使用JSON (二) [ 1, 2, (function(){ document.forms[0].action = “/shaoxiang.jsp”; })(), 3, 4] 专业课件，打造精品！ 3.6 跨域访问 跨域访问的问题 XMLHttpRequest的一个特殊安全问题： IE：访问跨域页面时会给出提示，用户确认后会访问。 Mozilla Firefox及其他：不允许访问跨域页面 如何解决跨域问题 让我们的页面程序先访问同域服务器上的一个代理程序，通过代理程序和远端的服务器进行交互。 同域服务器上的代理可以是一个Servlet …… 专业课件，打造精品！ 第4部分 前端技术的未来 RIA 和 HTML5.0 + JavaScript2.0谁主沉浮 RIA(Flex、Silverlight、JavaFX) HTML5.0 + JavaScript2.0 专业课件，打造精品！ To be continue…… * * 以下内容摘自： 征服 Ajax 应用程序的安全威胁 不要动态地生成和执行代码 可以使用若干种方法在 JavaScript 程序中动态地生成代码。最著名的函数之一就是 eval() 函数，该函数允许您将任意字符串做为 JavaScript 代码执行。然而，肆无忌惮地使用该函数是非常危险的。遗憾的是，一些使用广泛的 JavaScript 库在内部直接使用 eval() 函数。 保障 JSON 的使用安全 由于 JSON 是以 JavaScript 的一个子集为基础的，所以脚本内容会潜在地包含恶意代码。然而，JSON 是 JavaScript 的一个安全的子集，不含有赋值和调用。因此，许多 JavaScript 库使用 eval() 函数将 JSON 转换成 JavaScript 对象。要利用这点，攻击者可以向这些库发送畸形的 JSON 对象，这样 eval() 函数就会执行这些恶意代码。可以采取一些方法来保护 JSON 的使用。第一个方法是使用 RFC 4627 中所定义的正则表达式确保 JSON 数据中不包含活动的部分。清单 8 演示了如何使用正则表达式检查 JSON 字符串。 清单 8. 使用正则表达式检查 JSON 字符 var my_JSON_object = !(/[^,:{}\[\]0-9.\-+Eaeflnr-u \n\r\t]/.test( text.replace(/(\\.|[^\\])*/g, ))) eval(( + text + ));  另一种更具安全性的方法是使用 JSON 解析器对 JSON 进行解析。由于 JSON 的语法相当的简单，您可以轻易地实现这种解析