转行小白历险记-2023.12.19 如何解决跨域问题

讨厌突如其来的破坏计划的感觉,真的好烦

一、跨域以及如何解决跨域问题(反向代理)

  1. 跨域

    1. 同源:协议、端口、域名相同
  2. 如何解决跨域问题

    1. jsonp:<script> 不受同源策略限制
    2. 跨源域资源共享 CORS:允许 Web 应用服务器进行跨源访问控制
    3. 使不同的源变成同源
  3. 什么时是反向代理

    1. 代理:请求转发
    2. 正向代理:客户端告诉代理服务器的地址
    3. 反向代理:客户端只需要告诉需要的东西

二、介绍 vite

  1. 由两个部分组成

    1. 开发服务器:基于ES模块提供丰富的内建功能
    2. 构建指令:使用 Rollup 打包代码,提供预设配置
  2. 热更新:

    1. 修改的东西会立刻反应到页面上,叫做热更新
  3. 为什么选择vite

    1. 启动本地开发服务器的时间会很久

      1. 依赖:使用 esbuild 进行依赖预打包,esbuild 使用 Go 编写,会比javascript-based 的打包工具快 10-100 倍
      2. 源码:使用浏览器原生es module 提供源码,让浏览器接管打包工具的部分工作
    2. 热更新也会很慢

      1. 使用ESM 不需要重新编译:一些打包工具的开发服务器在文件更改时,需要重新构建整个项目,来获取新的模块依赖关系
      2. 使用浏览器缓存加速:Vite 利用HTTP头来加速整个页面的重新加载

三、使用vite配置请求代理

使用 Vite 或 Webpack Dev Server

在开发环境中,可以在 Vite 或 Webpack Dev Server 中配置反向代理:

// Vite 配置示例
export default {server: {proxy: {'/api': {target: 'http://backend.example.com', // 后端服务器地址changeOrigin: true,rewrite: path => path.replace(/^\/api/, '')}}}
}

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

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

相关文章

Inkscape SVG 编辑器 导入 Gazebo

概述 本教程描述了拉伸 SVG 文件的过程&#xff0c;这些文件是 2D 的 图像&#xff0c;用于在 Gazebo 中为您的模型创建 3D 网格。有时是 更容易在 Inkscape 或 Illustrator 等程序中设计模型的一部分。 在开始之前&#xff0c;请确保您熟悉模型编辑器。 本教程将向您展示如…

6.5 代理j ava.lang.reflect.proxy

6.5 代理proxy java.lang.reflect.proxy&#xff0c;用于创建动态代理类和实例&#xff0c; java.lang.reflect.InvocationHandler&#xff0c;使用动态代理创建实例时&#xff0c;需提供实现接口的类的实例。提供invoke方法&#xff0c;接收三个参数&#xff1a;代理对象、…

在灾难推文分析场景上比较用 LoRA 微调 Roberta、Llama 2 和 Mistral 的过程及表现

引言 自然语言处理 (NLP) 领域的进展日新月异&#xff0c;你方唱罢我登场。因此&#xff0c;在实际场景中&#xff0c;针对特定的任务&#xff0c;我们经常需要对不同的语言模型进行比较&#xff0c;以寻找最适合的模型。本文主要比较 3 个模型: RoBERTa、Mistral-7B 及 Llama-…

二叉树..

文章目录 1. 对称二叉树-力扣 101 题2. 二叉树最大深度-力扣 104 题 前中后序非递归实现通用代码&#xff1a; LinkedList<TreeNode> stack new LinkedList<>();TreeNode curr root; // 代表当前节点 TreeNode pop null; // 最近一次弹栈的元素 while (curr ! …

webrtc支持的最小宽度和高度

代码在&#xff1a;h264/sps_parser.cc // // IMPORTANT ONES! Now were getting to resolution. First we read the pic // width/height in macroblocks (16x16), which gives us the base resolution, // and then we continue on until we hit the frame crop offsets, wh…

shell——变量之字符串的截取

上篇文章讲到字符串的截取可以用字符位置索引的方式&#xff0c;即 从字符串第二个位置开始截取5个(索引值从0开始) echo "${string:1:5}" 我们还可以使用#*字符或%字符*的方式进行从左或从右的截取。 废话不多说&#xff0c;直接上例子。 #!/bin/bash str"…

微信支付宝小程序生成二维码

一、生成微信小程序二维码 微信官网API文档 1.下载到本地 Overridepublic String getWxRemovalCode() {String appId "微信小程序AppID";String secret "微信小程序AppSecret";//获取凭证String token weiXinService.getAccessToken(appId, secret);Ma…

【CSS @property】CSS自定义属性说明与demo

CSS property property - CSS: Cascading Style Sheets | MDN At 规则 - CSS&#xff1a;层叠样式表 | MDN Custom properties (–*): CSS variables - CSS: Cascading Style Sheets | MDN CSS Houdini - Developer guides | MDN &#x1f4da; 什么是property? property CSS…

Web ML 库的Transformers.js 提供文本转语音功能

JavaScript 库 Transformers.js 提供了类似 Python Transformers 库的功能&#xff0c;设计用于在 Web 浏览器中直接运行 Transformer 模型&#xff0c;而不再需要外部服务器参与处理。在最新的 2.7 版本中&#xff0c;Transformers.js 引入了增强功能&#xff0c;其中包括文本…

2023年度佳作:AIGC、AGI、GhatGPT 与人工智能大模型的创新与前景展望

&#x1f3ac; 鸽芷咕&#xff1a;个人主页 &#x1f525; 个人专栏:《linux深造日志》《粉丝福利》 ⛺️生活的理想&#xff0c;就是为了理想的生活! ⛳️ 写在前面参与规则 ✅参与方式&#xff1a;关注博主、点赞、收藏、评论&#xff0c;任意评论&#xff08;每人最多评论…

day5 力扣合并区间--实际应用视频剪辑

以数组 intervals 表示若干个区间的集合&#xff0c;其中单个区间为 intervals[i] [starti, endi] 。请你合并所有重叠的区间&#xff0c;并返回 一个不重叠的区间数组&#xff0c;该数组需恰好覆盖输入中的所有区间 。示例 1&#xff1a; 输入&#xff1a;intervals [[1,3],…

System.Text.Json类库进行json转化时 ValueKind:Object 问题

文章目录 写在前面问题描述解决办法扩展 Datetime类型转换源码完整的配置 写在前面 以下方法中的所有转换器都属于刚刚能解决我的问题状态&#xff0c;实际使用过程中应该编写更加严谨的逻辑。 问题描述 webapi 当使用System.Text.Json类库进行json转化时&#xff0c;如果没…

LeetCode 2828. 判别首字母缩略词

【LetMeFly】2828.判别首字母缩略词 力扣题目链接&#xff1a;https://leetcode.cn/problems/check-if-a-string-is-an-acronym-of-words/ 给你一个字符串数组 words 和一个字符串 s &#xff0c;请你判断 s 是不是 words 的 首字母缩略词 。 如果可以按顺序串联 words 中每…

MTK平台 BT从SW 如何分析 Pairing Fail 和 Abnormal Disconnection Issue

一 概要 本文旨在介绍当配对/回连失败(Pairing Fail) 以及 异常断线(Abnormal Disconnection) 类问题发生时,需要取得哪些必要的log、如何获取这些log,以及怎样对log进行简单的分析解读,协助定位问题点,过滤掉一些常见的因测试操作步骤、IOT device、测试环境等导致的误…

TCP 核心工作机制

TCP 的核心知识&#xff1a;如何保证传输可靠 如何提高传输效率 如何保证传输可靠&#xff1a;确认应答机制 超时重传机制 如何提高传输效率&#xff1a;滑动窗口机制、流量控制机制、延时应答机制、捎带确认机制、拥塞控制机制 可靠机制 TCP的可靠性主要是通过 确认应答 …

【轻量化篇】YOLOv8改进实战 | 更换主干网络 Backbone 之 RepGhostnet,重参数化实现硬件高效的Ghost模块

YOLOv8专栏导航:点击此处跳转 前言 轻量化网络设计是一种针对移动设备等资源受限环境的深度学习模型设计方法。下面是一些常见的轻量化网络设计方法: 网络剪枝:移除神经网络中冗余的连接和参数,以达到模型压缩和加速的目的。分组卷积:将卷积操作分解为若干个较小的卷积操…

[学习笔记]SQL Server中批量查找所有符合Where条件的记录

目标&#xff1a;在SQL Server中查找所有表的UserId 50的记录 创建一个表变量来存储所有包含’UserId’列的表的名称。然后使用一个游标遍历这些表&#xff0c;并对每个表执行一个动态SQL查询 DECLARE TableName nvarchar(256), ColumnName nvarchar(128), SearchStr2 nvarc…

CentOS 宣布停更3年后,服务器操作系统何去何从?

“CentOS 要停止更新了&#xff1f;” 盯着电脑&#xff0c;某大型企业数字化部门的负责人彭素素看到这个消息&#xff0c;不仅在心里发出了一声惊呼。 2020年&#xff0c;CentOS 停止更新的消息&#xff0c;不仅彭素素所在的企业&#xff0c;对于不少正在使用 CentOS 的厂商…

app设置为HomeLauncher后,如果进行adb install安装,界面会黑屏问题排查记录

一、开始以为是PMS的问题,但是读完PackageManagerService.java的安装流程后发现并不是这么回事。 其中比较重要的是freezePackageForInstall函数,app在替换原来的内容之前,会先冻住正在运行的app,然后发送kill命令到ActivityManagerService,在AMS中才会去kill掉app。而且…

Python多个列表连接实例代码解析

概要 在Python中&#xff0c;连接多个列表是一种常见的操作&#xff0c;用于将多个列表合并为一个。这个过程可以应用于各种数据处理和编程任务中。本文将介绍多种连接多个列表的方法&#xff0c;并提供详细的示例代码来帮助大家更好地理解。 使用 运算符 最简单的方法是使用…