Javascript 如果成功，登录页面重定向新页面_Javascript_Scala_Playframework_Mithril.js

Javascript 如果成功，登录页面重定向新页面

javascript scala playframework

Javascript 如果成功，登录页面重定向新页面,javascript,scala,playframework,mithril.js,Javascript,Scala,Playframework,Mithril.js,我的应用程序使用Mithril.js和Play框架我想知道是否有一种（好的）方法将我的应用程序分为mithril和play。我想让play呈现一个login.html，这个login.html将只包含我的mithril.js组件（login.js）的导入。如果登录成功，我希望将我的应用程序重定向到另一个html页面。此页面将包含所有my mithril组件的所有导入因此，我的应用程序在play framework端只有两个html页面，一个只导入一个mithril组件，另一个导入所有其他组件

我的应用程序使用Mithril.js和Play框架

我想知道是否有一种（好的）方法将我的应用程序分为mithril和play。我想让play呈现一个login.html，这个login.html将只包含我的mithril.js组件（login.js）的导入。如果登录成功，我希望将我的应用程序重定向到另一个html页面。此页面将包含所有my mithril组件的所有导入

因此，我的应用程序在play framework端只有两个html页面，一个只导入一个mithril组件，另一个导入所有其他组件（仅在检查凭据的情况下）

播放路由器：

获取/controllers.Index.Index

播放控制器：

def索引=操作{ 确定（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>


IHM
样式表导入。。
m、 route.mode=“路径名”；
m、 路由（document.getElementById（'app'），“/”{
“/”：登录，
});

Mithril ask播放检查凭据（组件登录中）

m、请求（{method:“PUT”，url:“/check user”，data:login.user}）

案例凭据错误：再次询问（我已经完成了此部分）

案例凭据为true：重定向到另一个html页面（如何执行此操作？）


IHM
我所有的MITHRIL组件都导入
m、 route.mode=“路径名”；
m、 路由（document.getElementById（'appmain'），“/main”{
“/main”：main，
});

检查凭据后，如何重定向到另一个html页面？有没有更好的方法防止服务器在用户登录之前发送所有JavaScript文件

检查凭据后，如何重定向到另一个html页面

Mithril的路由不是重点，因为区分未经验证（登录表单）和已验证（单页应用程序）的实际路由逻辑由不同的服务器端处理，并加载不同的HTML资源1。因此，在登录成功时，您真正需要做的就是使用本机API（您需要

替换

而不是

分配

，以避免登录页面停留在已验证用户的历史记录中）：

有没有更好的方法防止服务器在用户登录之前发送所有JavaScript文件

这是一个范围非常广泛的主题，其复杂性取决于应用程序的结构要求以及后端和前端技术要求和功能。为了进一步参考，将前端Javascript依赖项分离为不同文件并在不同时间加载的通用技术称为“代码拆分”或“捆绑”

对于Mithril实际处理未经验证和验证页面路由的应用程序内的重新定向

得益于Javascript模块，代码拆分在理论上变得很容易，而捆绑在理论上通过HTTP2是程序化的——但由于目前还没有前者的本地实现，而后者还处于初级阶段，目前任何实用的通用解决方案都需要围绕满足特定需求的库编写代码。另请参见，试图使ES6模块导入在前端正常工作，但仍涉及大量工具和定制代码体系结构，以满足所有实际目的

<!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>

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" )
      )
    ]
  }
} )