AWS Cloudfront支持vuejs的html5模式

news/2024/10/11 13:31:00/

前提

  • 1.vuejs项目使用html5模式;
  • 2.vuejs项目独立部署在一个s3桶中;
  • 3.vuejs项目独立使用一个AWS Cloudfront的CDN。

解决

只需要在Cloudfront中添加一个函数,大概规则就是如果从请求uri中提取到文件名,则表示需要访问s3,如果没有则重写到/index.html请求。
具体函数内容如下:

function handler(event) {var request = event.request;if (request.uri.match(/\/[^./]+\.[^./]+$/) === null) {request.uri = "/index.html";}return request;
}

具体怎么样在AWS Cloudfront中设置函数,可以参考AWS CloudFront使用js函数实现重定向。

总结

vuejs的html5模式就是但没有发现文件名就重写到/index.html请求。注意,这里是重写,重写,重写,不是转发。

参考

  • AWS CloudFront使用js函数实现重定向
  • CloudFront function to support HTML5 History API

http://www.ppmy.cn/news/1455556.html

相关文章

Vue 插槽

Vue插槽是一种特殊的语法,用于在组件中定义可复用的模板部分。它允许开发者在组件的标记中声明一个或多个插槽,然后在使用该组件时,可以根据自己的需求将内容插入到这些插槽中。 Vue插槽分为默认插槽和具名插槽两种。 默认插槽 语法 组件…

第七章 Python 函数进阶

一、函数的多返回值 在 def return_num(): return 1 return 2 这种情况下只能返回1,运行到 return 1后就不在继续运行了; 1.1 语法: def return_num(): return 1 ,2 x, y return_num() print(x) print(y) 按照返回值的顺序…

【linuxC语言】守护进程

文章目录 前言一、守护进程的介绍二、开启守护进程总结 前言 在Linux系统中,守护进程是在后台运行的进程,通常以服务的形式提供某种功能,如网络服务、系统监控等。守护进程的特点是在启动时脱离终端并且在后台运行,它们通常不与用…

Vue笔记 4

内置指令 1.v-text_指令 我们学过的指令: ​ v-bind : 单向绑定解析表达式, 可简写为 :xxx ​ v-model : 双向数据绑定 ​ v-for : 遍历数组/对象/字符串 ​ v-on : 绑定事件监听, 可简写为 ​ v-if : 条件渲染(动态控制节点是否存存在&#xff0…

【C++】学习笔记——string_3

文章目录 六、string类5. string类的操作6. string类的转换7. string类的模拟实现 未完待续 搭配文档食用 六、string类 5. string类的操作 上面的函数中,有些是不常用的,咱们只挑几个重要的进行讲解。 c_str 就是将字符串转换成 C语言 字符串的格式。…

红米1s 刷入魔趣 (Mokee)ROM(Android 7.1)

目录 背景准备工具硬件(自己准备)软件(我会在文末提供链接) 刷机步骤1. 重启电脑2. 安装驱动3. 刷入TWRP4. 清空数据5. 刷入魔趣6. 开机 结尾下载链接 本文由Jzwalliser原创,发布在CSDN平台上,遵循CC 4.0 B…

esp32-cam 1. 出厂固件编译与测试

0. 环境 - ubuntu18 - esp32-cam - usb转ttl ch340 硬件连接 esp32-camch340板子U0RTXDU0TRXDGNDGND5V5V 1. 安装依赖 sudo apt-get install vim sudo apt install git sudo apt-get install git wget flex bison gperf python python-pip python-setuptools python-serial p…

Flink时间语义 | 大数据技术

⭐简单说两句⭐ ✨ 正在努力的小叮当~ 💖 超级爱分享,分享各种有趣干货! 👩‍💻 提供:模拟面试 | 简历诊断 | 独家简历模板 🌈 感谢关注,关注了你就是我的超级粉丝啦! &a…