2023/10/15总结

news2024/11/29 10:49:42

学习总结

最近开始写项目了,然后写的过程中遇到了跨域问题。

为什么会出现跨域问题

由于浏览器的同源策略限制。同源策略是一种约定,它是浏览器最核心也是最基本的安全功能。如果缺少了同源策略,那么浏览器的正常功能可能都会收到影响。所谓同源 (也是指一个域)就是俩个页面具有相同的协议、主机、端口号

什么是跨域

当一个请求 url 的协议 、域名 、端口 三者之间任意一个与当前 url 不同 即为 跨域

要解决 跨域 问题
(我写的是vue3+springboot)

前端:

找到 vite.config.js 文件

  server: {
    proxy: {
      '/api': {
        target: 'http://localhost:8081',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, '')
      }
    }
  }

然后在发送请求的时候都带上  /api

 

后端有俩种方式

  • ① 给 方法加注解

一个一个加 未免 有些麻烦

  • ②  配置文件

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;


@Configuration
public class CorsConfig implements WebMvcConfigurer {

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/api/**")
                .allowedOrigins("http://localhost:5173") // 允许的前端源
                .allowedMethods("GET", "POST", "PUT", "DELETE")
                .allowedHeaders("Content-Type", "Authorization")
                .allowCredentials(true);
    }
}

然后就可以连接了。

最近写的登录注册界面:

上面是一些界面的逻辑 简单的连了一下前后端  因为还没设计数据库 所以就还没有开始写这个后端的东西  只是能浅浅的返回数据

刷题记录

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

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

相关文章

茶百道全链路可观测实战

作者:山猎 茶百道是四川成都的本土茶饮连锁品牌,创立于 2008 年 。经过 15 年的发展,茶百道已成为餐饮标杆品牌,全国门店超 7000 家,遍布全国 31 个省市,实现中国大陆所有省份及各线级城市的全覆盖。2021 …

前端小案例 | 一个带切换的登录注册界面(静态)

文章目录 &#x1f4da;HTML&#x1f4da;CSS&#x1f4da;JS &#x1f4da;HTML <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-sc…

volatile关键字 和 i = i + 1过程

本文是复制粘贴,请直接看原文 原文链接:Java并发编程&#xff1a;volatile关键字解析 - Matrix海子 - 博客园 (cnblogs.com) ------------------------------------------------------------------------------------------------------------------- Java并发编程&#xff1…

ChatGPT AIGC 完成Excel跨多表查找操作vlookup+indirect

VLOOKUP和INDIRECT的组合在Excel中用于跨表查询,其中VLOOKUP函数用于在另一张表中查找数据,INDIRECT函数则用于根据文本字符串引用不同的工作表。具体操作如下: 1.假设在工作表1中,A列有你要查找的值,B列是你希望查询的工作表名称。 2.在工作表1的C列输入以下公式:=VLO…

[OpenJDK:环境变量配置]:填充Profile并修改默认配置

文章目录 一&#xff1a;背景&#xff1a;安装hadoop启动提示未找到JAVA_HOME1.1&#xff1a;配置Hadoop的Java环境变量 二&#xff1a;排查-定位解决2.1&#xff1a;查看环境变量配置发现没有JAVA_HOME2.1.1&#xff1a;解决&#xff1a;查看java安装目录2.1.2&#xff1a;再次…

vue3后台管理框架之API接口统一管理

在开发项目的时候,接口可能很多需要统一管理。在src目录下去创建api文件夹去统一管理项目的接口; 参数请参考mock中的模拟接口 //统一管理咱们项目用户相关的接口import request from @/utils/requestimport type { loginForm, loginResponseData, userInfoReponseData } fro…

MySQL视图、用户管理和C语言链接

文章目录 1. 视图1.1 基本使用 2. 用户管理2.1 用户信息2.2 创建用户2.3 修改用户密码2.4 删除用户 3. 数据库的权限3.1 给用户授权3.2 回收权限 4. mysql connect4.1 Connector/C 使用4.2 mysql接口介绍 1. 视图 视图是一个虚拟表&#xff0c;其内容由查询定义。同真实的表一…

数字化时代的财务管理:挑战与机遇

导语&#xff1a;随着数字化技术的不断发展&#xff0c;财务管理正面临着前所未有的挑战和机遇。数字化不仅改变了财务数据的收集、处理和分析方式&#xff0c;还为财务决策提供了更多的依据和方向。本文将探讨数字化时代财务管理的新特点&#xff0c;以及如何利用数字化技术提…

二分查找的详解

## 1.3 二分查找 二分查找算法也称折半查找&#xff0c;是一种非常高效的工作于有序数组的查找算法。后续的课程中还会学习更多的查找算法&#xff0c;但在此之前&#xff0c;不妨用它作为入门。 1) 基础版 需求&#xff1a;在**有序**数组 $A$ 内&#xff0c;查找值 $targ…

【教程】使用vuepress构建静态文档网站,并部署到github上

官网 快速上手 | VuePress (vuejs.org) 构建项目 我们跟着官网的教程先构建一个demo 这里我把 vuepress-starter 这个项目名称换成了 howtolive 创建并进入一个新目录 mkdir howtolive && cd howtolive使用你喜欢的包管理器进行初始化 yarn init 这里的问题可以一…

可观测 AIOps 的智能监控和诊断实践丨QCon 全球软件开发大会总结

作者&#xff1a;董善东&#xff08;梵登&#xff09; 本文是作者于 9 月 5 日在 QCon 北京 2023&#xff08;全球软件开发大会&#xff09;上做的《阿里云可观测 AIOps 的智能监控和诊断实践》专题演讲文字版。 大家上午好&#xff0c;很高兴可以在 QCon 稳定性和可观测的场…

优化网站以提升原创性和性能

一、创新性构建网站框架 1. 精简页面渲染流程&#xff1a;杜绝多余的代码和无谓的图像&#xff0c;利用CDN快速资源分发&#xff0c;以精减加载时间。 2. 精心规划内容层次&#xff1a;借助恰如其分的标题和精炼描述&#xff0c;迅速揭示页面精髓&#xff0c;满足搜索引擎智慧…

基于社会群体优化的BP神经网络(分类应用) - 附代码

基于社会群体优化的BP神经网络&#xff08;分类应用&#xff09; - 附代码 文章目录 基于社会群体优化的BP神经网络&#xff08;分类应用&#xff09; - 附代码1.鸢尾花iris数据介绍2.数据集整理3.社会群体优化BP神经网络3.1 BP神经网络参数设置3.2 社会群体算法应用 4.测试结果…

【网络安全 --- Burp Suite抓包工具】学网安必不可少的Burp Suite工具的安装及配置

一&#xff0c;下载JDK 由于BP是java语言开发的&#xff0c;运行环境需要安装好Java的JDK&#xff0c;不然程序没法运行&#xff0c;首先下载Java的JDK 下载网址&#xff1a; 国内&#xff1a; https://www.java.com/zh-CN/download/https://www.java.com/zh-CN/download/ 国外…

前端开发新趋势:Web3、区块链与虚拟现实

文章目录 Web3&#xff1a;下一代互联网区块链技术去中心化应用程序&#xff08;DApps&#xff09; 区块链&#xff1a;重塑数字世界数字钱包NFT&#xff08;非同质化代币&#xff09; 虚拟现实&#xff1a;沉浸式体验WebVR和WebXR三维图形 新挑战与机会性能与复杂性安全性创新…

c++视觉处理----分水岭算法

分水岭算法 分水岭算法是一种图像处理和分割算法&#xff0c;通常用于分离数字图像中的不同对象或区域。该算法的名称来自地理学中的"分水岭"概念&#xff0c;其中高地图上的山脊分割了不同的水流方向&#xff0c;类似地&#xff0c;分水岭算法可以分割图像中的不同…

Ai_drive _103_重新思考图像融合策略和自监督对比学习

近先进的无监督学习方法使用类似连体的框架来比较来自同一图像的两个“视图”以进行学习表示。使这两种观点与众不同的是保证无监督方法可以学习有意义信息核心。但是&#xff0c;如果用于生成两个视图的增强不够强&#xff0c;则此类框架有时会在过度拟合方面变得脆弱&#xf…

VL53L5CX驱动开发(4)----运动指示器

VL53L5CX驱动开发----4.运动指示器 概述视频教学样品申请源码下载生成STM32CUBEMX选择MCU串口配置IIC配置 INT设置配置使能与复位X-CUBE-TOF1串口重定向代码配置检测流程TOF代码配置主程序演示结果 概述 VL53L5CX传感器内置了一个固件功能&#xff0c;可以检测场景中的运动。这…

【算法|动态规划No.21】leetcode494. 目标和

个人主页&#xff1a;兜里有颗棉花糖 欢迎 点赞&#x1f44d; 收藏✨ 留言✉ 加关注&#x1f493;本文由 兜里有颗棉花糖 原创 收录于专栏【手撕算法系列专栏】【LeetCode】 &#x1f354;本专栏旨在提高自己算法能力的同时&#xff0c;记录一下自己的学习过程&#xff0c;希望…

Redis的五大基础数据类型

String 字符串类型&#xff0c;通过set关键字和get关键字来设置字符串键值对和获取字符串键值对。 hash 哈希类型&#xff0c;结构和Map<String,Map<String,stirng>>类似。 使用hset来设置哈希&#xff0c;使用hget来获取哈希&#xff0c;hget要精确到第二个key…