使用 vite 配置请求代理

 介绍vite

        vue官方提供的前端构建工具。

由两个部分组成

        开发服务器:基于ES模块提供丰富的内建功能

        构建指令:使用 Rollup 打包代码,提供预设配置

Rollup:

        Rollup 是一个 JavaScript 模块打包器,它可以将多个模块打包成一个单独的文件。与其他打包工具(如 Webpack)不同,Rollup 更注重于创建小型、高效的打包文件,适用于构建库、框架和组件等应用场景。

Rollup 采用 ES6 模块的标准语法,可以将代码转换为标准的 ES5 语法,并且支持 Tree Shaking 特性,可以识别并删除未使用的代码,使打包后的文件更小、更高效。

使用 Rollup 打包代码可以提供更小的文件体积和更好的性能,同时还可以通过插件系统扩展其功能,例如添加压缩插件来进一步减小文件体积。

优化两个地方

        开发服务器启动

        热更新

使用vite配置请求代理

vite 配置

        在项目的vite.config.ts文件中配置。

什么是跨域?

        同源:两个url请求的协议 protocol、端口 port、域名 host 相同就是同源

        跨域:就是不同源的url请求

为什么限制跨域?

        出于安全性,浏览器会限制脚本内发起跨源 HTTP 请求 (XMLHttpRequest 和 Fetch API)。

        web 应用请求

                只能从加载应用程序的同一个请求 HTTP 资源。

                除非包含 CORS 响应头。

如何解决跨域问题

        常用方法:

                jsonp:<script> 不受同源策略限制

                跨源域资源共享 CORS:允许web应用服务器进行跨源访问控制

                使不同源变成同源(使用反向代理)

什么是反向代理?

        代理:请求转发

                客服端与服务端之间通过代理服务器进行请求。

        

        代理服务器类型:

                正向代理: 客户端告诉代理服务器资源地址。例如带电话,告诉服务商打给谁。

                反向代理:客户端只告诉代理服务器想要什么资源。不知道具体地址。

反向代理如何解决跨域问题?

        通过反向代理服务器分配不同标识进行访问,不同的域服务端

        

                

              

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

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

相关文章

UG949 适用于 FPGA 和 SoC 的UltraFast 设计方法指南

使用RTL创建设计 定义RTL设计层级 模块边界输出进行寄存 即寄存器输出&#xff0c;打一拍 IP的使用 AMBA AXI

BPF 管理器 bpfman 简介

1. 背景 Fedora 40 提案建议将 bpfman 作为默认的程序管理器 &#xff0c;开源项目 bpfman 可以实现对 eBPF 运行状态的深入了解&#xff0c;从而实现更轻松地管理 eBPF 程序&#xff08;包括加载、卸载、运行状态查看等&#xff09;。该提案还需要 Fedora 工程和指导委员会 (…

AIGC专题:从0到1精益创新 AIGC产品应用及商业化落地实践

今天分享的是AIGC系列深度研究报告&#xff1a;《AIGC专题&#xff1a;从0到1精益创新 AIGC产品应用及商业化落地实践》。 &#xff08;报告出品方&#xff1a;易点天下&#xff09; 报告共计&#xff1a;38页 企业内部增效-AI知识库 企业内部IT、运维、人力资源、行政等等日…

Unity 模板方法模式(实例详解)

文章目录 简介示例1&#xff1a;游戏关卡流程示例2&#xff1a;测试试卷类示例3&#xff1a;游戏场景构建流程示例4&#xff1a;游戏动画序列示例5&#xff1a;游戏对象初始化过程 简介 Unity中的模板方法模式是一种行为设计模式&#xff0c;它在父类中定义了一个算法的框架&a…

微软新的内部开发部门发现了第一个 Windows 12 版本

Windows 11 被证明让很多人有点失望&#xff0c;很多 Windows 10 用户认为没有理由升级。 这意味着有大量用户渴望一些大而令人印象深刻的东西——而这正是 Windows 12 所希望的。 无论您是 Windows 10 的忠实拥趸&#xff0c;还是渴望更新、更闪亮的 Windows 11 采用者&#x…

笔记本电脑Win11重装系统教程

在笔记本电脑Win11操作过程中&#xff0c;用户如果遇到很严重的系统问题&#xff0c;就可以重新正常的Win11系统&#xff0c;快速解决Win11系统问题。但是&#xff0c;部分新手用户不知道不知道如何操作才能给Win11笔记本电脑重装系统&#xff1f;以下小编分享笔记本电脑Win11重…

分布式事务(五)——基于本地消息和可靠消息的解决方案

系列目录&#xff1a; 《分布式事务&#xff08;一&#xff09;—— 事务的基本概念》 《分布式事务&#xff08;二&#xff09;—— CAP和Base理论》 《分布式事务&#xff08;三&#xff09;—— 两阶段提交解决方案&#xff08;2PC&#xff09;》 《分布式事务&#xff0…

安卓滚动视图ScrollView

<?xml version"1.0" encoding"utf-8"?> <LinearLayout xmlns:android"http://schemas.android.com/apk/res/android"android:layout_width"match_parent"android:layout_height"match_parent"android:orientatio…

mybatisplus-多数据源配置

1. 流程 pom文件yml配置多数据源具体服务添加注解DS(“***”) 1.pom文件 <!--mybatis plus 起步依赖--><dependency><groupId>com.baomidou</groupId><artifactId>mybatis-plus-boot-starter</artifactId><version>3.4.0</vers…

《苍穹外卖》电商实战项目实操笔记系列(P123~P184)【下】

史上最完整的《苍穹外卖》项目实操笔记系列【下篇】&#xff0c;跟视频的每一P对应&#xff0c;全系列10万字&#xff0c;涵盖详细步骤与问题的解决方案。如果你操作到某一步卡壳&#xff0c;参考这篇&#xff0c;相信会带给你极大启发。 上篇&#xff1a;P1~P65《苍穹外卖》项…

JavaWeb前端——HTML/CSS

HTML/CSS概述 HTML&#xff1a;学习标签&#xff0c;CSS&#xff1a;学习样式 HTML 1. 不区分大小写。 2. 属性可以使用单引号/双引号 3. 在记事本/编辑器中编写html语言&#xff0c;通过浏览器解析渲染语言 4. 语法结构松散&#xff08;编写时要尽量严谨&#xff09; VSc…

Vulnhub-RIPPER: 1渗透

文章目录 一、前言1、靶机ip配置2、渗透目标3、渗透概括 开始实战一、信息获取二、rips的使用三、获取密码文件四、日志审查五、提权 一、前言 由于在做靶机的时候&#xff0c;涉及到的渗透思路是非常的广泛&#xff0c;所以在写文章的时候都是挑重点来写&#xff0c;尽量的不饶…

Ant Design Mini - 支付宝小程序官方推出的免费开源 UI 组件库,新增支持微信小程序,实用性大大增加

支付宝小程序官方的 UI 组件库开始支持运行在微信小程序上了&#xff0c;如果要开发这两家小程序平台&#xff0c;这套组件很合适。 Ant Design Mini 也简称 antd-mini &#xff0c;是一套运行在支付宝小程序的 UI 组件库&#xff0c;UI 设计遵循 Ant Design 规范&#xff0c;…

前端Vue select 下拉框详解以及监听事件

目录 简介 使用详解 演示示例 :key"option.value" :value"option.value" 区别 监听事件 简介 在 Vue 中&#xff0c;下拉框通常通过 <select> 元素与一系列的 <option> 元素来创建。Vue 的数据绑定和指令&#xff08;如 v-model 和 v-for…

color - 让你的输出带点颜色

color color 是一个可以让你输出带颜色文本的库。 安装 go get github.com/fatih/color示例 输出到控制台 // 这会直接输出到控制台 color.Cyan("Prints text in cyan.")// 每个调用末尾会自动加上换行 color.Blue("Prints %s in blue.", "text&…

composer常用命令

查看全局配置信息 composer config -gl 设置镜全局像地址 composer config -g repo.packagist composer https://mirrors.aliyun.com/composer/ 去掉-g&#xff0c;即表示只有当前项目使用该镜像 批量安装composer项目依赖 composer install 执行该命令后&#xff0c;会读取当…

1295584-83-6,NOTA 马来酰亚胺,可通过与铁离子结合增强MRI信号

您好&#xff0c;欢迎来到新研之家 文章关键词&#xff1a;1295584-83-6&#xff0c;NOTA Maleimide&#xff0c;NOTA Mal&#xff0c;NOTA马来酰亚胺 一、基本信息 产品简介&#xff1a;NOTA Maleimide has good water solubility and stability, which enables it to main…

不移其志,踏浪前行 | 北京智和信通召开2023年度工作总结大会

岁聿云暮&#xff0c;新元肇启&#xff0c;2024年1月24日&#xff0c;北京智和信通技术有限公司&#xff08;以下简称“北京智和信通”&#xff09;召开2023年度年终总结大会。会上&#xff0c;各部门负责人全面分析公司业务发展态势&#xff0c;各部门员工依次汇报主要工作情况…

Javaweb实现的学生宿舍管理系统

Javaweb实现的学生宿舍管理系统 文章目录 Javaweb实现的学生宿舍管理系统系统介绍技术选型成果展示源码获取账号地址及其他说明 系统介绍 Javaweb实现的学生宿舍管理系统采用jspservlet技术实现了如下功能模块&#xff0c;分别是宿舍管理员管理、学生管理、宿舍楼管理、缺勤记…

Solidworks 与 MATLAB 联合仿真

本文主要讲解了“MATLAB与SolidWorks的联合仿真怎么实现”&#xff0c;文中的讲解内容简单清晰&#xff0c;易于学习与理解&#xff0c;下面请大家跟着小编的思路慢慢深入&#xff0c;一起来研究和学习“MATLAB与SolidWorks的联合仿真怎么实现”吧&#xff01; 下载插件。 1、…