リアクタールーターとnodejsのAPIの比較

Question

私は反応が新しく、reactjs + expressjs + nodejsに基づいてサンプルアプリケーションを開発しようとしていますが、https://github.com/lmammino/judo-heroesが参照していますが、サードパーティ用のWebhook APIを作成しようとしていますアプリケーション、反応ルータは404ページとして私を示した。

server.js

import routes from './routes'; 
... 
... 
var webhook = require('./routes/webhook'); 
app.use('webhook', webhook); 

とroutes.js

'use strict'; 

import React from 'react' 
import { Route, IndexRoute } from 'react-router' 
import Layout from './components/Layout'; 
import IndexPage from './components/IndexPage'; 
import NotFoundPage from './components/NotFoundPage'; 

const routes = (
    <Route path="/" component={Layout}> 
    <IndexRoute component={IndexPage}/> 
    <Route path="*" component={NotFoundPage}/> 
    </Route> 
); 

export default routes; 

と私が呼ばれたとき：あったとして、それが<Route path="*" component={NotFoundPage}/>を実行するために行って、 "ローカルホスト3333/のウェブフック" 404エラーページ。

反応ルータに関連しない個々のAPIとしてウェブフックをエクスポートするにはどうすればよいですか？

Answer 1

あなたはスラッシュであなたのwebhookルータを設置する必要があります

app.use('/webhook', webhook); 

これが務め、ブートストラップされてからアプリを反応させるのを防止するためにapp.get('*', ...ワイルドカードハンドラの前に実行する必要があります。

Answer 2

これは、サーバー側と同じ方法でクライアント側のルートをレンダリングしようとしているために発生します。これは、React + Expressのルーティング間で競合を引き起こしています。私はあなたがおそらくbrowserHistoryを使用していることをお勧めしたいと思います。これは、hashHistoryにスワップすることです。これは、クライアント側が表現ルートと比較してレンダリングが異なっていることを意味します。反応の経路をハッシュするためにスワップすることで、/#/indexによってレンダリングされます。これにより、Expressは/api/webhookのような従来の形式のAPIルートをレンダリングできます。あなたは、これはまったく機能していないディラン