时间戳

首页 > 解决方案 > Yii2 Dropzone 已附加且未提供 URL 错误

php - Yii2 Dropzone 已附加且未提供 URL 错误

问题描述

我正在尝试为我的 yii2 项目使用 dropzone 扩展。

我使用了 https://github.com/perminder-klair/yii2-dropzone

我的控制器：

<?php echo \kato\DropZone::widget([
    'options' => [
        'url' => '/dobuyme/frontend/web/index.php?r=boats/create&city_id=2&cat=rowpaddleboats&subcat=paddleboat',
        'maxFilesize' => '2',

    ],
    'clientEvents' => [
        'complete' => "function(file){console.log(file)}",
        'removedfile' => "function(file){alert(file.name + ' is removed')}",
    ],
]);

我收到错误：

dropzone.min.js:1 Uncaught Error: No URL provided.
    at new c (dropzone.min.js:1)
    at Function.a.discover (dropzone.min.js:1)
    at a._autoDiscoverFunction (dropzone.min.js:2)
    at HTMLDocument.f (dropzone.min.js:2)


Uncaught Error: Dropzone already attached.
    at new c (dropzone.min.js:1)
    at HTMLDocument.<anonymous> (index.php?r=boats/create&city_id=2&cat=rowpaddleboats&subcat=paddleboat:962)
    at mightThrow (jquery.js:3557)
    at process (jquery.js:3625)

标签： phpyii2

解决方案

过错

您正在使用的扩展中存在实现错误，dropzone 初始化不应该在jquery函数内部，或者onready当您在没有 jquery 的情况下初始化 drop zone 时，意味着如果您正在使用

new Dropzone();

然后，您最好在</body>标签之前的页面末尾添加脚本，而不要将其包装在其中任何一个中

  • $(document).ready(function(){})

或者

  • jQuery(function ($) {});

如果您查看正在使用 dropzone 的页面的视图源，您正在使用的扩展程序不是这种情况，它会向您显示类似这样的内容

jQuery(function ($) {
    Dropzone.autoDiscover = false;
    var myDropzone = new Dropzone("div#myDropzone", {
        "maxFilesize": "2",
        "url": '/dobuyme/frontend/web/index.php?r=boats/create&city_id=2&cat=rowpaddleboats&subcat=paddleboat',
        "previewsContainer": "#previews",
        "clickable": true,
        "headers": {
            "X-CSRF-Token": "mNq_nlbRIYljqGTXp-bB3nzJelGfikZUzhpLwUapdxbSjMntFZxi5yDgEJjet4WSP60YCc_Gfh6nfAGrdsAbLg=="
        },
        "params": {
            "_csrf": "mNq_nlbRIYljqGTXp-bB3nzJelGfikZUzhpLwUapdxbSjMntFZxi5yDgEJjet4WSP60YCc_Gfh6nfAGrdsAbLg=="
        }
    });
    myDropzone.on('complete', function (file) {
        console.log(file)
    });
    myDropzone.on('removedfile', function (file) {
        alert(file.name + ' is removed')
    });
});

并且和我上面提到的有同样的问题。

错误来源

源类中的以下行中需要更正DropZone.php

$view->registerJs($js);

默认情况下，Yii2 将脚本包装在函数中，除非您在函数的第二个参数中指定，registerJs()在上述情况下应该是 \yii\web\View::POS_END，这使得该行。

$view->registerJs($js, $view::POS_END);

解决方案

您目前可以做的是扩展类并覆盖registerAssets()函数，并更改行，这样您将要做的就是。

  1. DropZone.php在文件夹中创建一个文件，如果项目根目录下的文件common/components夹中没有任何具有该名称/components的文件夹，则创建一个，并在文件中添加以下代码。common/

    namespace common\components;

use yii\helpers\Json;
use kato\assets\DropZoneAsset;
use kato\DropZone as KatoDropZone;

class DropZone extends KatoDropZone
{
    public function registerAssets()
    {
        $view = $this->getView();
        $autoDiscover = $this->autoDiscover;
        $id = $this->id;
        $dropzoneContainer = $this->dropzoneContainer;
        $options = Json::encode($this->options);

        $js = <<<JS
        Dropzone.autoDiscover = $autoDiscover;
        var $id= new Dropzone("div#$dropzoneContainer",$options);
JS;

        if (!empty($this->clientEvents)) {
            foreach ($this->clientEvents as $event => $handler) {
                $js .= "$this->id.on('$event', $handler);";
            }
        }

        $view->registerJs($js, $view::POS_END);
        DropZoneAsset::register($view);
    }
}

  2. 现在在视图中使用您的自定义类并将名称空间从\kato\DropZone::widget()to更改为\common\Dropzone::widget()，仅此而已。它应该工作顺利，您的视图代码应该如下所示。

    echo \common\DropZone::widget([
    'options' => [
        'url' => '/dobuyme/frontend/web/index.php?r=boats/create&city_id=2&cat=rowpaddleboats&subcat=paddleboat',
        'maxFilesize' => '2',

    ],
    'clientEvents' => [
        'complete' => "function(file){console.log(file)}",
        'removedfile' => "function(file){alert(file.name + ' is removed')}",
    ],
]);

推荐阅读