Question

是否有人知道是否已有一个允许类似终端仿真的库，以便管理员可以在wp-admin网站上以两步方式输入他的凭据？

首先，他应该能够输入他的用户名，点击输入然后输入他的密码。根据输入的有效性，消息应该是可见的，并且应该发生重定向。

在这方面，我知道certain jQuery libraries模仿特定的终端风格，但我并不知道有一些工作代码可以满足我上面提到的需求。也许我也没有经验，没有注意到插件具有所需的能力，或者可能有一种非常不同的方式来实现我的愿望，有人可以帮助我。

我以任何方式感谢你指引我走向正确的方向。

其他信息

我的目标是仅来构建登录页面 - 而不是登录过程后的整个wordpress管理。这将是怪诞的。可以在this demo中找到此登录屏幕如何运行和行为的一个非常好的示例。

Answer 1

实际上如果您只需要像登录这样的终端（因此不需要管理），就可以轻松完成

您需要使用绿色文本制作一些黑页 - 您可以使用login_init操作重写标准的wp-login表单，或者您可以使用制作一个新页面，例如'login'然后在你的模板文件夹中创建page-login.php

你会在那里放一个标准的登录表格，比如

<form name="loginform" id="loginform" action="" method="post">
<p id="user">
    <label for="user_login">Username<br />
    <textarea type="text" name="log" id="user_login" class="input" value="" cols="80" tabindex="10" ></textarea></label>
</p>
<p id="password">
    <label for="user_pass">Password<br />
    <textarea type="password" name="pwd" id="user_pass" class="input" value="" cols="80" tabindex="20" ></textarea></label>
</p>
<p id="submit">
    <button name="wp-submit" id="wp-submit" class="button-primary" tabindex="100" >Login</button>
</p>

我只使用textareas而不是输入，因为在终端中你可以放置更多行的文本和按钮而没有type = submit，因此点击后不会触发表单

您将使用CSS或javascript隐藏除#user之外的所有字段（javascript hidding更适合于辅助功能）。
您可以将标签设置为绿色文本，将文本区域设置为黑色背景，无边框，绿色文本。
如果您想在测试密码之前测试（如果用户存在），就像在某些终端上一样（我不建议，它降级安全性），您可以进行测试，如果没有密码在当用户点击进入时，$ _POST并仅用http://codex.wordpress.org/Function_Reference/username_exists函数检查用户名（更好的是使用例如ajax的异步方式）。
当前一次检查没问题（用户存在）时，您将使第一个textarea为只读并仅显示#password。
，您将检查http://codex.wordpress.org/Function_Reference/user_pass_ok，如果确定，您将其重定向到/ wp-admin（您只需使用post将信用发送到wp_login.php）。如果没有，您将再次显示表单（例如，使用预先填写的用户并将一些$ counter设置为++，当$ counter＆gt; = 3时，您将把他发送到主页。

Answer 2

您可以编写使用XML-RPC的php脚本来测试登录密码是否正确。所有wordpress方法都有用户名和密码，所以你可以选择任何方法，如wp.getOptions（这是安全的，因为它不会改变任何东西，但你需要进行身份验证），当你输入错误的密码时会返回错误403，如果是用户/传是对的这是php代码：

<?php

function post($url, $data) {
    $ch = curl_init($url);
    curl_setopt($ch, CURLOPT_POST, 1);
    curl_setopt($ch, CURLOPT_POSTFIELDS, $data);
    curl_setopt($ch, CURLOPT_FOLLOWLOCATION, 1);
    curl_setopt($ch, CURLOPT_HEADER, 0);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
    return curl_exec($ch);
}

function authenticate($user, $password) {
    $request = '<?xml version="1.0"?>
    <methodCall>
      <methodName>wp.getOptions</methodName>
      <params>
        <param>
          <value><int>0</int></value>
        </param>
        <param>
          <value><string>' . $user . '</string></value>
        </param>
        <param>
          <value><string>' . $password . '</string></value>
        </param>
      </params>
    </methodCall>';
    $url = 'http://www.domektkaczki.pl/xmlrpc.php';
    $regex = '/<name>faultCode<\/name>.*<value><int>403<\/int><\/value>/s';
    return !preg_match($regex, post($url, $request));
}
header('Content-Type: text/plain');
if (isset($_GET['user']) && isset($_GET['passwd'])) {
    echo authenticate($_GET['user'], $_GET['passwd']) ? 'true' : 'false';
} else {
    echo 'false';
}

然后在javascript中你只需在终端

中调用该脚本

$('body').terminal($.noop, {
    login: function(user, passwd, callback) {
        $.getJSON('auth.php', {user:user, passwd:passwd}, function(response) {
            if (response) {
                // the page redirected_page.php need to be password protected
                // because users will be able to see the code and open that page directly
                // you can use sessions to save value if user put right credentials
                // in auth.php and in redirected_page.php you can check
                // if that value is set
                window.location = 'redirected_page.php';
            } else {
                callback(null);
            }
        });
    }
});

如果您想要实现更多wordpress命令，可以使用xmlrpc library，这里是代码how to create a client。如果你想在javascript中使用命令，你的登录应该返回一个可以在javascript中使用的标记。

编辑：如果您想登录管理界面并登录（从终端），那么您可以检查wp-login，打开开发人员工具，检查网络选项卡中的保留日志，以及查看向服务器发送的请求。然后你可以在登录函数中使用AJAX而不是我编写的php脚本执行相同的请求。您需要检查在输入错误密码时要发送的响应，并希望在正确的时候使用相同的位置和回调（null），就像在JS代码中一样。

类似终端的WordPress登录

其他信息

2 个答案: