如何在與koa的反應路由器中使用瀏覽器歷史記錄

在快遞中，我們可以使用以下代碼來處理請求。當請求沒有被路由器處理時，服務器端會發送index.html。如何在與koa的反應路由器中使用瀏覽器歷史記錄

app.get('*', function (request, response){ 
    response.sendFile(path.resolve(__dirname, '../public', 'index.html')) 
})

但是在koa中，以下代碼不起作用。當請求不被koa-router處理時，它將返回404而不是index.html。

var send = require('koa-send') 
var serve = require('koa-static') 
var router = require('koa-router') 
var koa = require('koa') 
var app = koa(); 

app.use(serve(__dirname+'/../public')); 
app.use(function *(){ 
    yield send(this, path.join(__dirname, '/../public/','index.html')); }) 
app.use(router.routes())

下面的代碼也不起作用

router 
    .get('*', function*() { 
    yield send(this, __dirname +'/../public/index.html') 
    })

來源

2016-08-09 fiona

你可以定義* 「不工作」 *？它會拋出錯誤嗎？它什麼都不做？它會返回Rick Astley的照片嗎？ – ivarni

@ivarni對不起，沒有明確的信息。我剛剛更新了這個問題。 – fiona

你想達到什麼本質上是服務器渲染。你需要寫匹配的路由配置& RouterContext。 react-router有詳細的文檔。

Server Rendering in react-router

在KOA的情況下，大致可以這樣做。

import router from 'koa-router' 
import { match, RouterContext } from 'react-router' 

const koaRouter = router() 

const otherRouter =() => { 
    return new Promise((resolve, reject) => { 
    match({ routes, location }, (error, redirectLocation, renderProps) => { 
    ... 
    .. 
    . 
} 
} 

koaRouter 
    .use(otherRouter)

我在網上找到了幾個Repos，看起來相當不錯。儘管我沒有證實他們。

breko-hub

koa-react-isomoprhic

來源

2016-08-09 16:38:20 Deadfish

這聽起來更像是他們試圖實現的是使用HTML5歷史API，而這絕不要求您在服務器端渲染。但爲了與頁面刷新一起工作，每個URL都需要返回相同的'index.html'文件。正在運行的「快速」示例清楚地表明瞭這一點。 – ivarni

router.get('*', async function(ctx, next) { 
    var html = fs.readFileSync(path.resolve('./build/index.html')); 
    ctx.type = 'html'; 
    ctx.body = html; 
})

這對我的作品

來源

2017-09-06 03:08:29 fiona

如何在與koa的反應路由器中使用瀏覽器歷史記錄

回答

相關問題