2

バックエンドのカスタムメタフィールドに添付される画像を誰でも（登録ユーザーなしで）アップロードできるファイル入力のあるフロントエンドフォームがあります。画像をプレビューするには、古いiframe手法を使用しています。私のフォームは次のようになります。

<form id="upload-photo" method="post" target="preview-iframe" action="<?= get_template_directory_uri() ?>/inc/upload.php" enctype="multipart/form-data" >
  <div id="preview"><img src="" alt="" /></div>
  <iframe id="preview-iframe" name="preview-iframe" src=""></iframe>
  <input type="file" name="author_photo" />
  <input type="hidden" id="attachment" name="attachment" value=""/>
  <button type="submit" id="upload">Upload</button>
</form>

次に、WordPress の組み込み関数を使用してアップロードを処理し、ファイルをメディア ギャラリーに移動します。非表示フィールドを使用して添付ファイルの WordPress を保存するidので、ユーザーが新しい画像をアップロードして画像を変更すると、古い画像は削除されます。これは私のPHPです：

<?php
define('WP_USE_THEMES', false);
require_once '../../../../wp-load.php';
require_once(ABSPATH .'wp-admin/includes/image.php');
require_once(ABSPATH .'wp-admin/includes/file.php');
require_once(ABSPATH .'wp-admin/includes/media.php');

if (isset($_POST['attachment'])) {
  wp_delete_attachment($_POST['attachment'], true);
}

foreach ($_FILES as $file => $data) {
  if ($data['error'] === UPLOAD_ERR_OK) {
    $attachment = media_handle_upload($file, null);
  }
}

echo wp_get_attachment_image($attachment, 'author', 0, array('id' => $attachment));
?>

そして最後に、すべてを結合する jQuery を使用します。

var $preview = $('#preview'),
    $iframe = $('#preview-iframe'),
    $attachment = $('#attachment');

$('#upload').click(function() {
  $iframe.load(function() {
    var img = $iframe.contents().find('img')[0];
    $preview.find('img').attr('src', img.src);
    $attachment.val(img.id);
  });
});

すべてが完璧に機能しますが、この単純なアプローチにはいくつかの問題があります。

  • JavaScript が無効になっている場合、画像は削除されません

  • ユーザーがファイルをアップロードしてからサイトを更新してから他の画像をアップロードすると、更新により以前の添付ファイル ID が存在しないため、以前の添付ファイルは削除されません。

  • 悪意のあるユーザーがattachment、別の ID で隠しフィールドを編集する可能性があります。

/tempプレビュー目的でのみファイルをフォルダーにアップロードし、 X回ごとにcronジョブを実行して空にすることについて考えました。/tempしかし、フォーム全体が送信されたら、WordPress 関数を使用して画像をギャラリーに移動し、添付ファイル ID を取得して投稿にリンクするにはどうすればよいですか?

画像を処理するためのフォームと、投稿されるすべてのコンテンツを含むグローバル フォームの 2 つのフォームがあることに注意してください。しかし、画像に対してこれを安全に行うにはどうすればよいでしょうか? フォームが正常に投稿された場​​合にのみ、画像をプレビューしてギャラリーに配置する方法は?

FileReader API については知っていますが、IE8+ との互換性が必要なので、それはできません。また、すべての Flash および Silverlight ソリューションも認識していますが、それもオプションではありません。また、WordPress プラグインにリンクしないでください。ここで学習しようとしています。

4

1 に答える 1

0

わかりました、私は再び自分の質問に答えているようです。これが私がそれを解決した方法です。前の関数のような配列media_handle_sideloadからのファイルだけでなく、他の場所からファイルをアップロードできるWordPress 関数を見つけました。$_FILES

そのため、その機能について知ったので、最初のアプローチを採用しました。/temp基本的に、プレビュー用にファイルをフォルダーにアップロードし、非表示フィールドに保存する一意の ID を与えます。ユーザーがフォーム全体を送信して検証に合格すると、保存された ID を取得してファイルが存在するかどうかを確認し、存在する場合はそれをギャラリーに移動します。これにより、セキュリティに関する私の懸念のほとんどが解決されます。悪意のあるユーザーが既存の一意の ID を見つけたとしても (可能性は低いですが可能性はあります)、ファイルは以前のように削除されず、ギャラリーに移動されるだけです (大したことではありません)。

最後に、X 時間ごとに一時フォルダーを空にする cron ジョブをセットアップしました。

于 2013-04-07T21:57:20.300 に答える