【AJAX】使用JQ发送AJAX发送请求

news2024/11/24 8:30:44

首先要引入JQ

    <script crossorigin="anonymous" src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>

服务端代码

// 服务端准备
// 1、引入express
const express = require('express');
// 2、创建应用对象
const app = express()
// 3、创建路由规则
// request是对请求的封装
// response是对响应的封装
app.all('/server',(request,response)=>{
    // 设置响应头:设置运行跨域
    response.setHeader('Access-Control-Allow-Origin','*');
    response.setHeader('Access-Control-Allow-Headers','*');
    // 第一步:设置发给客户端的JSON格式数据
    var data={
        code:200,
        msg:"成功"
    }
    // 第二步:由于response.send()只能发送字符串,所以要把JSON转换成字符串
    data = JSON.stringify(data)
    // 第三步:发送数据
    response.send(data);
});
// 4、监听端口的启动服务
app.listen(8000,()=>{
    console.log("服务已启动,8000端口监听中...");
})

// 5、启动服务,终端输入: node server.js基本使用.js ,启动之后在浏览器输入127.0.0.1:8000


客户端代码

格式1: $.get/post(发送地址, 发送参数{key:value,key:value...} 回调函数(function(data){}[data:响应体]))


    $.get('http://127.0.0.1:8000/server', { a: 100, b: 200 }, function (data) {
        console.log(data);
    }); 

运行结果

 获取的响应是字符串,如何把字符串变成JSON对象

方法一:JSON.parse(data)

方法二:设置响应数据类型为json格式

// $.get/post(发送地址, 发送参数{key:value,key:value...} 回调函数(function(data){}[data:响应体]),,'json)

    $.get('http://127.0.0.1:8000/server', { a: 100, b: 200 }, function (data) {

        console.log(data);

    },'json');

运行结果

 格式2:    // $.ajax({url:发送地址,data:发送参数,type:GET/POST(请求类型), 回调函数(data:响应体)})

<script>
    $.ajax({
                // 1、url
                url:'http://127.0.0.1:8000/server',
                // 2、参数
                data:{
                    a:100,
                    b:200
                },
                // 3、请求类型GET/POST
                type:'GET',
                // 4、成功的回调
                success:function(data){
                    console.log(data);
                },
                // 5、响应体类型设置
                dataType:'json',
                // 失败回调
                error:function(){
                    console.log('报错');
                },
                // 超时时间设置
                timeout:2000,
                // 请求头信息
                headers:{
                    c:300,
                    d:400
                }
            }) 
</script>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/719471.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

SpringBoot+JWT实现单点登录解决方案

一、什么是单点登录? 单点登录是一种统一认证和授权机制&#xff0c;指在多个应用系统中&#xff0c;用户只需要登录一次就可以访问所有相互信任的系统&#xff0c;不需要重新登录验证。 单点登录一般用于互相授信的系统&#xff0c;实现单一位置登录&#xff0c;其他信任的…

【nav_msgs/Path.h发布路径】

#include <nav_msgs/Path.h> 是一个 ROS (Robot Operating System) 中的包含文件。它是用于包含 nav_msgs/Path 消息类型的头文件,这是一个标准的 ROS 消息类型。 nav_msgs/Path 消息类型常用于机器人导航系统中,以表示路径。这种路径通常由一系列的位置点组成,这些点…

Spirngboot读取html文件到字符串

一、引入依赖 <dependency><groupId>cn.hutool</groupId><artifactId>hutool-all</artifactId><version>5.3.5</version></dependency> 二、直接读取返回 public String getContent(String path){try {File file ResourceUt…

如何限定IP访问服务器端口(只允许指定IP访问数据库服务器的1433端口)

1、找到“控制面板”->“Windows防火墙”->“高级设置”->“入站规则” 2、选中左侧的"入站规则"&#xff0c;并点击右侧的"新建规则" 3、选择"端口"&#xff0c;点击"下一步" 4、输入要限定访问的端口&#xff0c;这里是要…

瑞吉外卖-Day02

title: 瑞吉外卖-Day02 abbrlink: ‘1’ date: 2023-04-1 19:30:00 瑞吉外卖-Day02 课程内容 完善登录功能新增员工员工信息分页查询启用/禁用员工账号编辑员工信息 分析前端页面效果是如何实现的 为什么点击左边 右边会根着变化 [外链图片转存失败,源站可能有防盗链机制…

【js】JS实现根据两点经纬度位置获取距离:

文章目录 一、JS实现根据两点经纬度位置获取距离&#xff1a;二、效果&#xff1a; 一、JS实现根据两点经纬度位置获取距离&#xff1a; // 根据经纬度计算距离&#xff0c;参数分别为第一点的纬度&#xff0c;经度&#xff1b;第二点的纬度&#xff0c;经度 function getDist…

环二肽试剂128857-77-2,Cyclo(-Gly-Arg-Gly-Asp-Ser-Pro-Ala),定制含D型与L型,S与R构型的氨基酸

规格单位&#xff1a;g |货期&#xff1a;按照具体的库存进行提供 | 纯度&#xff1a;95%试剂描述&#xff1a; 西安凯新生物科技有限公司供应的​Cyclo(-Gly-Arg-Gly-Asp-Ser-Pro-Ala)&#xff08;CAS号&#xff1a;128857-77-2&#xff09;环二肽试剂&#xff0c;是由两…

信不信,我一句话就能惹毛项目经理

早上好&#xff0c;我是老原。 上周有个做技术的粉丝问我&#xff0c;是不是技术做不下去的人才会去转管理&#xff1f; 我和他说&#xff0c;这句话千万别和你周围的项目经理说&#xff0c;不然分分钟和你生气。 不过这也不怪他&#xff0c;确实有很多做技术的人是被迫转管…

ICMP类型

ICMP&#xff08;Internet Control Message Protocol&#xff09;Internet控制报文协议。它是TCP/IP协议簇的一个子协议&#xff0c;用于在IP主机、路由器之间传递控制消息。控制消息是指网络通不通、主机是否可达、路由是否可用等网络本身的消息。这些控制消息虽然并不传输用户…

(三)线程组和线程优先级

&#xff08;三&#xff09;线程组和线程优先级 3.1 线程组&#xff08;ThreadGroup&#xff09;3.2 线程的优先级01、Thread 的优先级02、ThreadGroup 和 Thread 优先级不一致问题 3.3 守护线程&#xff08;Daemon&#xff09;3.4 线程组的常用方法3.5 线程组的数据结构 3.1 线…

@RequestParam注解注意事项

在传参的时候&#xff0c;有的参数不是必传的&#xff0c;代码如下&#xff1a; 比如现在name为必传&#xff0c;position为非必传&#xff0c;我们来用postman测试下&#xff0c; 直接报如上图所示的错误&#xff0c;那么有什么办法阻止这个错误了&#xff0c;只要在不必传的参…

SpringBoot使用mybatis批量新增500万数据到mysql数据库Demo

SpringBoot使用mybatis批量新增500万数据到mysql数据库Demo 说明项目Demo代码地址项目目录mysql对应表建表语句pom.xmlapplication.yml配置类启动类代码OrderInfo 实体类TestController控制层接口层TestServiceTestServiceImpl实现层TestDao数据接口层dao层对应mapper.xml自定义…

熔断降级与限流在开源SpringBoot/SpringCloud微服务框架的最佳实践

目录导读 熔断降级与限流在开源SpringBoot/SpringCloud微服务框架的最佳实践1. 开源代码整体架构设计2. 微服务逻辑架构设计3. 微服务熔断降级与限流规划3.1 微服务熔断降级与限流场景分析3.2 微服务熔断降级与限流技术栈规划3.3 微服务熔断降级与限流技术选型3.3.1 熔断降级中…

自动化测试之selenium工具使用

1. 自动化测试的前提 1.1 什么是自动化&#xff1f; 减少人力成本完成大量重复性工作提高测试效率保证工作的一致性&#xff0c;提高信任度完成手工不能完成的工作 1.2 是否适合做自动化&#xff1f; 时间 &#xff08;项目周期长&#xff09;人员 &#xff08;熟悉自动化&…

神经网络术语解释

目录 Padding&#xff1a; 填充步幅&#xff08;stride&#xff09;Pooling Layer:池化层Batch NormalizationSeparable ConvolutionsREFERENCE Padding&#xff1a; 填充 在进行卷积层的处理之前&#xff0c;有时要向输入数据的周围填入固定的数据&#xff08;比 如0等&#…

redis高可用集群数据库的安装部署(6.2.12版本)

第三阶段基础 时 间&#xff1a;2023年7月3日 参加人&#xff1a;全班人员 内 容&#xff1a; 6.2.12版本redis集群部署 目录 一、环境配置&#xff1a;【两台服务器】 二、redis多实例配置&#xff1a; 三、构建redis cluster集群 四、创建主从 五、故障转移实验 …

IT安全部门应如何平衡企业内外部文件交换的业务效率与安全性?

在日常运营经营中&#xff0c;很多企业存在与外部客户的业务数据往来&#xff0c;如生产型企业与上下游供应链间的制造设计相关文件交换、金融企业与外部监管机构和合作方间的重要客户数据收发、文化娱乐产业内外部关于作品素材的传输交流等。当内外部数据文件交换较为频繁、且…

什么是Web3.0?

鲁迅先生曾言&#xff1a;“人一旦有钱&#xff0c;智商和情商都会是高86.4%&#xff0c;烦恼也会消失100%。”然而&#xff0c;问题来了&#xff0c;钱从哪里来&#xff1f;他只留下了一串数字Dle577。同时&#xff0c;莎士比亚也指出&#xff0c;这个世界上只有少数人能够把握…

《安全软件开发框架(SSDF) 1.1:降低软件漏洞风险的建议》解读(四)

安全软件开发框架SSDF是由美国国家标准与技术研究院发布的关于安全软件开发的一组实践&#xff0c;帮助开发组织减少发布的软件中的漏洞数量&#xff0c;减少利用未检测到或未解决的漏洞的潜在影响&#xff0c;从根本上解决漏洞防止再次发生。本文根据《Secure Software Develo…

防火墙基本原理详解

概要 防火墙是可信和不可信网络之间的一道屏障&#xff0c;通常用在LAN和WAN之间。它通常放置在转发路径中&#xff0c;目的是让所有数据包都必须由防火墙检查&#xff0c;然后根据策略来决定是丢弃或允许这些数据包通过。例如&#xff1a; 如上图&#xff0c;LAN有一台主机和一…