6.21 作业疑问

一、利用jQery实现跨域请求

  疑问点:

  1.什么是跨域请求

  答:不同域名之间的相互访问

  2.xhr = XmlHttpRequest()?  的作用代表什么;

  答:Ajax 是用XmlHttpRequest来完成请求的。

  3.Ajax请求操作;

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="http://www.coob.com:8000/statics/jquery.cookie.js"></script>
    <script src="{{static_url('jquery-3.2.1.min.js')}}"></script>
</head>
<body>
    <div>Welcome home of coob</div>
    <input type="button" value="Ajax" onclick="DoAjax()">
    <script>
        function DoAjax() {
            $.ajax({
//              提交到那个网页
                url:"/index",
//              提交的方式
                type:"POST",
//              传入的内容
                data:{"k1":"v1"},
//              #表示执行成功执行这个函数  arg 表示后台write的内容
                success:function (arg) {
                    console.log(arg)
                }
            })
        }
    </script>
</body>



</html>
jQuery Ajax 的基本演示

  4.hosts是干什么的;

  答:路径(windows/system32/drivers/etc/hosts );可以修改IP地址的域名 www.coob.com 等等  (一个ip地址可以有多个域名);

  5.callback  是什么;

  答:jsonpCallBack:"func"     用于接收后台发的数据

  6.CORS 是什么;

  答:cors 是ajax的跨域请求,不是利用<script>的方式,而是有两种方式:简单的和复杂的。

  

  

  习题:

  1.通过ti访问t2静态文件中的jQery.cookie;

  setting  设置中  值一定要是对应静态文件的名称 ( tmd 这个坑坑的我好惨)"static_url_prefix":"/statics/"

  2.访问江西卫视,并把拿到的数据 显示的页面上;

  3.ajax jsonp  请求与接受数据

       $.ajax({
//           跨域地址
           url:"http://www.mary.com:8001/index",  
//           相当于创建一个script标签  并scr的值是 url  获取值后删除
           dataType:"jsonp",
//           相当于是创建了一个名为func的函数 等待接受
           jsonpCallBack:"func()"
Ajax_jsonp
        function DoAjax() {
//            var tager = document.createElement("script");
//            tager.src = "http://www.mary.com:8001/index";
//            document.head.appendChild(tager);
//            document.head.removeChild(tager)
原始方法

  3.CORS简单的实现方法;

  简单的请求方式有 post 、get  及 ajax   的参数 type值为 post、get。 

请求方式下添加一条 即可实现ajax的跨域请求

self.set_header("Access-Control-Allow-Origin","http://www.coob.com:8000")   #指定域名可以访问
post 简单的跨域请求

 

  4.CORS复杂请求的实

需要把请求头放在options 中才可以成功  这就叫做复杂请求



    def options(self, *args, **kwargs):
        self.set_header("Access-Control-Allow-Origin", "*")
        self.set_header("Access-Control-Allow-Methods", "PUT")

    def put(self, *args, **kwargs):
        self.set_header("Access-Control-Allow-Origin", "*")
        self.write("PUT 成功")    
cors的 put复杂方式请求

def option(self, *args, **kwargs)

  self.set_header("Access-Control-Allow-Origin", "*")  

  self.set_header("Access-Control-Allow-Methods", "PUT")   # 对应 客服端   type:"put"

  self.set_header("Access-Control-Allow-Headers", "k1")       #对应的  客户端 headers:{"k1":"k2"}

 

  

 

posted @ 2017-06-21 15:50  鸽子灬  阅读(135)  评论(0编辑  收藏  举报