首页 文章

OEmbed未应用于Ajax Callback中的视频链接

提问于
浏览
2

我对wp_editor(),tinyMCE和the_content过滤器在oEmbed视频方面遇到了困难 .

我正在输出前端wp_editor()表单,以允许注册用户从站点的前端创建新帖子 . 创建的新帖子是自定义帖子类型 .

目标行为是:

  • 注册用户输入内容并点击提交

  • 表单由jQuery / Ajax处理,表单数据通过post()传递给PHP函数

  • 创建了一个新帖子,并为Ajax回调生成响应

  • 响应是一个JSON数组,其中包含新帖子内容的HTML

  • 返回的HTML已应用'the_content'过滤器 - 嵌入的视频应正确显示

  • Ajax回调删除原始表单并将发布HTML附加到div

除了视频oEmbed之外,一切都按预期工作 .

If a video link is added to the content (on a new line within the wp_editor), the content built by the Ajax callback includes the video URL wrapped in paragraph tags - oEmbed hasn't worked, even though the HTML has had 'the_content' filter applied.

刷新页面会在循环中显示新帖子,内容由 the_content() 标记显示 - 并且视频显示正确(oEmbed已生效) .

在wp_editor参数中设置 'wpautop' => false 不会修复视频 .

我缺少一个微小的MCE设置吗?

我是如何应用'the_content'过滤器和/或为Ajax回调构建HTML字符串的问题?

相关代码如下所示 .

谢谢!

JQuery

(function( $ ) { 'use strict';

$(function() {
      $('#student-submission-button').click( function(event) {

          // Prevent default action
          // -----------------------
          event.preventDefault();

          var submission_nonce_id = $('#the_nonce_field').val();
          var submission_title = $('#inputTitle').val();
          tinyMCE.triggerSave();
          var submission_content = $('#editor').val();
          var Data = {
            action: 'student_submission',
            nonce: submission_nonce_id,
            workbook_ID: submission_workbook_ID,
            content: submission_content,
            title: submission_title,
          };

        // Do AJAX request
        $.post( ajax_url, Data, function(Response) {

            if( Response ) {

              var submissionStatus = Response.status;
              var submissionMessage = Response.report;
              var postHTML = Response.content;

              if ( 'success' == submissionStatus ) {

                $('#user-feedback').html( submissionMessage );
                $('#new-post').append( postHTML );

              }

              // Hide the form
              $('.carawebs-frontend-form').hide(800, function() {
                $(this).remove();
              });

            }

        });

    });

});
})( jQuery );

PHP

/**
* Return data via Ajax (excerpt)
* 
* 
*/
$response = array();

if( is_int( $new_submission_ID ) ) {
  // Build a success response
  // ------------------------
  $new_post = get_post( $new_submission_ID, OBJECT );
  $new_post_content = $new_post->post_content;

  $return_content = "<h2>$new_post->post_title</h2>";
  $return_content .= apply_filters( 'the_content', $new_post_content );

  $response['status'] = "success";
  $response['report'] = "New post created, ID: $new_submission_ID";
  $response['content'] = $return_content;

} else {

  // error report

}

wp_send_json( $response ); // send $response as a JSON object

表单HTML和wp_editor()

<form action="<?php echo $_SERVER['REQUEST_URI']; ?>" method="post" enctype="multipart/form-data" class="carawebs-frontend-form">
<label for="inputTitle">Title</label>
<input type="text" class="form-control" id="inputTitle" name="inputTitle" placeholder="Title" value="" />
<label for="inputContent" class="topspace">Your Content</label>
  <?php
  $args = array(
    'textarea_rows' => 45,
    'teeny'         => false,
    'editor_height' => 400,
    'editor_class' => 'cwfrontendadmin',
    'quicktags'     => false,
    'textarea_name' => 'cw_content',
    'tinymce' => array(
      'content_css' => get_template_directory_uri() . '/assets/css/editor-style.css'
    ),
  );
  wp_editor( 'Enter your content...', 'editor', $args );
  wp_nonce_field('name_of_action','the_nonce_field', true, true ); // name of action, name of nonce field
  ?>
<input id="student-submission-button" class="btn btn-primary" type="submit" name="submission-form" value="Save Content" />

更新

我已将其缩小到应用 the_content 过滤器的方式 . 我认为过滤的内容是缓存的,因此如果在循环外返回帖子内容,则oEmbed可能无法应用于所有内容 .

现在我有视频oEmbed工作 - 使用不同的方法将 post_content 插入变量:

<?php
global $post;
$post = get_post($new_submission_ID);
setup_postdata( $post );
$new_content = apply_filters('the_content', get_the_content());
$new_post_link = get_the_permalink();
$new_post_title = get_the_title();
wp_reset_postdata( $post );

这样可以正常工作,但如果有人可以解释为什么构建HTML的原始方法不起作用将会很好 .

2 回答

  • 0

    如果在循环外返回帖子内容,并且未设置 global $post ,则不会应用oEmbed过滤器 .

    这是因为视频嵌入内容缓存在postmeta表中,如果在循环外返回帖子内容,则无法访问 . 由 the_content 过滤器连接的WP_Embed类不是为在循环外使用而设计的 - 这在Trac here上引用 .

    以下方法根据原始方案返回工作视频oEmbed . 需要设置 global $post 以使缓存的视频嵌入数据可用:

    <?php
    global $post;
    $post = get_post( $new_submission_ID );
    setup_postdata( $post );
    $new_content = apply_filters( 'the_content', get_the_content() );
    wp_reset_postdata( $post );
    
    // return what you need via Ajax callback - 
    // $new_content contains the proper video embed HTML
    

    TL; DR版本

    如果需要在循环外部应用oEmbed过滤器,则需要设置全局post变量,以便 WP_Embed 类可以访问post的meta中的缓存视频embed html .

  • 3

    根据other sources的原因是因为 WP_Embed::shortcode() (负责交换嵌入式html的视频)正在调用 global $post 变量以获取信息 .

    这意味着您需要确保 global $post 变量包含您要求的帖子的信息 .

    我的AJAX响应方法现在包含 global $post 变量:

    global $post;
    
    $post = get_post( $id );
    
    echo apply_filters( 'the_content', $post->post_content );
    
    die();
    

    这基本上只是您自己的发现的扩展,但我认为对于WordEress的oEmbed AJAX问题有一个明确的答案/解决方案可能会有所帮助 .

相关问题