简体   繁体   English

我应该使用Nginx重写Nuxt.js吗

[英]Should I use nginx to rewrite Nuxt.js

I am using Nuxt.js to develop a website now. 我现在正在使用Nuxt.js开发一个网站。

I wrote some pages in the Page Folder. 我在页面文件夹中写了一些页面。

Pages/
  Index.vue
  profile/
     Index.vue

Then , When I access 然后,当我访问

http://www.mywebsite.com/
http://www.mywebsite.com/profile

will show the Index.vue in Pages/ and profiles/ 将在Pages /和profile /中显示Index.vue

Now , I need my website using url to define the language of website , like 现在,我需要使用url定义网站语言的网站,例如

http://www.mywebsite.com/en/   English
http://www.mywebsite.com/ja/profile  Japanese

So I use nginx with proxy_pass and rewrite to solve this problem I use the configs below 所以我将nginx与proxy_pass一起使用并重写以解决此问题,我使用下面的配置

proxy_pass http://localhost:7777;
rewrite ^/cn/(.*) /$1 last;

In developing (run npm dev / nuxt), The site will render the redirected page and turn to blank page with the error immediately . 在开发过程中(运行npm dev / nuxt),站点将呈现重定向的页面并立即变为空白页面,并显示错误消息。 Which is said that the server and client is not sync . 据说服务器和客户端不同步。

I think the problem is the development mode will auto reload , so the server can detect the url is not same as the pages path. 我认为问题是开发模式会自动重新加载,因此服务器可以检测到与页面路径不相同的url。

Then I try to run 然后我试着跑

nuxt build
npm start

The site is builded and the redirect is success. 网站已建立,重定向成功。

Here is some questions 这是一些问题

1) How can I stop the detection when i use "npm dev" ? 1)当我使用“ npm dev”时如何停止检测? If I run "npm start" , the page will not be updated anymore even I update the file. 如果我运行“ npm start”,则即使我更新文件也不会更新页面。

2) I will detect urls language and load different language json file. 2)我将检测URL语言并加载不同语言的json文件。 will this affect Nuxt.js 's Server Side Rendering ? 这会影响Nuxt.js的服务器端渲染吗?

3) Any other simpler way to solve my problem ? 3)还有其他更简单的方法来解决我的问题吗? or any nuxt/vue can perform "lang in URL" and let server render all languages' page correctly ? 还是任何nuxt / vue都能执行“ URL中的语言”并让服务器正确呈现所有语言的页面?

For 2) and 3), there is actually a much simpler approach, without using nginx 对于2)和3),实际上有一种更简单的方法,而无需使用nginx

https://github.com/nuxt-community/nuxt-i18n https://github.com/nuxt-community/nuxt-i18n

You can find exact example of what you want to achieve here 您可以在此处找到要实现的目标的确切示例

https://nuxt-community.github.io/nuxt-i18n/routing.html#routing https://nuxt-community.github.io/nuxt-i18n/routing.html#routing

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

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