如何使用JavaScript将PHP代码转换为HTML ?

Question

我在wordpress/woocommerce的表单上做ajax请求。我试图显示错误信息时，用户还没有找到。我试着用函数username_exist()来做，但是行不通。我发现这样做的唯一方法是在ajax-request中使用error:，然后通过我想要的任何消息。但问题是我不能翻译这条信息。我试图把消息<?php wc_print_notices() ?>，但它显示为评论。请帮我解决这个问题。我有这样的代码:

html表单:

<form class="login" id="login" method="post">
<p class="status_login">
</p>
<div class="form-field">
<label for="user_login" class="label"><?php esc_html_e('Username or email address', 'woocommerce'); ?>&nbsp;<span
class="required">*</span></label>
<input type="text" class=" h-full-width c-h" name="user_login" id="user_login" autocomplete="user_login"
value="<?php echo (!empty($_POST['username'])) ? esc_attr(wp_unslash($_POST['username'])) : ''; ?>" />
</div>
<div class="form-field"><label for="user_pass"><?php esc_html_e('Password', 'woocommerce'); ?>&nbsp;<span
class="required">*</span></label>
<input class=" h-full-width c-h" type="password" name="user_pass" id="user_pass" autocomplete="current-password" />
</div>
<div class="group">
<label class="woocommerce-form__label woocommerce-form__label-for-checkbox woocommerce-form-login__rememberme">
<input class="woocommerce-form__input woocommerce-form__input-checkbox" name="rememberme" type="checkbox"
id="rememberme" value="forever" /> <span><?php esc_html_e('Remember me', 'woocommerce'); ?></span>
</label>
</div>
<div class="group">
<?php wp_nonce_field('ajax-login-nonce', 'security'); ?>
<button type="submit" class="btn btn--primary h-full-width" name="login"
value="<?php esc_attr_e('Log in', 'woocommerce'); ?>"><?php esc_html_e('Log in', 'woocommerce'); ?></button>
</div>
<div class="hr"></div>
<div class="foot">
<a
href="<?php echo esc_url(wp_lostpassword_url()); ?>"><?php esc_html_e('Lost your password?', 'woocommerce'); ?></a>
</div>
</form>

Javascript

$j.ajax({
type: 'POST',
dataType: 'json',
url: ajax_login_object.ajaxurl,
data: {
'action': 'ajaxlogin', //calls wp_ajax_nopriv_ajaxlogin
'username': $j('#user_login').val(),
'password': $j('#user_pass').val(),
'security': $j('#login #security').val()
},
success: function (data) {
console.log(data)
$j('.status_login').html(data.message);
if (data.error == false) {
$j('.status_login').html(data.message);
document.location.href = ajax_login_object.redirecturl;
}
},
error: function (msg) {
$text = '<?php (Hello, world) ?>'
$j('.status_login').html('<?php wc_print_notices() ?>);
},
});
e.preventDefault();
});

php代码:

function ajax_login_init()
{

wp_enqueue_script('ajax-login-script', get_template_directory_uri() . '/assets/js/ajax_form.js', array('jquery'), null, true);
wp_localize_script('ajax-login-script', 'ajax_login_object', array(
'ajaxurl' => admin_url('admin-ajax.php'),
'redirecturl' => "//" . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'],
'loadingmessage' => '<div class="alert alert-success">' . __('checking', 'malik') . '
</div>'
));
add_action('wp_ajax_nopriv_ajaxlogin', 'ajax_login');
}
if (!is_user_logged_in()) {
add_action('init', 'ajax_login_init');
}
require_once ABSPATH . WPINC . '/user.php';
function ajax_login()
{
if (!check_ajax_referer('ajax-login-nonce', 'security')) {
echo json_encode(array('error' => true, 'message' => '<div class="alert alert-danger">' . __('Session token has
expired, please reload the page and try again', 'malik') . '</div>'));
die();
}
// Nonce is checked, get the POST data and sign user on
$info = array();
$info['user_login'] = !empty($_POST['username']) ? sanitize_user(trim($_POST['username'])) : NULL;
$info['user_password'] = !empty($_POST['password']) ? sanitize_text_field(trim($_POST['password'])) : NULL;
$info['remember'] = true;
$user_signon = wp_signon($info, false);
$user_login = sanitize_user($_POST['username']);
$user_pass = sanitize_text_field(trim($_POST['password']));
$user_exists = false;
if (username_exists($user_login)) {
$user_exists = true;
$user = get_user_by('login', $user_login);
} elseif (email_exists($user_login)) {
$user_exists = true;
$user = get_user_by('email', $user_login);
} elseif (!empty($user_login) && !empty($user_pass)) {
$error = new WP_Error('no_user_found', 'Username or Email was not found, please try again', 'Page Data');
} else {
echo json_encode(array('error' => true, 'message' => '<div class="alert alert-danger">' .
$user_signon->get_error_message() . '</div>'));
die();
}

if ($user_exists === true) {
$user_id = $user->ID;
$user_data = get_userdata($user_id);
$username = $user_data->user_login;
$userpass = $user_data->user_pass;
} elseif (is_wp_error($user_signon) || $user_exists === false) {
echo json_encode(array('error' => true, 'message' => '<div class="alert alert-danger">' .
$user_signon->get_error_message() . '</div>'));
die();
} else {
wp_clear_auth_cookie();
wp_set_current_user($user_id, $username);
wp_set_auth_cookie($user_id);
echo json_encode(array('error' => false, 'message' => '<div class="alert alert-success">' . __('Login successful,
reloading page...', 'malik') . '</div>'));
die();
}
die();
}

我和当login=失败时，我有这个:

<p class="status_login">
<!--?php  wc_print_notices() ?-->
</p>

Answer 1

您需要了解，jquery是客户端代码，并由浏览器解释。PHP是服务器端，由服务器解释。您需要的是一个服务器调用，以获得php代码的呈现结果。你可以赚一美元。ajax-call(或本机fetch-API)获取结果。

BUT:不要写脚本，它运行由请求参数接收的任何php代码。一个邪恶的人可能会使用你的脚本来破坏你的后端。

一个例子:

<form action="run.php">
<input type="hidden" name="code" value="echo '(hello, world)'" />
<input type="submit" value="execute"></form>

run.php可能会做这个非常糟糕的事情:

<?php eval($_REQUEST['code']); ?>

每个用户都可以像这样调用脚本(在表单之外，只需在browser-addressbar中调用):

https://domain.tld/run.php?code=unlink('/')

所以:在生成可能会破坏系统的代码之前，请理解客户端代码和服务器端代码之间的区别。