首先我们要了解什么是json？
json：是一种基于JavaScript语法子集的开放标准数据交换格式，是存储和交换文本信息的语法。
它的优点：
---->是基于文本的，轻量级的，通常被认为易于读/写
---->是轻量级的文本数据交换格式
----->JSON格式能够直接为服务器端代码使用, 大大简化了服务器端和客户端的代码开发量
----->具有自我描述性，更易理解
----->跨语言交流
那么jsonp又是什么？
jsonp:是Json的一种使用模式，是一种请求的方式，主要用于解决主流浏览器的跨域数据访问问题
为什么要引入jsonp
由于浏览器的同源策略(阻止ajax提交等），就是网站的网页无法于不是网站域名的服务器进行沟通，这个应用场景主要产生的原因是在自己的网站中调用别人网站的资源，当用户在浏览器访问时，浏览器先去打开我们自己的网站，然后经过我们的网站在做一次跳转才能为用户返回资源，这样加载的时间就会大大加长，而且由于同源策略无法在自己的网站上直接调用资源所在的服务器，所以便引出jsonp。
jsonp是怎样解决这个问题的
主要是利用<script>元素的这个开放策略，网页可以从其他来源动态产生的json资料。用jsonp抓到的资料并不是json，而是任意的javascript，用javascript直译器执行而不是用json解析器解析。
主要就是用src这个属性进行跨域请求。
了解到这些下面就在Django上来实现。
urls.py(URL分发器【路由配置文件】）
本质：url与视图函数之间的映射关系，url的加载是从配置文件中开始的
from django.contrib import admin
from django.urls import path,re_path
from app import views
urlpatterns = [
path('admin/', admin.site.urls),
path('jsonp/',views.jsonp),
]views.py (视图函数）
from django.shortcuts import render,HttpResponse
from app import models
import requests
def images(request):
response = requests.get('https://api.jisuapi.com/weather/query?callback=list&appkey=e5de5fcbe1800420&city=%E5%AE%BF%E5%B7%9E')
response.encode = 'utf-8'
return render(request,'jsonp.html',{'res':response.text})jsonp.html (模板）
跨域执行的重要实现地
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
{{ res }}
<br>
<input value="点击" type="button" οnclick="getclick();">
<hr/>
<div id="container"></div>
<script>
function getclick(){
var tag = document.createElement('script');
tag.src = 'https://api.jisuapi.com/weather/query?callback=list&appkey=e5de5fcbe1800420&city=%E5%AE%BF%E5%B7%9E';
document.head.appendChild(tag);
document.head.removeChild(tag);
}
function list(arg){
document.getElementById("container").innerHTML = arg["result"]["city"];
console(arg);
}
</script>
</body>
</html>在上述代码中，
首先是在head下创建<script>标签，由src这个属性进行提交数据
---->原理和引入js是一样的
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>引入js时，首先浏览器打开这个网址，上面的网址再返回数据到浏览器上一个js文件，通过调用方法就可以实现js的操作。
js有两个函数一个是getclick();这个很好理解这个就是标签的点击函数。
另外一个是list(arg); arg这个参数便是跨域请求时返回过来的json数据，要在请求的网址上加上回调函数，一般为callback，这样的话要请求的网站可以根据你的回调函数进行返回数据，回调函数的值就是这个函数的名称list。
我们还可以使用ajax进行请求
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
{{ res }}
<br>
<input value="点击" type="button" οnclick="getclick();">
<hr/>
<div id="container"></div>
<script src="/static/jquery-1.12.4.js"></script>
<script>
function getclick() {
$.ajax({
url: 'https://api.jisuapi.com/weather/query?callback=list&appkey=e5de5fcbe1800420&city=%E5%AE%BF%E5%B7%9E',
type: 'POST',
dataType: 'jsonp',
jsonp: 'callback',
jsonpCallback: 'list'
});
}
function list(arg){
document.getElementById("container").innerHTML = arg["result"]["city"];
console(arg);
}
</script>
</body>
</html>在ajax中的url中可以去掉callback，首先ajax内部以jsonp的形式进行提交（dataType='jsonp'），jsonp: 'callback'和jsonpCallback: 'list'结合起来代表的就是callback=list。
在ajax里面封装的原理和创建<script>原理是相同。用ajax实现跨域在以后的工作中应该是比较常用的选择。
see you !!！
