NGINX Configuration for Vue-Router in HTML5 Mode

本文详细介绍了Nginx服务器的基本配置方法,包括监听端口、默认路径设置、静态文件缓存控制等关键配置项。通过具体示例展示了如何进行基本的URL重写以及如何为常见的静态资源设置高效的缓存策略。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

server {
 listen 80 default_server;
 listen [::]:80 default_server;
  
 root /your/root/path;
  
 index index.html;
  
 server_name you.server.com;
  
 location / {
 try_files $uri $uri/ @rewrites;
 }
  
 location @rewrites {
 rewrite ^(.+)$ /index.html last;
 }
  
 location ~* \.(?:ico|css|js|gif|jpe?g|png)$ {
 # Some basic cache-control for static files to be sent to the browser
 expires max;
 add_header Pragma public;
 add_header Cache-Control "public, must-revalidate, proxy-revalidate";
 }
  
 }
Access to XMLHttpRequest at 'http://localhost:1030/zuke/house/list' from origin 'http://localhost:5173' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.了解此错误 HouseList.vue:74 POST http://localhost:1030/zuke/house/list net::ERR_FAILED 200 (OK) dispatchXhrRequest @ axios.js?v=58a38777:1648 xhr @ axios.js?v=58a38777:1528 dispatchRequest @ axios.js?v=58a38777:2003 _request @ axios.js?v=58a38777:2224 request @ axios.js?v=58a38777:2115 httpMethod @ axios.js?v=58a38777:2253 wrap @ axios.js?v=58a38777:8 loadData @ HouseList.vue:74 setup @ HouseList.vue:51 callWithErrorHandling @ chunk-UQWBJQZ5.js?v=58a38777:2263 setupStatefulComponent @ chunk-UQWBJQZ5.js?v=58a38777:9983 setupComponent @ chunk-UQWBJQZ5.js?v=58a38777:9944 mountComponent @ chunk-UQWBJQZ5.js?v=58a38777:7300 processComponent @ chunk-UQWBJQZ5.js?v=58a38777:7266 patch @ chunk-UQWBJQZ5.js?v=58a38777:6782 componentUpdateFn @ chunk-UQWBJQZ5.js?v=58a38777:7490 run @ chunk-UQWBJQZ5.js?v=58a38777:481 runIfDirty @ chunk-UQWBJQZ5.js?v=58a38777:519 callWithErrorHandling @ chunk-UQWBJQZ5.js?v=58a38777:2263 flushJobs @ chunk-UQWBJQZ5.js?v=58a38777:2471 Promise.then queueFlush @ chunk-UQWBJQZ5.js?v=58a38777:2385 queueJob @ chunk-UQWBJQZ5.js?v=58a38777:2380 effect2.scheduler @ chunk-UQWBJQZ5.js?v=58a38777:7532 trigger @ chunk-UQWBJQZ5.js?v=58a38777:509 endBatch @ chunk-UQWBJQZ5.js?v=58a38777:567 notify @ chunk-UQWBJQZ5.js?v=58a38777:827 trigger @ chunk-UQWBJQZ5.js?v=58a38777:801 set value @ chunk-UQWBJQZ5.js?v=58a38777:1673 finalizeNavigation @ vue-router.js?v=58a38777:2672 (匿名) @ vue-router.js?v=58a38777:2582 Promise.then pushWithRedirect @ vue-router.js?v=58a38777:2550 push @ vue-router.js?v=58a38777:2476 install @ vue-router.js?v=58a38777:2831 use @ chunk-UQWBJQZ5.js?v=58a38777:5940 (匿名) @ main.js:16了解此错误 Sidebar.vue:59 {data: {…}, status: 200, statusText: '', headers: AxiosHeaders, config: {…}, …}config: {transitional: {…},
最新发布
06-04
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值