1 # -*- coding: utf-8 -*-
2 from flask import Flask, jsonify
3 import psutil, time,json
4
5 app = Flask(__name__)#实例化app对象
6
7 @app.route('/test_post/aa', methods=['GET','POST'])#路由
8 def test_post():
9
10 memKeys = ["total", "available", "percent", "used", "free"]#查看内存信息
11 memVaules = psutil.virtual_memory()
12 memInfo = dict(zip(memKeys, memVaules))
13 memInfo = {k: str(v / pow(1024.0, 3)) + 'GB' for k,
14 v in memInfo.items() if k != 'percent'}
15 memInfo['percent'] = psutil.virtual_memory().percent
16 return "successCallback"+"("+json.dumps(memInfo)+")"#将结果以json形式返回,通过jsonp与前台交互
17
18
19
20 if __name__ == "__main__":
21 app.run(
22 host = '0.0.0.0',#任何ip都可以访问
23 port = 7777,#端口
24 debug = True
25 )

接下来是前台代码

<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.js"></script>
<script>
$('#search').click(function () {
$.ajax({
type: 'GET',
url: 'http://192.168.1.106:7777/test_post/aa',
dataType: 'jsonp', //希望服务器返回json格式的数据
jsonp: "callback",
jsonpCallback: "successCallback",//回调方法
success: function (data) {
console.log(data);
} });
});
</script>

接下来就可以看到控制台数据了

flask+jsonp跨域前后台交互(接口初体验)的更多相关文章

  1. JSONP -- 跨域数据交互协议

    一.概念 ①传统Ajax:交互的数据格式——自定义字符串或XML描述: 跨域——通过服务器端代理解决. ②如今最优方案:使用JSON格式来传输数据,使用JSONP来跨域. ③JSON:一种数据交换格式 ...

  2. jquery中的jsonp跨域调用(接口)

                                                                           jquery jsonp跨域调用接口

  3. (三)ajax请求不同源之jsonp跨域

    凡是拥有"src"这个属性的标签都具有跨域的能力,比如<script>.<img>.<iframe>. JS中,我们直接用XMLHttpRequ ...

  4. 前端跨域问题相关知识详解(原生js和jquery两种方法实现jsonp跨域)

    1.同源策略 同源策略(Same origin policy),它是由Netscape提出的一个著名的安全策略.同源策略是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正 ...

  5. 深入浅出:了解jsonp跨域的九种方式

    什么是“”跨域”: 跨域访问,简单来说就是 A 网站的 javascript 代码试图访问 B 网站,包括提交内容和获取内容.由于安全原因,跨域访问是被各大浏览器所默认禁止的.当一个域与其他域建立了信 ...

  6. jsonp跨域+ashx(示例)

    前言 做B/S项目的时候,我们一般使用jquery+ashx来实现异步的一些操作,比如后台获取一些数据到前台,但是如果ashx文件不在本项目下,引用的是别的域下的文件,这时候就访问不了.关于jsonp ...

  7. JSONP跨域的原理解析( 一种脚本注入行为)

    JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制, 被称为“some-Origin Policy”(同源策略).这一策略对于Jav ...

  8. JSONP跨域的原理解析

    JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制,被称为“Same- Origin Policy”(同源策略).这一策略对于Jav ...

  9. Jsonp跨域访问原理和实例

    >>什么是跨域 出于安全方面的考虑,页面中的JavaScript无法访问其他服务器上的数据,当前域名的js只能读取同域下的窗口属性,即同源策略.而跨域就是通过某些手段来绕过同源策略限制,实 ...

随机推荐

  1. SQL中合并两个表的JOIN语句

    SQL里有四种JOIN语句用于根据某条件合并两个表: (INNER) JOIN: 交集 LEFT (OUTER) JOIN: 左表数据全包括,右表对应的如果没有就是NULL RIGHT (OUTER) ...

  2. Python打包上传

    你可以用pip导出你的dependency: $ pip freeze > requirements.txt 然后在通过以下命令安装dependency: pip install -r requ ...

  3. 老师木发的makefile与autotools

    makefile http://scc.qibebt.cas.cn/docs/linux/base/%B8%FA%CE%D2%D2%BB%C6%F0%D0%B4Makefile-%B3%C2%F0%A ...

  4. BZOJ - 2460 :元素 (贪心&线性基)

    相传,在远古时期,位于西方大陆的 Magic Land 上,人们已经掌握了用魔法矿石炼制法杖的技术.那时人们就认识到,一个法杖的法力取决于使用的矿石.一般地,矿石越多则法力越强,但物极必反:有时,人们 ...

  5. 设计模式之访问者(visitor)模式

    在患者就医时,医生会根据病情开具处方单,很多医院都会存在以下这个流程:划价人员拿到处方单之后根据药品名称和数量计算总价,而药房工作人员根据药品名称和数量准备药品,如下图所示. 在软件开发中,有时候也需 ...

  6. Python基本特殊方法之__format__

    __format__()方法 __format__()传参方法:someobject.__format__(specification) specification为指定格式,当应用程序中出现&quo ...

  7. bzoj 2131 免费的馅饼

    Written with StackEdit. Description Input 第一行是用空格隔开的二个正整数,分别给出了舞台的宽度\(W\)(\(1\)到\(10^8\)之间)和馅饼的个数\(n ...

  8. Elasticsearch.net项目

    Elasticsearch.net项目实战 https://www.cnblogs.com/lucky_hu/p/9746736.html elasticsearch.net项目实战 @智客幸达 目录 ...

  9. 快速沃尔什变换FWT

    快速沃尔什变换\(FWT\) 是一种可以快速完成集合卷积的算法. 什么是集合卷积啊? 集合卷积就是在集合运算下的卷积.比如一般而言我们算的卷积都是\(C_i=\sum_{j+k=i}A_j*B_k\) ...

  10. 前端工程师面试问题归纳(一、问答类html/css/js基础)

    一.参考资源 1.前端面试题及答案整理(一) 2.2017年前端面试题整理汇总100题 3.2018最新Web前端经典面试试题及答案 4.[javascript常见面试题]常见前端面试题及答案 5.W ...