RPC(5):AJAX跨域请求处理

接上一篇RPC(4):HttpClient实现RPC之POST请求进行修改。

1 修改客户端项目

1.1 修改maven文件

修改后配置文件如下:

    <dependencyManagement>
        <dependencies>
            <dependency>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-dependencies</artifactId>
                <version>2.3.2.RELEASE</version>
                <scope>import</scope>
                <type>pom</type>
            </dependency>
        </dependencies>
    </dependencyManagement>

    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
        <dependency>
            <groupId>org.apache.httpcomponents</groupId>
            <artifactId>httpclient</artifactId>
            <version>4.5.12</version>
        </dependency>
        <dependency>
            <groupId>org.example</groupId>
            <artifactId>httpclient_rpc_pojo</artifactId>
            <version>1.0-SNAPSHOT</version>
            <scope>compile</scope>
        </dependency>
        <dependency>
            <groupId>com.fasterxml.jackson.core</groupId>
            <artifactId>jackson-databind</artifactId>
            <version>2.11.1</version>
        </dependency>
    </dependencies>

1.2 新增页面

在resource下的static中新增index.html页面(提前引入jquery)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="jquery.min.js"></script>
    <script type="text/javascript">
        var url = "123";
        // javascript中默认的,ajax请求不能跨域。
        // 跨域 - ajax所属的站点,和被请求的站点,不是同一个域。
        // 域 - ip,端口,域名,主机名,任何一个有变化,都是不同域。
        // 需要服务器,返回的响应中增加跨域请求头。
        function sendBodyParams(){
            $.ajax({
                "url": "http://localhost:80/bodyParams",
                "type":"post",
                "data":"[{\"name\":\"abc\", \"password\":\"123\"},{\"name\":\"def\", \"password\":\"321\"}]",
                "contentType":"application/json", // 必须设定,代表请求体的格式。默认是text/plain; 默认是 参数名=参数值&参数名=参数值 的字符串
                "dataType":"json",
                "success":function(data){
                    alert(data);
                    console.log(data);
                }
            });
        }
    </script>
</head>
<body style="text-align: center">
    <button onclick="sendBodyParams()">测试AJAX请求,请求体传递JSON参数</button>
</body>
</html>

1.3 编写启动类

package com.example.httpclient;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication
public class TestApp {
    public static void main(String[] args) {
        SpringApplication.run(TestApp.class, args);
    }
}

2 修改服务端项目

在bodyParams中新增@CrossOrigin方法。

3 启动服务

访问页面,点击按钮,结果如下:

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Kafka 分级存储在腾讯云的实践与演进

导语 腾讯云消息队列 Kafka 内核负责人鲁仕林为大家带来了《Kafka 分级存储在腾讯云的实践与演进》的精彩分享&#xff0c;从 Kafka 架构遇到的问题与挑战、Kafka 弹性架构方案类比、Kafka 分级存储架构及原理以及腾讯云的落地与实践四个方面详细分享了 Kafka 分级存储在腾讯云…

Flash Attention(1):背景介绍,与传统Attention对比,前向反向算法解析

0 英文缩写 FA&#xff1a; Flash AttentionHBM&#xff1a;High Bandwidth Memory&#xff0c;高带宽显存 0 论文 [2205.14135] FlashAttention: Fast and Memory-Efficient Exact Attention with IO-Awareness 中文&#xff1a;FlashAttention&#xff1a;一种具有 IO 感知…

【jvm从入门到实战】(九) 垃圾回收(2)-垃圾回收器

垃圾回收器是垃圾回收算法的具体实现。 由于垃圾回收器分为年轻代和老年代&#xff0c;除了G1之外其他垃圾回收器必须成对组合进行使用 垃圾回收器的组合使用关系图如下。 常用的组合如下: Serial&#xff08;新生代&#xff09; Serial Old&#xff08;老年代&#xff09; Pa…

【每日一题】【12.19】1901.寻找峰值Ⅱ

&#x1f525;博客主页&#xff1a; A_SHOWY&#x1f3a5;系列专栏&#xff1a;力扣刷题总结录 数据结构 云计算 数字图像处理 力扣每日一题_ 1.题目链接 1901. 寻找峰值 IIhttps://leetcode.cn/problems/find-a-peak-element-ii/ 2.题目描述 看到这个时间复杂度就知道和昨…

关于折线回归

一、说明 今天的帖子主要是关于使用折线回归找到最佳值。即将某条曲线分解成包络线段&#xff0c;然后用分段回归方式优化。但它也涉及使用 SAS 和 R 的剂量反应研究和样条曲线。这不是第一篇关于这些主题的文章&#xff0c;但我确实想在其中添加折线。只是因为它还在使用。 二…

借助dayjs,把各种类型的日期转换成“YYYY-MM-DD“格式

记得先 npm install datajs <template><div class"home"></div> </template> <script lang"ts" setup> import { reactive, ref } from "vue";import dayjs from "dayjs"; import customParseFormat f…

助力智能人群检测计数,基于YOLOv7开发构建通用场景下人群检测计数识别系统

在一些人流量比较大的场合&#xff0c;或者是一些特殊时刻、时段、节假日等特殊时期下&#xff0c;密切关注当前系统所承载的人流量是十分必要的&#xff0c;对于超出系统负荷容量的情况做到及时预警对于管理团队来说是保障人员安全的重要手段&#xff0c;本文的主要目的是想要…

LED恒流调节器FP7126:引领LED照明和调光的新时代(调光电源、汽车大灯)

目录 一、FP7126概述 二、FP7126功能 三、应用领域 随着科技的进步&#xff0c;LED照明成为了当代照明产业的主力军。而在LED照明的核心技术中&#xff0c;恒流调节器是不可或缺的组成部分。今天&#xff0c;我将为大家介绍一款重要的恒流调节器FP7126&#xff0c;适用于LED…

Axure的案例演示

增删改查&#xff1a; 在中继器里面展示照片

App(Android)ICP备案号查询——————高仿微信

&#x1f604; 个人主页&#xff1a;✨拉莫帅-CSDN博客✨&#x1f914; 博文&#xff1a;132篇&#x1f525; 原创&#xff1a;130篇&#xff0c;转载&#xff1a;2篇&#x1f525; 总阅读量&#xff1a;388923❤️ 粉丝量&#xff1a;112&#x1f341; 感谢点赞和关注 &#x…

什么是集成测试?它和系统测试的区别是什么? 操作方法来了

01 什么是集成测试&#xff1f; 集成测试是软件测试的一种方法&#xff0c;用于测试不同的软件模块之间的交互和协作是否正常。集成测试的主要目的是确保不同的软件模块能够无缝协作&#xff0c;形成一个完整的软件系统&#xff0c;并且能够满足系统的需求和规格。 在集成测试…

Qt Q_DECL_OVERRIDE

Q_DECL_OVERRIDE也就是C的override&#xff08;重写函数&#xff09;&#xff0c;其目的就是为了防止写错虚函数,在重写虚函数时需要用到。 /* 鼠标按下事件 */ void mousePressEvent(QMouseEvent *event) Q_DECL_OVERRIDE; 参考: Qt Q_DECL_OVERRIDE - 一杯清酒邀明月 - 博客…

Android Studio问题解决:Gradle Download 下载超时 Connect reset

文章目录 一、遇到问题二、解决办法 一、遇到问题 Gradle Download下载超时Sync了很多次&#xff0c;一直失败 二、解决办法 手动通过gradle网站下载 https://gradle.org/releases/可能也会出现超时&#xff0c;最好开个VPN软件会比较快。 下载好的软件&#xff0c;放到本机的…

管理类联考——数学——真题篇——按题型分类——充分性判断题——蒙猜D

先看目录&#xff0c;除了2018年比较怪&#xff0c;其他最多2个D&#xff08;数学只有两个弟弟&#xff0c;一个大弟&#xff0c;一个小弟&#xff09; 文章目录 2023真题&#xff08;2023-16&#xff09;-D 2022真题&#xff08;2022-21&#xff09;-D-分析选项⇒是否等价⇒是…

使用极狐gitlab初始化导入本地项目

本地有项目的情况需要同步到极狐gitlab上 第一步&#xff1a; 在gitlab上新创建一个空项目 ⚠️⚠️⚠️这里需要注意红色圈住的地方一定不要选择&#xff0c;因为选择了这个后续会有不必要的麻烦 第二步 在本地项目中删除原来的.git文件(这一步如果是新项目可以忽略&#…

扑克牌炸金花

1.创建类 使用权限修饰符定义所需要参数&#xff0c;使用this关键字生成方法 public class gamejinhua { private String suit;//花色 private int rank;//数字 public gamejinhua(String suit, int rank) { this.suit suit; this.rank rank; } 2.使用快捷键生成get和…

静态库和动态库

静态库 编译&#xff08;链接&#xff09;时把静态库中相关代码复制到可执行文件中&#xff0c;程序中已包含代码&#xff0c;运行时不再需要静态库 占用更多磁盘和内存空间&#xff0c;但程序运行时无需加载库&#xff0c;运行速度快 升级时&#xff0c;程序需要重新编译链…

WPF仿网易云搭建笔记(7):HandyControl重构

文章目录 专栏和Gitee仓库前言相关文章 新建项目项目环境项目结构 代码结果结尾 专栏和Gitee仓库 WPF仿网易云 Gitee仓库 WPF仿网易云 CSDN博客专栏 前言 最近我发现Material Design UI的功能比较简单&#xff0c;想实现一些比较简单的功能&#xff0c;比如消息提示&#xff0…

电脑风扇控制软件Macs Fan Control mac支持多个型号

Macs Fan Control mac是一款专门为 Mac 用户设计的软件&#xff0c;它可以帮助用户控制和监控 Mac 设备的风扇速度和温度。这款软件允许用户手动调整风扇速度&#xff0c;以提高设备的散热效果&#xff0c;减少过热造成的风险。 Macs Fan Control 可以在菜单栏上显示当前系统温…

HTS318 红外热释传感器处理芯片 PIR控制芯片 用于红外感应灯、走廊灯等

HTS318是一颗高度集成的用于热释电红外传感器 (PIR) 的控制芯片。HTS318单片集成了热释电被动红外移动探测的所有必需组件模拟前端可以直接与模拟型PIR探测器使用电容连接&#xff0c;内置3V LDO&#xff0c;给PIR探测器供电。内置高精度模数转换器&#xff0c;可将探测器信号转…
最新文章