-1

我在 extjs 4 中创建了一个登录视图，数据是从 mysql 中获取的。我的问题是成功登录后我无法重定向我的页面。

我的重定向代码是。

onLoginSuccess : function(response, opts) 
                        {
                            //Received response from the server
                            response = Ext.decode(response.responseText);

                            if(response.success)
                                {

                                         var redirect = 'index';        
                                        window.location = redirect; 

                                }
                            else
                                 {
                                    Ext.MessageBox.alert('Login failed', response.message);
                                 } 
                         }
4

2 回答 2

3

有两种方法可以解决这个问题：

作为单独的页面登录

这是推荐的方式，因为它更快、更安全。

  • 有一个 index.php 页面，用于检查用户是否已登录。
  • 如果用户已登录，您应该只需要您的实际系统索引文件，其中包括 ExtJs 标头。
  • 如果用户未登录，您应该需要一个显示实际登录屏幕的 login.php 文件。此页面可能会或可能不会加载 ExtJs 库（因为此页面上的内容很少，我假设您在这里不需要 ExtJs 文件）。

例如，这是我的 index.php：

<?php

require_once('common/include/User.php');

if ( SessionUser()->IsLoggedIn() )
{
    // chdir is simply to keep the correct paths when compiling the app.
    // It works for php, but for html/css links you should use the base tag
    // in your php/html file: <base href="app/"/>
    chdir('app');
    require_once('app/index.php');    
} else {
    require_once('login.php');
}

?>

然后app/index.php是加载您的应用程序脚本和 ExtJs 库的实际索引文件。

login.php只是一个相当简单的登录表单：

<?php
// Index file for logged out users (guests)

$iUserName = isset( $_POST['username'] ) ? $_POST['username'] : '';

$iLoginErrorTxt = '';

if ( isset( $_POST['username'] ) )
{
    require_once('common/include/User.php');

    $iLoginError = SessionUser()->Authenticate( $_POST['username'], $_POST['password'] );

    if ( $iLoginError['success'] )
    {
        // Login successful - reload the page.
        header( "Location: " . $_SERVER['PHP_SELF'] );
        exit();
    } else {
        // Login failed - present an error.
        $iLoginErrorTxt = $iLoginError['error'];
    }
}
?>


<html>
<head>
    <title>My System</title>            
</head>

<body>

<form class="login-form" action="<?=$_SERVER['PHP_SELF']?>" enctype="application/x-www-form-urlencoded" method="post">

    <input name="username" size="25" type="text" value="<?=$iUserName?>" value spellcheck="false" placeholder="User Name"/>

    <input name="password" size="25" type="password" value spellcheck="false" placeholder="Password"/>

    <div class="error-message"><?=$iLoginErrorTxt?></div>

    <input name="submit" type="submit" value="Login" />

</form>

</body>
</html>

从 ExtJs 应用程序内登录

不强烈推荐这种方法，因为您需要在用户进行身份验证之前加载整个 ExtJs 框架和很可能是您的应用程序脚本。

一个可能的实现将涉及拥有一个容器面板，它一次只显示一个面板，可以是登录页面，也可以是实际的应用程序页面。

app.js 可能包含以下代码：

refs:
[{
    ref: 'contentPanel',
    selector: 'viewport > #contentPanel'
}],


controllers: [
    'MainMenu'
],

launch: function() {
    // Enable quicktips
    Ext.QuickTips.init();

    // Create the viewport 
    Ext.create('Ext.container.Viewport', {
        layout: 'fit',
        items: [
            {
                xtype: 'panel',
                id: 'contentPanel',
                layout: 'card',

                dockedItems: [{
                    xtype: 'mainmenu',
                    dock: 'top' 
                }]
            }
        ]
    });   
},

然后你可以这样做：

var iContentPanel = this.getContentPanel();
iContentPanel.getLayout().setActiveItem( iPage );

iPage您希望显示的任何页面（面板）在哪里。

显然有一些方法可以改进它的工作方式，例如，通过动态加载控制器；但我相信这是一个不同问题的故事。

无论如何，我强烈建议您考虑第一种方法。

于 2013-02-11T12:46:30.893 回答
-1

您可以通过简单地使用登录窗口覆盖整个应用程序来处理登录，如下所示：http: //blogapp.banchaproject.org/app.html

代码可以在这里找到，尤其是你会感兴趣的这个控制器： https ://github.com/Bancha/BanchaBlogApp/blob/master/webroot/app/controller/Authentification.js

于 2013-02-12T13:08:01.323 回答