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. C#使用异步操作时的注意要点(翻译)

    异步操作时应注意的要点 使用异步方法返回值应避免使用void 对于预计算或者简单计算的函数建议使用Task.FromResult代替Task.Run 避免使用Task.Run()方法执行长时间堵塞线程 ...

  2. C语言中printf,scanf,puts,%%等输出格式

    #include<stdio.h> int main(void){    int a;    printf("请输入一个整数,程序求取他的最后一位数字:");    s ...

  3. 使用队列实现栈(1)(Java)

    class MyStack { private Queue q1; private Queue q2; public MyStack(int size) { this.q1 = new Queue(s ...

  4. 米卡 Mica Logo 存放处

  5. 手指向上滑动跳转页面的JQ方法

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. 解决IOS微信浏览器底部会出现向前向后返回按钮,返回不刷新的问题

    <script type="text/javascript"> //解决IOS返回页面不刷新的问题 var isPageHide = false; window.add ...

  7. 百度地图失去坐标html

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  8. Ffmpeg使用

    ffmpeg官网 刚开始安装的推荐博客|--利用FFmpeg 开发音视频流:一.二.三 1.分辨率码率 主要视频格式与码率: 分辨率 200p——对应的码率是256kpbs,也就是说,一分钟需要流量1 ...

  9. 单元测试之Fixture

    声明: 作者:zhaojun  创建日期:2017-08-04  更新日期:2017-08-07 一.什么是Fixture,Fixture有什么作用,为什么需要使用Fixture # 下载 pip i ...

  10. Jupyter Notebook不能在系统命令行里全局启动

    Anaconda安装好Juypyter Notebook之后,只能在base环境里启动,在系统的命令行里要全局启动Jupyter NoteBook失败了 C:\Users\HP>jupyter ...