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

Posted 2023-02-19

【中文标题】如何使用 JavaScript 将 PHP 代码转换为 HTML？

【英文标题】：How can I put PHP code to HTML using JavaScript?

【发布时间】：2021-10-03 05:31:54

【问题描述】：

我在 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=faled 我有这个：

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

【问题讨论】：

您需要在 PHP 代码将被解释和执行的位置运行，例如.php 文件。从您描述的行为来看，您似乎已将其放入 .js 文件中。

是的，我把它放在 .php 文件中，但使用的是 .js。我想使用 php 显示消息以便翻译它

$text = <?php echo "'(hello, world)'";

$text - jquery 变量，所以不幸的是它不起作用......

这能回答你的问题吗？ Localization with JQuery?

【参考方案1】：

您需要了解，jquery 是客户端代码并由浏览器解释。 PHP 是服务器端并由服务器解释。您需要的是一个服务器调用来获取 php 代码的渲染结果。您可以进行 $.ajax-call（或本机 fetch-API）来获取结果。

但是：请勿编写脚本，它运行任何 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']); ?>

每个用户都可以这样调用您的脚本（在您的表单之外，只需在浏览器地址栏中调用它）：

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

所以：请在生成代码之前了解客户端代码和服务器端代码之间的区别，这可能会损坏您的系统。