ログインページリダイレクト新しいページが成功した場合

私のアプリケーションはMithril.jsとPlay Frameworkを使用しています。ログインページリダイレクト新しいページが成功した場合

ミスリルとプレイの間でアプリケーションを分割する（良い）方法があるかどうかを知りたいと思います。 play.hにlogin.htmlをレンダリングしたいのですが、このlogin.htmlにはmithril.jsコンポーネント（login.js）のインポートのみが含まれています。ログインが成功した場合は、私のアプリケーションを別のhtmlページにリダイレクトするようにしたいと思います。このページには、すべての私のミスリルの成分のすべての輸入が含まれます。

私のアプリケーションでは、再生フレームワーク側に2つのhtmlページしかありません。一方はミスリルコンポーネントを1つだけインポートし、もう1つは他のコンポーネントをすべてインポートします（資格情報がチェックされている場合のみ）。

プレイルータ：

GET/controllers.Index.index
再生コントローラ：

DEFインデックス=アクション{ OK（views.html.login（）） }

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <title>IHM</title> 
    StylesSheet import.. 
</head> 
<body id="app" class="body"> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/mithril/0.2.2-rc.1/mithril.min.js"></script> 
<script src="@routes.Assets.versioned("javascripts/claravista/login.js")" type="text/javascript"></script> 

    <script type="text/javascript"> 
     m.route.mode = "pathname"; 

     m.route(document.getElementById('app'), "/", { 

      "/": login, 

     }); 


    </script> 
</body>

ミスリルはm.request（{メソッドlogin.user： "PUT"、URL： "/チェック・ユーザ" を、データ}）（成分ログイン中）

を再生チェッククレデンシャルを尋ねる（その後。 returnCall）;
ケースの資格偽：再び尋ねる（私はすでにやったこの部分）

ケースの資格真：別のHTMLページにリダイレクト（これを行う方法を？）

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <title>IHM</title> 
</head> 
<body id="appmain" class="body"> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/mithril/0.2.2-rc.1/mithril.min.js"></script> 

    ALL MY MITHRIL COMPONENTS IMPORT 

    <script type="text/javascript"> 
     m.route.mode = "pathname"; 

     m.route(document.getElementById('appmain'), "/main", { 
      "/main": main, 
    }); 

</script>

資格情報の後に別のhtmlページにリダイレクトする方法チェック？ユーザーがログに記録する前に、サーバーがすべてのJavaScriptファイルを送信しないようにするより良い方法はありますか？

出典

2016-08-09 GermainGum

資格情報が確認されたら、別のhtmlページにリダイレクトするにはどうすればよいですか？非認証（ログインフォーム）および認証（シングルページアプリケーション）を区別する実際の経路ロジックは、異なるサーバ側及び負荷異なるHTMLリソースによって処理されるので

ミスリルのルーティングは、ここでのポイント以外です。だから、すべてあなたが本当にネイティブwindow.location.replace APIを使用してログイン成功に行うことです必要があります（あなたは、認証されたユーザーの履歴に滞在ログインページを避けるためにreplaceではなくassignしたいと思う）：

m.mount(document.getElementById("appmain"), { 
    controller: function(){ 
    this.error = m.prop() 

    this.username = m.prop() 
    this.password = m.prop() 

    this.login = function(){ 
     return m.request({ 
     method : "PUT", 
     url : "/check-user", 
     data : { 
      username : ctrl.username, 
      password : ctrl.password 
     } 
     }) 
     .then(function(response){ 
      // Based on my imagination of what the /check-user response might look like 
      if(response.success){ 
      // Navigate to the authenticated app page 
      window.location.replace("/main") 
      } 
      // Return the reason the user couldn"t be authenticated 
      else { 
      return response.errorMessage 
      } 
     }) 
     // Populate our model with results 
     .then(ctrl.error); 
    } 
    }, 

    view : function(ctrl){ 
    return [ 
     m("h1", "Login"), 

     m("form", { 
     onsubmit : ctrl.login 
     }, 
     // If there are login errors, display them here 
     ctrl.error() && m("p.error", ctrl.error()), 

     m("input[placeholder=username]", { 
      value : ctrl.username(), 
      oninput : m.withAttr("value", ctrl.username) 
     }), 

     m("input[placeholder=password][type=password]", { 
      value : ctrl.password(), 
      oninput : m.withAttr("value", ctrl.password) 
     }), 

     m("button", "Submit") 
    ) 
    ] 
    } 
})

ユーザーがログに記録される前に、サーバーがすべてのJavaScriptファイルを送信しないようにするより良い方法はありますか？

これは、アプリケーションの構造要件およびバックエンド/フロントエンドの技術的要件と機能に応じて、複雑なものがたくさんあります。さらに参考までに、フロントエンドのJavascriptの依存関係を異なる時間にロードされる異なるファイルに分割する一般的な手法は、「コード分割」または「バンドリング」と呼ばれています。ミスリルが本当に認証されていない&認証されたページのルーティング、see this answerを処理しているアプリケーション内で再指向するため

。
Javascriptモジュールのおかげで理論的にコード分割が容易になりました。理論的にはHTTP2を使って手続きを行っていますが、前者は本来の実装はなく、後者は初期段階にあります。現時点では、あなたの特定の要件を満たすライブラリの周りにコードを書く必要があります。 Read this for more details on ES6 modules + HTTP2。 SystemJSも参照してください。これは、ES6モジュールのインポートを総称してフロントエンドで行いますが、実用的な目的のために多くのツールとカスタマイズされたコードアーキテクチャを必要とします。

出典

2016-08-10 11:38:40 Barney

ログインページリダイレクト新しいページが成功した場合

答えて

関連する問題