flask ajax

学习ajax请求,随便弄了一个本地页面,填了一个本地启动的一个flask后台,先出现了:

(No ‘Access-Control-Allow-Origin‘ header is present on the requested resource.)应为是填的类似http://192.168.253.1:5000/test_ajax/"的地址出现了跨域访问的问题;

参考了https://blog.csdn.net/zhoucheng05_13/article/details/53580683,ajax中添加了dataType: ‘jsonp‘解决了跨域问题,使用jsonp后又有callback验证问题,开始以为直接翻字符串就可,没想打还有验证(Uncaught ReferenceError:),可以看看这个https://blog.csdn.net/zhoucheng05_13/article/details/78694766;

前端代码

<script type="text/javascript" src="./files/jquery-1.8.2.min.js"></script>
<script type="text/javascript">
function loadXMLDoc()
{
    $.ajax(
        {
            url:"http://192.168.253.1:5000/test_ajax/",          //本地后台提供的url
            dataType: ‘jsonp‘,
            jsonp:"callback",               //callback可以设置成其他,后台验证时就需要对应改变
            success:function(result){
                console.log(result)
                alert(result)
            }
        }
    )
}
</script>

<div id="myDiv"><h2>使用 AJAX 修改该文本内容</h2></div>
<button type="button" onclick="loadXMLDoc()">修改内容</button>

 

后端代码

@app.route(‘/test_ajax/‘)
def test_ajax():
    callback = request.args.get(‘callback‘)
    return callback + ‘("hello")‘

原文地址:https://www.cnblogs.com/liuda9495/p/9253327.html

时间: 2025-01-17 04:57:50

flask ajax的相关文章

Flask Ajax Demo

Python Code: from flask import Flask, jsonify, request, render_template app = Flask( __name__ ) @app.route( "/", methods = [ "POST", "GET" ] ) def index(): if request.method == "POST": first_name = request.form.get(

flask与javascript及ajax

flask与javascript及ajax 1.      flask+js 1.1.    最简单的 最简单的元素信息改变. {% block content %} <h1>我的第一张网页</h1> <p id="demo">我的第一个段落</p> <script> document.getElementById("demo").innerHTML="我的第一段 JavaScript"

flask+sqlite3+echarts2+ajax数据可视化

前提: 准备Python + Flask+Sqlite3的平台环境(windows系统) 前面一节介绍flask怎么安装了,剩下sqlite3下载后解压,然后环境变量添加解压路径就行了 附加下载地址:http://www.sqlite.org/2016/sqlite-tools-win32-x86-3150200.zip 项目的目录结构 /www||-- /static| |jquery-1.6.2.js (可以是其他jquery-xx.js,在index.html里修改就行了)| |-- ec

Flask web开发 处理Ajax请求

本文介绍如何处理ajax请求, 一.处理ajax的post请求 举例一: js代码举例如下: var id = obj.parentNode.parentNode.id; $.post("/delitem/"+id, {}, function(data){ showData(data); },"json"); 对应的flask代码举例如下: @app.route('/delitem/<id>', methods=['POST']) def delitem

flask+sqlite3+echarts2+ajax数据可视化报错:UnicodeDecodeError: &#39;utf8&#39; codec can&#39;t decode byte解决方法

flask+sqlite3+echarts2+ajax数据可视化报错: UnicodeDecodeError: 'utf8' codec can't decode byte 解决方法: 将 py文件和html文件用用记事本打开,然后另存为,将编码ANSI改成:UTF-8 flask+sqlite3+echarts2+ajax数据可视化报错:UnicodeDecodeError: 'utf8' codec can't decode byte解决方法

Flask与Ajax

这篇短文使用jquery. Flask提供一个很简单的方法来处理Ajax请求——在视图函数中用request的属性is_xhr来判断,如果是true则是异步请求. Jquery的$.getJSON()方法会主动向服务端发出ajax请求(不知这个理解是否正确?),服务端响应后调用$.getJSON的回调函数.在回调函数中就可以操作Html页面上的元素了. 客户端:ajax.html <!doctype html> <html lang="en"> <head

flask jQuery ajax 上传文件

1.html 代码 <div> <form id="uploadForm" enctype="multipart/form-data" > <div> <input type="file" name="file" value="" style="color: white"> <input type="button"

Flask提供json api跨域访问,ajax接收json数据

ajax在判断请求成功时会判断返回的数据是否为json,需要将response的content-type设置为application/json,数据为标准的json格式 jQuery版本 <script src="https://cdn.bootcss.com/bootstrap/4.0.0-beta/js/bootstrap.min.js"></script> flask代码示例 @app.route('/test',methods=['GET','POST'

flask使用原生ajax、不使用表单(Form)上传文件

〇.知识点 jquery ajax 文档告诉你可以使用默认的 application/x-www-form-urlencoded, multipart/form-data, or text/plain 这三种,其它的也可以,但是需要告诉ajax 的怎样序列化它.--这句话来源于:https://www.cnblogs.com/htoooth/p/7242217.html 一.原生ajax.不使用表单(Form) app.py import os from flask import Flask,