前端面试题---vue router 哈希模式和历史模式有什么区别

server/2025/3/4 6:27:20/

Vue Router 提供两种路由模式:它们的主要区别在于 URL 的表现形式以及需要的服务器配置。

1. 哈希模式)
URL 格式:http://example.com/#/home

  • 在 URL 中使用 # 符号来分隔路径和页面,# 后面的部分不会被浏览器视为实际路径。

  • 服务器配置:
    不需要特别配置服务器,因为 # 后面的部分不会发送到服务器,所有请求都指向同一个页面。

  • 优点:
    简单,不需要额外的服务器配置,兼容性好,适用于没有控制服务器的情况。

  • 缺点:
    URL 中包含 # 符号,看起来不够干净,影响用户体验。

2. 历史模式
URL 格式:http://example.com/home

URL 看起来更干净,没有 # 符号,像传统的多页面应用。

  • 服务器配需要服务器支持 HTML5 的 history.pushState,否则会出现 404 错误,因为直接刷新或访问子路由时,服务器需要返回正确的 HTML 页面。

  • 优点:
    更美观、清晰的 URL,符合传统 Web 应用的标准。

  • 缺点:
    需要服务器配置支持,否则可能会导致页面刷新时报 404 错误。

总结:
哈希模式:不需要服务器配置,适合简单应用,但 URL 中有 #。
历史模式:更清晰的 URL,但需要配置服务器支持 HTML5 历史记录。


http://www.ppmy.cn/server/172268.html

相关文章

蓝桥杯试题:二分查找数组元素

一、题目描述 给定一个数组&#xff0c;其采用如下代码定义&#xff1a; int data[200]; for(i 0 ; i < 200 ; i &#xff09;data[i] 4 * i 6;现给定某个数&#xff0c;请你求出它在 data 数组中的位置&#xff08;下标&#xff09;。 输入描述 输入一个待查找的整数…

leetcode141.环形链表,142环形链表ii

目录 问题描述示例提示 具体思路思路一 代码实现问题描述具体思路思路一思路二 问题描述 给你一个链表的头节点 head &#xff0c;判断链表中是否有环。 如果链表中有某个节点&#xff0c;可以通过连续跟踪 next 指针再次到达&#xff0c;则链表中存在环。 为了表示给定链表中的…

自学微信小程序的第六天

DAY6 1、使用录音API首先需要通过wx.getRecorderManager()方法获取到一个RecorderManager实例,该实例是一个全局唯一的录音管理器,用于实现录音功能。 表32:RecorderManager实例的常用方法 方法名称 说明 start() 开始录音 pause() 暂停录音 resume() 继续录音 stop() 停止…

10种方法教你又小又清晰地压缩视频

视频压缩是有可能会损失画质的&#xff0c;但也可以通过一些方法尽量减少画质损失。在有效压缩视频大小的同时&#xff0c;尽量控制视频压缩画质在人眼无法察觉的范围内。下面就从10个角度向大家介绍10个不同的视频压缩方法&#xff0c;并推荐相关的视频压缩软件&#xff0c;整…

AI赋能视频创作:零基础也能玩转短视频制作

在短视频风靡的今天&#xff0c;你是否也渴望创作出属于自己的精彩作品&#xff0c;却苦于没有专业设备和剪辑技巧&#xff1f;别担心&#xff0c;AI技术的飞速发展为我们带来了全新的解决方案&#xff01;即使你是零基础小白&#xff0c;也能借助AI工具轻松合成小视频&#xf…

DeepSeek R1满血+火山引擎详细教程

DeepSeek R1满血火山引擎详细教程 一、安装Cherry Studio。 Cherry Studio AI 是一款强大的多模型 AI 助手,支持 iOS、macOS 和 Windows 平台。可以快速切换多个先进的 LLM 模型,提升工作学习效率。下载地址 https://cherry-ai.com/ 认准官网&#xff0c;无强制注册。 这…

FPGA的ram Xilinx的IP Block Memory Generator

做过设计的对memory都比较熟悉了&#xff0c;在Asic设计中通常是rom&#xff0c;ram&#xff0c;那这些rom&#xff0c;ram在FPGA的模式下面怎么做呢&#xff0c;有两种方法&#xff0c;一种就是自己写代码&#xff0c;用寄存器去搭&#xff0c;搭好后需要指定综合成block ram&…

Sparsely-Gated Mixture-of-Experts Layer (MoE)论文解读与Pytorch代码实现

MoE解析 阅读论文&#xff1a;https://arxiv.org/pdf/1701.06538 OUTRAGEOUSLY LARGE NEURAL NETWORKS:THE SPARSELY-GATED MIXTURE-OF-EXPERTS LAYER 本文介绍了一种名为Sparsely-Gated Mixture-of-Experts Layer (MoE) 的神经网络组件&#xff0c;旨在通过条件计算&#xf…