Форум

optsar · #1 (**permalink**) 12.11.2015, 23:00

http://fengyuanchen.github.io/cropper/

Если кто работал с этим плагином, подскажите пожалуйста, почему он работает с картинками только которые на сервере, а по ссылке не хочет.

Так работает

<img id="image" src="../picture-2.jpg" alt="Picture">

а так нет

<img id="image" src="http://test/jcrop/crop/10487_3.jpg" alt="Picture">

рони · #2 (**permalink**) 12.11.2015, 23:13

optsar,
может потому что

Цитата:

•If you try to start cropper on a cross-origin image, please make sure that your browser supports HTML5 CORS settings attributes, and your image server supports the Access-Control-Allow-Origin option.

https://github.com/fengyuanchen/cropper#notes

optsar · #3 (**permalink**) 12.11.2015, 23:20

Сообщение от рони

optsar,
может потому что

https://github.com/fengyuanchen/cropper#notes

Английский я понимаю только через переводчик, т.е почти не понимаю

Если вы попробовать начать кроппер на кресте-происхождение изображения, пожалуйста, убедитесь, что ваш браузер поддерживает HTML5 Корс настройки атрибутов, и ваш образ Server поддерживает доступ-контроля-разрешить-вариант происхождения.

Из того что понял, это поддерживает ли мой браузер HTML5, да поддерживает.

Mess4me · #4 (**permalink**) 12.11.2015, 23:23

optsar,
я пытаюсь в браузере просто перейти на эту картинку http://test/jcrop/crop/10487_3.jpg - ничего не получается

Mess4me · #5 (**permalink**) 12.11.2015, 23:24

На любую другую в инете просто взял - ОК

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
    <link  href="https://cdn.rawgit.com/fengyuanchen/cropper/v2.0.0/dist/cropper.min.css" rel="stylesheet">
    <script src="https://cdn.rawgit.com/fengyuanchen/cropper/v2.0.0/dist/cropper.min.js"></script>

    <title></title>
</head>
<body>
<div>
    <img id="image" src="http://cdn3.vox-cdn.com/uploads/chorus_asset/file/917470/iphone-6-travel-photo-review-mann-header.0.jpg">
</div>
<script>
    $('#image').cropper({
        aspectRatio: 16 / 9,
        crop: function(e) {
            // Output the result data for cropping image.
            console.log(e.x);
            console.log(e.y);
            console.log(e.width);
            console.log(e.height);
            console.log(e.rotate);
            console.log(e.scaleX);
            console.log(e.scaleY);
        }
    });

</script>

</body>
</html>

optsar · #6 (**permalink**) 12.11.2015, 23:27

потому что картинка у меня на локальном сервере, по этому у вас и не открывается,

Mess4me · #7 (**permalink**) 12.11.2015, 23:31

optsar,
так правильно, если мне, как пользователю из вне ,нельзя перейти на неё, то как Вы хотите чтобы работала строка:

<img id="image" src="http://test/jcrop/crop/10487_3.jpg" alt="Picture">

optsar · #8 (**permalink**) 12.11.2015, 23:33

В общем само по себе все заработало, не знаю почему раньше не работало

Mess4me · #9 (**permalink**) 12.11.2015, 23:35

optsar,

optsar · #10 (**permalink**) 12.11.2015, 23:55

вот только ваша картинка и работает

<img id="image" src="http://cdn3.vox-cdn.com/uploads/chorus_asset/file/917470/iphone-6-travel-photo-review-mann-header.0.jpg">

а другие не работают

Форум

Справочник

Discord чат

Курсы javascript