私のコメントで述べたように、あなたのニーズに合った解決策があるかもしれません。
このソリューションには、MVC
Controller
と関連するMapRoute()
が必要です。
一般的な考え方は、browserHistory
を作成するときにcontroller
とcshtml
を使用してMVC
経由index.html
ページを提供し、react-router
basename
に設定することです。
キーの場合、basename
の値には、ドメインなしでパス全体(controller
まで)を含める必要があります。例えば
:
public class ReactController : Controller
{
public ActionResult Index()
{
return View();
}
}
とcshtml
:
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=0" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8" />
<title>app name</title>
<link href="path/to/file.css/if/needed" rel="stylesheet" />
</head>
<body>
<div id="app"></div>
<script src="path/to/bundle.js"></script>
</body>
</html>
とrouteMap
:このcontroller
与え
routes.MapRoute(
name: "reactApp",
url: "react/{*pathInfo}",
defaults: new { controller = "React", action = "Index", id = UrlParameter.Optional }
);
今、あなたのアプリケーションは、その後http://example.org/appName/
の下で公開されていると言うことができます君は'反応ルータはURLを変更する際に反応ルータが"appName"
部分を削除しないようにする必要があります。そうhttp://example.org/about
ようhttp://example.org/appName/react/about
及びません: - あなたがホームページになら
例えば、http://example.org/appName/home
、あなたがページについてに移動し、あなたはreact-router
がそうのよう"appName"
を維持したいです。
このURLはサーバーにポストしないのでうまくいきますが、「情報」ページに直接移動しようとすると問題が発生します。サーバーは、次のURLの代わりにhttp://example.org/about/
の要求を送信すると404を返します。http://example.org/appName/react/about
。
この問題への私の感想は、appName
+サブフォルダ(存在する場合)+コントローラ名を含む basename
を渡すことです。
私はappName
変数は以下の通りであるuseRouterHistory
を使用してreact-router
const browserHistory = useRouterHistory(createHistory)({
basename: appName
});
からbrowserHistory
代わりのimport
それを作成しています:
const controller = "/react";
const pathName = window.location.pathname;
const appName = pathName.substring(0,pathName.indexOf(controller) + controller.length);
これは関数としてリファクタリングが、基本的にすることができますコントローラー名を含むコントローラー名(MVCアプリケーションの規則として)までpathname
を取得します。
react-router
は、すべてのURLの変更時にこのパスを保持します。 私たちの場合"appName/react"
。
あなたはreact.netを試すことができます – thsorens
@ClémentPéauあなたは解決策を見つけましたか? –
@ Sag1v悲しいことではない。 –