cgb2010-京淘我的项目Day16

1.对于.html文件拦挡的阐明

1.1 问题形容

阐明1.:图中的后缀代表着什么?
.html: 动态页面/动静页面 动态页面.

2.对于动态页面的阐明:
当用户拜访:https://i-item.jd.com/1000176... 依据itemId查问相干的商品的信息.之后通过JS在指定的地位中展示商品数据.

3.对于url中取值的阐明:
因为商品的ID号为于URL中 而后端程序须要通过url中的Id查问数据信息.所以这里的取值形式必然是restFul的格调…

4.SpringMVC应该如何拦挡申请门路???
url1:localhost:8091/items/addUser
url1:localhost:8091/items/updateItem
url1:localhost:8091/items/100100.html
@RequestMapping("/items/{itemId}.html")
阐明:如果须要实现该性能,则应该拦挡.html结尾的申请.

1.2 对于.html拦挡的阐明

默认的条件下 SpringMVC只拦挡前缀型申请. 如果遇到动态资源的申请.则个别默认的条件下.去查问webapp中的文件.
问题: 如何让程序被SpringMVC拦挡呢?

1.3 开启后缀类型匹配

阐明:通过配置文件,要求SpringMVC拦挡后缀型申请. 以.html为例

1.4 为什么要以.html结尾

阐明:因为当初的电商网站,都须要搜索引擎进行引流. 认为了让搜索引擎更加容易的记录网站的内容.个别页面信息都是以.html结尾的.
论断: 个别的搜索引擎只记录.html的动态页面信息. 这样做的目标能够无效的减少搜索引擎的曝光率.

1.5 搜索引擎工作原理

倒排索引: 依据关键字,检索文章的地位.

2 跨域相干阐明

2.1 同域测试

2.1.1 JSON数据批改

2.1.2 页面JS剖析

2.1.3 测试后果

2.1.4 后果阐明

URL申请地址: http://manage.jt.com:80/test.html
Ajax申请地址: http://manage.jt.com:80/test.json

剖析后果: 1.申请协定雷同
2.申请域名雷同
3.申请端口号雷同

2.2 跨域测试

2.2.1 jt-web服务器页面阐明

2.2.2 问题阐明

通过上述的申请,是无奈获取数据的.
起因:
URL地址: http://www.jt.com:80/test.html
Ajax地址: http://manage.jt.com:80/test.json

问题: 协定雷同
域名不同
端口号雷同

2.3 同源策略

同源策略:
当用户拜访页面时并且页面发动Ajax申请时.要求协定://域名:端口号必然雷同.
同域拜访
如果雷同则满足同源策略. 网络能够失常的通信.
跨域拜访
当协定://域名:端口有一条不满足,则该申请为跨域申请. 如果为跨域申请 则浏览器不予解析返回值.

2.4 同源策略扩大

考题:
http://manage.jt.com:80/a.js
http://127.0.0.1:8091/b.js 跨域

2.5 对于同源策略总结

执行者: 只有浏览器参加执行,才会有同源的问题…
策略约定: 协定://域名:端口 三者缺一不可.
跨域问题发起者: Ajax申请. 如果没有ajax参加 不能称之为跨域.
结果: 如果跨域了,则程序仍然能够失常的执行.然而客户端拿不到后果的. 出于安全性思考.浏览器不予解析返回值.

2.6 JSONP

2.6.1 JSONP介绍

JSONP(JSON with Padding)是JSON的一种“应用模式”,可用于解决支流浏览器的跨域数据拜访的问题。因为同源策略,一般来说位于 server1.example.com 的网页无奈与不是 server1.example.com的服务器沟通,而 HTML 的

注意事项: JSONP如果须要应用个别用来获取资源GET类型.而不是提交数据.(POST类型)
起因: javaScript中的src属性 只能反对GET申请类型.

2.6.2 JSONP原理阐明

1).基于javaScript中的src属性实现近程数据拜访.

<script type="text/javascript" src="http://manage.jt.com/test.json"></script>

2).自定义回调函数

3).将返回值进行非凡的格局封装
语法: callback(JSON数据)

2.6.3 对于JSONP优化

问题:
1). 惯例的近程申请,还是采纳ajax模式居多.是否将jsonp办法与Ajax联合呢?
2). 每次发动JSONP申请时,都须要自定义回调函数 比拟繁琐.
3). 如果前后端须要实现调用,则须要对立回调函数名称. 最好的形式能够将回调函数当做参数进行传递. callback(JSON)

`<!DOCTYPE html><html><head><meta charset="UTF-8"><title>JSONP测试</title><script type="text/javascript" src="http://manage.jt.com/js/jquery-easyui-1.4.1/jquery.min.js"></script><script type="text/javascript">    $(function(){        alert("测试拜访开始!!!!!")        $.ajax({            url:"http://manage.jt.com/web/testJSONP",            type:"get",                //jsonp只能反对get申请            dataType:"jsonp",       //dataType示意返回值类型            //jsonp: "callback",    //指定参数名称            jsonpCallback: "hello",  //指定回调函数名称            success:function (data){   //data通过jQuery封装返回就是json串                console.log("回调函数执行胜利!!!!!")            }            });        })</script></head><body>    <h1>JSON跨域申请测试</h1></body></html>

2.6.4 对于JSONP后端业务调用

`package com.jt.web.controller;import com.jt.pojo.ItemDesc;import com.jt.util.ObjectMapperUtil;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.RestController;import java.util.Date;@RestControllerpublic class JSONPController {    //返回值要求:  callback(json串)   @RequestMapping("/web/testJSONP")    public String jsonp(String callback){        ItemDesc itemDesc = new ItemDesc();        itemDesc.setItemId(1000L).setItemDesc("JSONP调用胜利!!!")                .setCreated(new Date()).setUpdated(new Date());        String json = ObjectMapperUtil.toJSON(itemDesc);        return callback + "( " + json + ")";    }}

2.6.4 对于JSONP后端业务调用(二)

2.7 CORS

2.7.1 CORS介绍(跨域资源共享)

CORS须要浏览器和服务器同时反对。目前,所有浏览器都反对该性能,IE浏览器不能低于IE10。
整个CORS通信过程,都是浏览器主动实现,不须要用户参加。对于开发者来说,CORS通信与同源的AJAX通信没有差异,代码齐全一样。浏览器一旦发现AJAX申请跨源,就会主动增加一些附加的响应头信息.如果后端服务器容许资源共享则会在响应头中标识是否容许拜访.
因而,实现CORS通信的要害是服务器

2.7.2 CORS工作原理

2.7.3 CORS入门案例

2.7.4 对于响应头的阐明

阐明:如果服务器端容许跨域,则会在响应头中,增加服务器信息.

3.京淘单点登录业务jt-sso

3.1 实现登录/注册页面跳转

3.1.1 编辑UserController

3.1.2 页面JSONP标识

3.1.3 页面JS标识

快捷键: eclipse的快捷键: ctrl + h

3.1.4 业务接口文档