ajax调用接口步骤 ajax调用后端接口实例

调用Ajax接口并显示返回参数。前端需要调用接口并返回结果时,可以使用Ajax。鸡程序员不太懂原理,但是看了很多网上教程很麻烦。这里有一个我成功实现的案例。使用id来定位需要修改的部分点击按钮时触发loadDoc()函数使用console.log(‘error’)可以在控制台打出想...

调用Ajax接口并显示返回参数。

前端需要调用接口并返回结果时,可以使用Ajax。鸡程序员不太懂原理,但是看了很多网上教程很麻烦。这里有一个我成功实现的案例。

使用id来定位需要修改的部分点击按钮时触发loadDoc()函数使用console.log(‘error’)可以在控制台打出想看的东西xhttp.open(“POST”, “http://localhost:5000/users/xxxxx/me”, true);使用POST向接口发送请求,true表示异步请求xhttp.setRequestHeader(‘content-type’, ‘application/json’);设置请求的headerxhttp.send(JSON.stringify(sendData));将变量json格式化后传输xhttp.onreadystatechange = function()在这里执行想要进行的html变换的操作,JSON.parse(xhttp.responseText)<!DOCTYPE html><html><body><h1>XMLHttpRequest target</h1><button type="button" onclick="loadDoc()">Request Data</button><p>suggestion: <span id="demo"> </span></p><script>function loadDoc() { console.log('error'); var xhttp = new XMLHttpRequest(); xhttp.open("POST", "http://localhost:5000/users/xxxxx/me", true); xhttp.setRequestHeader('content-type', 'application/json'); var sendData = {"abc":123}; //将用户输入值序列化成字符串 xhttp.send(JSON.stringify(sendData)); xhttp.onreadystatechange = function() { if (xhttp.readyState == 4) { var jsonObj = JSON.parse(xhttp.responseText); document.getElementById("demo").innerHTML = jsonObj.data.adjustPeriod console.log(jsonObj.data.adjustPeriod); } }}</script></body></html>

Ajax跨领域问题解决

Python,flask创建app实例时,只需添加以下代码:

from flask_cors import CORS# 创建app实例对象 app = Flask(__name__) CORS(app)

本文来自永远太远投稿,不代表舒华文档立场,如若转载,请注明出处:https://www.chinashuhua.cn/24/565762.html

打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
() 0
上一篇 05-27
下一篇 05-27

相关推荐

  • ajax的原理和作用 简述ajax工作原理

    AJAX (AsyncJavascriptandXML),即异步JavaScript和XML,是一种用于创建交互式web应用的web开发技术,可以与服务器交换数据,更新部分网页,而无需重新加载整个网页。Ajax的原理简单来说就是通过XmlHttpRequest对象向服务器发送异步请求,从服务器获取数据,然后用JavaScript

    2023-06-22 05:08:01
    505 0
  • ajax请求失败怎么处理 ajax请求失败处理方式

    ajax简介Ajax是前端交互的重要手段或桥梁。它不是一种技术,而是多种技术的结合。Ajax: A:异步;j:js;答:还有;x:服务器的数据。ajax的组成:异步的 js 事件其他 js (处理解析数据)XMLHttpRequest 对象数据(txt、json、xml、html)Ajax可以通过在后台与服务器交换一点数据,使

    2023-06-14 12:27:01
    656 0
  • ajax传递多个参数无响应 ajax传值八个传值方法

    很多框架已经封装了ajax,需要的时候调用就行了。比如jquery就是最常用的一个。为什么我们还需要学习ajax的封装?首先,加强我们对ajax的理解。其次,如果只是因为ajax请求需要引入框架,我们可以自己打包一个,这样就不需要引入多余的框架了。一、包装注意事项封装是为了共享

    2023-06-02 10:52:01
    1032 0
  • ajax调用接口步骤 ajax调用后端接口实例

    调用Ajax接口并显示返回参数。前端需要调用接口并返回结果时,可以使用Ajax。鸡程序员不太懂原理,但是看了很多网上教程很麻烦。这里有一个我成功实现的案例。使用id来定位需要修改的部分点击按钮时触发loadDoc()函数使用console.log(‘error’)可以在控制台打出想

    2023-05-27 19:05:01
    497 0

评论列表

联系我们

在线咨询: QQ交谈

邮件:admin@qq.com

工作时间:周一至周五,9:30-18:30,节假日休息

关注微信