前端解决axios请求的跨域问题【2步完成】

简介: 本文介绍如何通过前端配置解决跨域问题,主要针对Vue项目中的`vite.config.js`文件进行修改。作者在联调过程中遇到跨域报错

     🤹‍♀️潜意识Java:个人主页

🎙座右铭:得之坦然,失之淡然。

💎擅长领域:前端

是的,我需要您的:

🧡点赞❤️关注💙收藏💛

是我持续下去的动力!


目录

目录

一.作者有话说

二.第一步

2.1 在你的vue找到 vite.config.js

2.2 快捷代码

三. 第二步

3.1 访问路径更改编辑

3.2 问题解决了


一.作者有话说

今天我在前后端联调的时候发现了一个跨域传值报错,让我很头痛,但是好在花费不到2个小时查阅了一些资料通过前端解决了跨域问题。

解决前后端的跨域问题,本文主要是带你通过前端解决跨域问题,这里的前端指的是通过改vue的有关配置去解决跨域问题,指在解决问题,如果要系统的学习跨域问题,那么建议前后端跨域解决方案都要去了解一些。

二.第一步

ticket:1 Access to XMLHttpRequest at 'http://localhost:8080/seat' from origin 'http://localhost:5173' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

上面是报错的详细。

2.1 在你的vue找到 vite.config.js

image.gif 编辑 加入框框的这句话,内容自己更改

2.2 快捷代码

【可以复制】端口号改改就可以!

import { defineConfig } from 'vite';
export default defineConfig({
  server: {
    proxy: {
      '/seat': {
        target: 'http://localhost:8080',
        changeOrigin: true,
      }
    }
  }
});

image.gif

三. 第二步

3.1 访问路径更改 image.gif 编辑

3.2 问题解决了

到这里就解决了问题了。

我也不想啰嗦,因为我搜索了许多csdn的文章大多数都是非常的啰嗦的,


   🤹‍♀️潜意识Java个人主页

🎙座右铭:得之坦然,失之淡然。

💎擅长领域:前端

是的,我需要您的:

🧡点赞❤️关注💙收藏💛

是我持续下去的动力!


相关文章
|
13天前
|
供应链 监控 安全
对话|企业如何构建更完善的容器供应链安全防护体系
阿里云与企业共筑容器供应链安全
171328 12
|
16天前
|
供应链 监控 安全
对话|企业如何构建更完善的容器供应链安全防护体系
随着云计算和DevOps的兴起,容器技术和自动化在软件开发中扮演着愈发重要的角色,但也带来了新的安全挑战。阿里云针对这些挑战,组织了一场关于云上安全的深度访谈,邀请了内部专家穆寰、匡大虎和黄竹刚,深入探讨了容器安全与软件供应链安全的关系,分析了当前的安全隐患及应对策略,并介绍了阿里云提供的安全解决方案,包括容器镜像服务ACR、容器服务ACK、网格服务ASM等,旨在帮助企业构建涵盖整个软件开发生命周期的安全防护体系。通过加强基础设施安全性、技术创新以及倡导协同安全理念,阿里云致力于与客户共同建设更加安全可靠的软件供应链环境。
150294 32
|
24天前
|
弹性计算 人工智能 安全
对话 | ECS如何构筑企业上云的第一道安全防线
随着中小企业加速上云,数据泄露、网络攻击等安全威胁日益严重。阿里云推出深度访谈栏目,汇聚产品技术专家,探讨云上安全问题及应对策略。首期节目聚焦ECS安全性,提出三道防线:数据安全、网络安全和身份认证与权限管理,确保用户在云端的数据主权和业务稳定。此外,阿里云还推出了“ECS 99套餐”,以高性价比提供全面的安全保障,帮助中小企业安全上云。
201959 14
对话 | ECS如何构筑企业上云的第一道安全防线
|
6天前
|
存储 人工智能 安全
对话|无影如何助力企业构建办公安全防护体系
阿里云无影助力企业构建办公安全防护体系
1251 8
|
1天前
|
机器学习/深度学习 自然语言处理 PyTorch
深入剖析Transformer架构中的多头注意力机制
多头注意力机制(Multi-Head Attention)是Transformer模型中的核心组件,通过并行运行多个独立的注意力机制,捕捉输入序列中不同子空间的语义关联。每个“头”独立处理Query、Key和Value矩阵,经过缩放点积注意力运算后,所有头的输出被拼接并通过线性层融合,最终生成更全面的表示。多头注意力不仅增强了模型对复杂依赖关系的理解,还在自然语言处理任务如机器翻译和阅读理解中表现出色。通过多头自注意力机制,模型在同一序列内部进行多角度的注意力计算,进一步提升了表达能力和泛化性能。
|
6天前
|
人工智能 自然语言处理 程序员
通义灵码2.0全新升级,AI程序员全面开放使用
通义灵码2.0来了,成为全球首个同时上线JetBrains和VSCode的AI 程序员产品!立即下载更新最新插件使用。
1261 23
|
8天前
|
机器学习/深度学习 自然语言处理 搜索推荐
自注意力机制全解析:从原理到计算细节,一文尽览!
自注意力机制(Self-Attention)最早可追溯至20世纪70年代的神经网络研究,但直到2017年Google Brain团队提出Transformer架构后才广泛应用于深度学习。它通过计算序列内部元素间的相关性,捕捉复杂依赖关系,并支持并行化训练,显著提升了处理长文本和序列数据的能力。相比传统的RNN、LSTM和GRU,自注意力机制在自然语言处理(NLP)、计算机视觉、语音识别及推荐系统等领域展现出卓越性能。其核心步骤包括生成查询(Q)、键(K)和值(V)向量,计算缩放点积注意力得分,应用Softmax归一化,以及加权求和生成输出。自注意力机制提高了模型的表达能力,带来了更精准的服务。
|
6天前
|
消息中间件 人工智能 运维
1月更文特别场——寻找用云高手,分享云&AI实践
我们寻找你,用云高手,欢迎分享你的真知灼见!
506 21
1月更文特别场——寻找用云高手,分享云&AI实践
|
6天前
|
机器学习/深度学习 人工智能 自然语言处理
|
12天前
|
人工智能 自然语言处理 API
阿里云百炼xWaytoAGI共学课DAY1 - 必须了解的企业级AI应用开发知识点
本课程旨在介绍阿里云百炼大模型平台的核心功能和应用场景,帮助开发者和技术小白快速上手,体验AI的强大能力,并探索企业级AI应用开发的可能性。

热门文章

最新文章