简体   繁体   English

Vue路由器和动态路由nginx

[英]Vue-router and dynamic routes nginx

I have been using history mode which was working great and used the simple nginx.我一直在使用运行良好的历史模式,并使用了简单的 nginx。 I have now added dynamic routes so that when a user types baseurl.com/microcosm/anynametheywant - this connects them to that space which works great in local development but when I move to the server I get 404s from this, I have tried a number of things here is current nginx, router/index.js - still doesn't work and still returns the server 404 not even the component help appreciated我现在添加了动态路由,以便当用户键入 baseurl.com/microcosm/anynametheywant 时 - 这会将它们连接到在本地开发中效果很好的空间,但是当我移动到服务器时,我从中得到 404,我尝试了一个数字这里的事情是当前的 nginx,router/index.js - 仍然无法正常工作,仍然返回服务器 404,甚至组件帮助都不赞赏

NGINX file as it stands NGINX 文件原样

server {
    listen 111.111.11.111:80;
    server_name *.nodenogg.in;

location / {
  try_files $uri $uri/ /index.html;
}

location @rewrites {
  rewrite ^(.)$ /index.html last;
}

location ~ /microcosm/\d+$ {
   try_files $uri $uri/ /index.html;
}

}

router/index.js路由器/index.js

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home
  },
  {
    path: '/about',
    name: 'About',
    component: () =>
      import(/* webpackChunkName: "about" */ '../views/About.vue')
  },
  // dynamic segement `:microcosm` is added to the path
  {
    path: '/microcosm/:microcosm',
    component: Home
  },
  {
    path: '*',
    name: 'NotFound',
    component: NotFound
  }

]
const router = new VueRouter({
  mode: 'history',
  base:   base: process.env.VUE_APP_HTTP + '://' + process.env.VUE_APP_URL + '/',
  routes
})

export default router

grabbing and using Router.currentRoute.params.microcosm抓取和使用 Router.currentRoute.params.microcosm

Turns out firstly I needed to add to the bottom of my custom nginx and of course I needed to be listening on 443 so it was never being heard and I dont even need the alias thing at this point as I want that to be a 404 and now it is my custom one.结果首先我需要添加到我的自定义 nginx 的底部,当然我需要在 443 上收听,所以它从来没有被听到,我什至不需要别名,因为我希望它是 404 和现在这是我的定制。 and finally then remove the *.nodenogg.in what a mistake costing me hours !最后然后删除 *.nodenogg.in 真是一个错误,花了我几个小时!

server {

  listen 111.111.11.111:443 ssl;
  server_name alpha.nodenogg.in ssl;
  root /var/www/vhosts/nodenogg.in/alpha.nodenogg.in;

  ssl_certificate /location/ofthekey/cert.pem;
  ssl_certificate_key /location/ofthekey/privkey.pem;
  ssl_protocols SSLv3;

         location / {
           try_files $uri $uri/ /index.html;
         }
 }

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM