React Router`browserHistory`：我必須在服務器上渲染嗎？

我是新來React，只是學習如何路由工作。 hashHistory（/#/paths/like/this）的偉大工程，但browserHistory（/paths/like/this）看起來好多了。顯然，browserHistory路徑不正確的開箱，當我重新打開的網址，因爲broweser要求/path/on/server不存在。React Router`browserHistory`：我必須在服務器上渲染嗎？

的問題是：我必須使用服務器端渲染（所謂isomorphic rendering）爲了使用/nice/paths，直接讓用戶打開頁面，或者能夠按Ctrl + R頁，並保持他們在哪裏，或有是否只有client-side呈現的選項？

謝謝。

來源

2017-04-26 SmxCde

不，您可以輕鬆使用client-side呈現並允許用戶使用像nice/paths/這樣的路徑。

因爲這些路線都只是一個陣營方便，在服務器上不存在，直接將他們拋出的網頁根本不存在錯誤。要解決這個問題，您應該將所有路線指向服務器的index.html（您的應用程序入口點），然後讓React接管來處理路徑。

在表達它會做這樣的：

app.get('*', function(req, res) { 
    res.sendFile(__dirname + '/public/index.html') 
})

對於Apache服務器，這將是.htaccess：

<IfModule mod_rewrite.c> 
    RewriteEngine On 
    RewriteBase/
    RewriteRule ^index\.html$ - [L] 
    RewriteCond %{REQUEST_FILENAME} !-f 
    RewriteCond %{REQUEST_FILENAME} !-d 
    RewriteRule . /index.html [L] 
</IfModule>

對於其他服務器端語言，他們有自己的方法，而這指向到index.html基本適用於像Angular等所有SPA框架，因爲邏輯是相同的。

來源

2017-04-26 05:24:50 mrinalmech

謝謝你，這是有道理的。 – SmxCde

Mrinalmech給了正確的答案，我只是想添加一個配置的一個例子Nginx的：

server { 

    server_name yourHostName.com; 
    listen 80; 

    root /path/to/app/folder; 
    index index.html; 

    location ~ ^[a-zA-Z0-9/_-]+$ { 
     rewrite (.*) /index.html last; 
    } 
}

來源

2017-04-29 21:40:33 SmxCde

React Router`browserHistory`：我必須在服務器上渲染嗎？

回答

相關問題