springboot中异步请求中的ajax

已于 2022-06-14 12:37:06 修改
阅读量172 收藏
点赞数
于 2022-06-14 12:25:07 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_51113232/article/details/125275751
版权

HTML 前端注册 AJAX 邮箱验证码 jQuery
关键词由CSDN通过智能技术生成 
html

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>注册</title>
    <!--<link rel="stylesheet" href="layui/css/layui.css">
    <script src="layui/layui.js"></script>-->
    <script type="text/javascript" src="js/jquery-1.11.3.min.js" ></script>
</head>
<body style="width: 100%;height: 100%;">
<div style="margin-top: 15%;">
    <div style="width: 700px;">
        <h1 style="text-align: center">请输入注册信息</h1>
        <form >
            邮箱：<input  type="email"><br>
            密码：<input type="password"><br>
           <!-- <input id="btn1" type="submit" value="提交">-->
        </form>
        <button οnclick="test()" id="btn1">提交解决</button>
    </div>
</div>
<script type="text/javascript">
    function test(){
        alert("======")
        $.ajax({
            url:"getCheckCode",
            type:"get",
            data:{
                email:'123'
            },
            dataType:"json",
            success: function(data){   //请求成功后的回调函数，data为返回的数据
                console.log(data);
            }
        })
    }
</script>
</body>
</html>

Controller

package com.example.test.controller;

import com.example.test.service.mailService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

import java.util.Random;

@Controller
public class MailController {
    @Autowired(required = false)
    private mailService mail;

//    @RequestMapping("getCheckCode/{email}")   @PathVariable(name="email")
//    @RequestMapping("getCheckCode")
    @GetMapping("getCheckCode")
    @ResponseBody
    public Str
package com.example.test.controller;

import com.example.test.service.mailService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

import java.util.Random;

@Controller
public class MailController {
    @Autowired(required = false)
    private mailService mail;

//    @RequestMapping("getCheckCode/{email}")   @PathVariable(name="email")
//    @RequestMapping("getCheckCode")
    @GetMapping("getCheckCode")
    @ResponseBody
    public String getCheckCode(String email){
        String checkCode = String.valueOf(new Random().nextInt(899999) + 100000);
        System.out.println("=================");
        System.out.println(email);
        System.out.println("=================");
        System.out.println(checkCode);
        System.out.println("=================");
        String message = "您的注册验证码为："+checkCode;
        try {
            mail.sendSimpleMail(email, "注册验证码", message);
        }catch (Exception e){
            return "";
        }
        return checkCode;
    }
    @RequestMapping("hahaha")
    public String hahaha(){
        return "HaHaHa";
    }
    @RequestMapping("register")
    public String register(String email,String password,String checkCode){
        System.out.println(email+"==="+password+"===="+checkCode);
        return "";
    }
}

*努力ing
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
springboot ajax请求数据
Befearless
11-20 8639
springboot ajax请求数据
springboot+ajax示例
08-02
springboot+ajax的小例子，适合初学者，可以参考博文http://blog.csdn.net/oppo5630/article/details/52093898
Spring Boot之AJAX异步发送帖子
hutianle的博客
08-22 418
方法，跳转到：CONTEXT_PATH + “/discuss/add”；用户点击【发布帖子】按钮后，页面出现一个弹窗，此时后面的页面并没有刷新。点击【发布帖子】按钮后，publishBtn 按钮会执行。在用户登录之后，才显示【发布帖子】按钮，可以进行相关操作。，通过其对应的 SQL 语句将帖子内容插进。在 js 文件中编写【发布按钮】对应的函数。在用户登录之前，不显示【发布帖子】按钮；，该service又调用了。编写对应的 SQL 语句。方法，功能为插入帖子。
spring-boot 接口请求之Ajax数据请求格式
玩命的拼搏
01-28 3370
spring后台的controller提供了@RequestParam、@RequestBody等参数注解，使用不同的注解，对于允许的前台请求格式也不一样，下面就列出不同格式的请求实例：  本环境使用spring-boot搭建后台接口服务，前台采用ajax形式发送数据，数据的传递使用Bean实体类接收，在参数接收时，如果出现日期格式无法解析的情况，参见本人的另一篇文章 spring-boot
AJAX获得springboot后台数据
Tyrell
02-27 1229
目的： 在 不重新加载网页的情况下，获得后端数据， 并且 作为 部分html代码 插入原网页。   思路： 1.页面1 使用ajax 发送request //Ajax请求 实际就是 http请求 2.Controller 接受(GET)请求，调用其 方法，只不过返回的是另一个html里的fragment片段 3.DispatcherServlet...
Springboot框架中ajax动态加载分页
06-12
Spring MVC处理HTTP请求并返回响应，而Ajax则允许前端向后端发送异步请求，获取数据，并更新部分页面内容。 1. **设置分页组件**： Spring Boot通常与MyBatis或JPA（Java Persistence API）等持久层框架配合使用。...
Object_SpringBoot-Ajax_CRUD.rar
07-23
在本项目中，前端通过Ajax发送异步请求到后端，处理CRUD操作，返回JSON格式的数据，而不是传统的HTML页面，降低了网络传输负担，提升了用户体验。 5. **JSON数据交互**：JSON（JavaScript Object Notation）是一种...
Springboot中ajax实现动态绑定省市区
06-10
在Spring Boot应用中，Ajax（Asynchronous JavaScript and XML）技术常用于实现页面的异步更新，提高用户体验。这里我们将探讨如何在Spring Boot中利用Ajax来动态绑定省市区数据，特别是从高德地图API获取这些数据。...
解决 springboot跨域请求问题
05-11
在这样的环境下，AJAX（异步JavaScript和XML）被广泛用来实现页面与后端接口的通信。然而，当前端和后端部署在不同的源（协议、域名或端口不同）时，就会触发浏览器的同源策略，导致跨域问题。 跨域是浏览器的安全...
SpringBoot实现AJAX跨域请求（CORS解决跨域请求）
Brave_heart4pzj的博客
03-08 277
https://blog.csdn.net/qq_45899343/article/details/110803346
详解SpringBoot中异步请求和异步调用(看完这一篇就够了)
08-26
主要介绍了SpringBoot中异步请求和异步调用问题，非常不错，具有一定的参考借鉴价值,需要的朋友可以参考下
Springboot+ajax+jpa实现异步删除修改添加用户
04-17
实现了Ajax异步添加修改删除用户,整合了SpringSecurity,jpa等一堆框架...文章说明在https://blog.csdn.net/woshilishu/article/details/89351894
SpringBoot自定义错误信息，SpringBoot适配Ajax请求
04-27
NULL 博文链接：https://fanshuyao.iteye.com/blog/2414865
springboot+ajax的小例子
04-20
适合初学者，里面包括SpringBoot的例子以及thymleaf的用法及Springdate-JPA进行操作前台跟数据库，比较有帮助
以SpringBoot作为后台实践ajax异步刷新
Java鱼仔的博客
03-02 2127
1.什么是ajax 1.Ajax全称：Asynchronous JavaScript And XML 2.是一种异步加载数据的技术 3.可以通过使用Ajax，实现页面的局部刷新 简单来讲就是通过ajax，你不需要重新刷新整个页面就能实现对局部页面的刷新操作。 2.AJAX的使用 使用ajax主要有以下四步骤 //1.创建ajax对象 var xhr=new XMLHttpReq...
springboot ajax form json 请求方式
彻底拆分，一切可控！
10-11 3969
1.form请求的后台代码 1.定义实体 Student package com.bsx.test.entity; import com.bsx.test.constant.Gender; import com.bsx.test.constant.Nature; import javax.persistence.Column; import javax.persistence.Id; impo...
SpringBoot支持AJAX跨域请求
Mr.white_G的博客
05-02 103
利用注解的方式解决AJAX请求跨域问题1.编写一个支持跨域请求的 Configuration。
springboot跨域配置与ajax请求测试
a898712940的博客
09-26 258
一：springboot跨域配置 import org.slf4j.Logger; import org.slf4j.LoggerFactory; import org.springframework.stereotype.Component; import javax.servlet.*; import javax.servlet.annotation.WebFilter; import javax.servlet.http.HttpServletRequest; import javax.servle
SpringBoot+安全框架+前后端处理ajax请求
ohsoa的博客
09-26 725
前后端处理json数据
springboot 前台异步请求如何接收返回信息
最新发布
09-05
在Spring Boot中，前台异步请求可以通过使用Ajax来发送请求，并通过回调函数来接收返回信息。 首先，我们可以在前台页面中使用jQuery的Ajax方法发送异步请求。例如，可以使用以下代码发送POST请求： ```javascript $.ajax({ url: '/api/your-url', // 请求的URL地址 type: 'POST', // 请求方式（GET、POST等） dataType: 'json', // 返回的数据类型 data: { // 请求参数 param1: 'value1', param2: 'value2' }, success: function(response) { // 请求成功时的回调函数 // 在此处处理返回的数据（response） }, error: function(xhr) { // 请求失败时的回调函数 // 在此处处理错误信息 } }); ``` 在Spring Boot后台，可以通过在Controller中定义一个映射URL来接收前台发送的异步请求，并返回相应的数据。例如，可以使用以下代码： ```java import org.springframework.web.bind.annotation.*; @RestController @RequestMapping("/api") public class YourController { @PostMapping("/your-url") public YourResponse handleAjaxRequest(@RequestBody YourRequest request) { // 在此处处理请求数据，并生成相应的返回数据 YourResponse response = new YourResponse(); // 设置返回数据的内容 return response; } } ``` 在上述代码中，`YourRequest`和`YourResponse`是自定义的请求和响应类，用于封装请求参数和返回数据。 在接收到前台发送的异步请求并处理完毕后，可以通过使用`@ResponseBody`注解将返回的数据转换为JSON格式，并自动发送回前台。在上述示例中，我们返回的数据类型是`YourResponse`，该类的内容将序列化为JSON格式返回给前台。 总之，Spring Boot中的前台异步请求可以通过使用Ajax发送请求，并在后台Controller中处理请求并返回相应的数据。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值