JSONP产生背景

1.跨域的安全限制都是对浏览器端来说的，服务器端是不存在跨域安全限制的。

2.浏览器的同源策略限制从一个源加载的文档或脚本与来自另一个源的资源进行交互。

3.如果协议，端口和主机对于两个页面是相同的，则两个页面具有相同的源，否则就是不同源的。

4.如果要在js里发起跨域请求，则要进行一些特殊处理了。或者，你可以把请求发到自己的服务端，再通过后台代码发起请求，再将数据返回前端。也可以通过我们今天讲解的JSONP方式在前端页面进行请求。

环境：

python3.7

django2.x

例子

1.通过后台服务端进行对其他域的请求：

urls.py

 from django.contrib import admin

 from django.urls import path,re_path,include  from app02 import  views as views2

 urlpatterns = [

     path('admin/', admin.site.urls),

     path("req/",views2.req)

 ]

views.py

 from django.shortcuts import render

 import requests

 # Create your views here.

 def req(request):

     response = requests.get("http://www.jxntv.cn/data/jmd-jxtv2.html?callback=list&_=14543768704003")

     response.content # 字节类型的

     response.encoding = 'utf-8'

     print(response.text) #字符串类型

     return  render(request,'req.html',{"result":response.text})

req.html

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <h1>后台获取结果</h1>

    {{ result }}

</body>

</html>

2.通过XHR直接发送GET进行跨域的请求：

req.html

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Title</title>

 </head>

 <body>

     <h1>后台获取结果</h1>

     {{ result }}

     <h1>JS直接获取结果</h1>

     <input type="button" value="获取数据" onclick="getContent();">

     <div id="container"></div>

     <script>

         function getContent(){

             var xhr = new XMLHttpRequest();

             xhr.open('GET','http://www.jxntv.cn/data/jmd-jxtv2.html?callback=list&_=14543768704003');

             xhr.onreadystatechange = function(){

                 console.log(xhr.responseText);

             }

             xhr.send();

     </script>

 </body>

 </html>

3.通过XHR模拟JSONP进行跨域的请求：

req.html

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <h1>后台获取结果</h1>

    {{ result }}

    <h1>JS直接获取结果</h1>

    <input type="button" value="获取数据" onclick="getContent();">

    <div id="container"></div>

    <script>

        function getContent(){

            var tag = document.createElement('script');

            tag.src= 'http://www.jxntv.cn/data/jmd-jxtv2.html?callback=list&_=14543768704003';

            document.head.appendChild(tag); // 表示创建一个标签，并且放到head中

            document.head.removeChild(tag);

        }

        function list(arg){

            console.log(arg);

        }

    </script>

</body>

</html>

python&JSONP（初级篇）的更多相关文章

  1. python 面向对象初级篇

    Python 面向对象(初级篇) 概述 面向过程:根据业务逻辑从上到下写垒代码 函数式:将某功能代码封装到函数中,日后便无需重复编写,仅调用函数即可 面向对象:对函数进行分类和封装,让开发" ...

  2. python之初级篇2

    一.数字类型 1)整数 int 类型 - bit_length() # 查询以二进制表示一个数字的值所需的位数 - int.from_bytes(bytes,byteorder) # 返回给定字节数组 ...

  3. Python 正则表达式入门（初级篇）

    Python 正则表达式入门(初级篇) 本文主要为没有使用正则表达式经验的新手入门所写. 转载请写明出处 引子 首先说 正则表达式是什么? 正则表达式,又称正规表示式.正规表示法.正规表达式.规则表达 ...

  4. Python开发【第七篇】：面向对象 和 python面向对象（初级篇）（上）

    Python 面向对象(初级篇)   51CTO同步发布地址:http://3060674.blog.51cto.com/3050674/1689163 概述 面向过程:根据业务逻辑从上到下写垒代码 ...

  5. 【转】Python 面向对象（初级篇）

    [转]Python 面向对象(初级篇) 51CTO同步发布地址:http://3060674.blog.51cto.com/3050674/1689163 概述 面向过程:根据业务逻辑从上到下写垒代码 ...

  6. 转载 Python 正则表达式入门（初级篇）

    Python 正则表达式入门(初级篇) 本文主要为没有使用正则表达式经验的新手入门所写.转载请写明出处 引子 首先说 正则表达式是什么? 正则表达式,又称正规表示式.正规表示法.正规表达式.规则表达式 ...

  7. python_way ,day7 面向对象 （初级篇）

    面向对象 初级篇   python支持 函数 与 面向对象   什么时候实用面向对象? 面向对象与函数对比 类和对象 创建类 class 类名 def 方法名(self,xxxx) 类里面的方法,只能 ...

  8. Python开发【第七篇】：面向对象 和 python面向对象进阶篇(下)

    Python开发[第七篇]:面向对象   详见:<Python之路[第五篇]:面向对象及相关> python 面向对象(进阶篇)   上一篇<Python 面向对象(初级篇)> ...

  9. Python 面向对象 (进阶篇)

    <Python 面向对象(初级篇)>文章介绍了面向对象基本知识: 面向对象是一种编程方式,此编程方式的实现是基于对 类 和 对象 的使用 类 是一个模板,模板中包装了多个“函数”供使用(可 ...

  10. python正则表达式入门篇

    文章来源于:https://www.cnblogs.com/chuxiuhong/p/5885073.html Python 正则表达式入门(初级篇) 本文主要为没有使用正则表达式经验的新手入门所写. ...

随机推荐

  1. 逆向学习-PE文件格式

    从DOS头到节区头是PE头部分,其下的节区合称PE体.文件中使用偏移(offset),内存中使用VA(Virtual Address,虚拟地址)来表示位置.文件加载到内存时,情况就会发生变化(节区的大 ...

  2. centos7下安装docker（dockerfile常用的指令）

    FROM:指定ase镜像 MAINTAINER:设置镜像作者,可以是任意字符 COPY:将文件从build  context复制到镜像.支持两种形式:1.COPY src dest 2.COPY [“ ...

  3. jeecg入门操作—表单界面

    一.搭建jeecg开发环境 参考环境搭建步骤 https://www.cnblogs.com/dyh004/p/10687633.html 二.创建用户数据库表: 登录上jeecg平台,点击在线开发- ...

  4. IO模型介绍

    先理解几个问题: (1)为什么读取文件的时候,需要用户进程通过系统调用内核完成(系统不能自己调用内核)什么是用户态和内核态?为什么要区分内核态和用户态呢? 在 CPU 的所有指令中,有些指令是非常危险 ...

  5. Riccati方程(微分方程)

    形如:$$\frac{dy}{dx}=P(x)y^{2}+Q(x)y+R(x)$$ 其中P(x).Q(x).R(x)是连续可微函数 或形如 $$\frac{dy}{dx}=ay^{2}+\frac{k ...

  6. OpenStack端口（15）

    一.OpenStack组件使用的默认端口号 openstack openstack service default ports port type keystone Identity service ...

  7. Flutter内置ICON

    由于有时打不开flutter的icon官网 https://material.io/tools/icons/?style=baseline 截图存下icon 如果看不清  Ctrl +   恢复Ctr ...

  8. 2019-04-16 SpringMVC 学习笔记

    1. 配置过程: ① 配置servlet(org.springframework.web.servlet.DiapatcherServlet)拦截请求 ② SpringMVC的默认配置文件:servl ...

  9. 使用Yii2的Web框架搭建微服务框架

    方法 使用自己的Yii2镜像作为基础 使用Yii2的Web框架搭建,为了节省搭建Yii2框架的时间,直接使用现有的Yii2项目,删除了业务相关的逻辑类,将这个代码库作为搭建微服务框架的基础,本身已经积 ...

  10. PHP7中的数据类型

    PHP中变量名→zval,变量值→zend_value.其变量内存是通过引用计数管理的,在PHP7中引用计数在value结构中. 变量类型: 头文件在PHP源码 /zend/zend_types.h ...