За и против различных технологий слоя веб-презентации Java
Вам нужно подождать, пока ваше изображение загрузится, прежде чем вы сможете нарисовать его на холсте.
Для этого просто используйте обработчик события load вашего элемента
// create a new image
var img = new Image();
// declare a function to call once the image has loaded
img.onload = function(){
var canvas = document.createElement('canvas');
canvas.width = img.width;
canvas.height = img.height;
var context = canvas.getContext('2d');
context.drawImage(img, 0,0);
var dataURL = canvas.toDataURL();
// now you can do something with the dataURL
doSomething(dataURL);
}
// now set the image's src
img.src = "http://somerandomWebsite/picture.png";
Кроме того, для холста 'context.toDataURL() и context.getImageData для работайте правильно, вы должны получить свой ресурс изображения в соответствии с кросс-оригинальным способом , в противном случае холст «испорчен», что означает, что любой метод получения данных с пикселями будет заблокирован.
- Если ваше изображение поступает с одного и того же сервера, нет проблем.
- Если ваше изображение подано с внешнего сервера, убедитесь, что оно позволяет вашим в своих кросс-начальных заголовках и установить
img.crossOriginна"use-credentials". - Если сервер разрешает анонимные запросы, вы можете установить
img.crossOriginна"anonymous".
Nota Bene : Сервер CORS отправляется сервером, а атрибут cross-origin сообщает, что вы хотите использовать CORS для получения данных изображения, и вы не сможете обойти его, если сервер установлен неправильно. Кроме того, некоторые UserAgents (IE & amp; Safari) до сих пор не реализовали этот атрибут.
Edge Case : Если некоторые из ваших изображений находятся на вашем сервере, а некоторые из них соответствуют требованиям CORS один, тогда вы можете захотеть использовать обработчик события onerror, который должен срабатывать, если вы установите атрибут cross-origin на "anonymous" на сервере без CORS.
function corsError(){
this.crossOrigin='';
this.src='';
this.removeEventListener('error', corsError, false);
}
img.addEventListener('error', corsError, false);
8 ответов
Мои мнения вполне в большой степени склоняются к Калитке, потому что я использовал ее некоторое время после спотыкания за шахты JSP слишком много раз.
ПРОФЕССИОНАЛЫ Калитки:
- Истинное разделение расположения и кода.
- Компонентно-ориентированный, что означает высокую возможность многократного использования элементов сайта; Например, можно создать украшенную форму с автоматической маркировкой и стилями CSS и всем, и только путем изменения это - объект ДАО в конструкторе компонента, это является абсолютно допускающим повторное использование в другом проекте.
- Превосходная поддержка вещей как Ajax, Портлеты и различные платформы в целом непосредственно out-of-the-box И что еще более важно это не полагается ни на что больше, чем slf4j/log4j для работы, все является дополнительным!
НЕДОСТАТКИ Калитки:
- Разработка имеет некоторый беспорядок о вещах в целом, и дженерики Калитки являются определенной путаницей прямо сейчас, хотя они были убраны много в 1,4
- , Некоторые компоненты (как
Form.onSubmit()) требуют обширного разделения на подклассы или анонимного переопределения метода для введения поведения легко. Это происходит частично из-за мощного основанного на событии дизайна Калитки, но к сожалению это также означает, что легко сделать путаницу кода с Калиткой.
Случайные НЕДОСТАТКИ: (то есть, я не использовал, но это мой opionions и/или вещи, которые я услышал)
- , GWT является JavaScript, базирующийся который звуки, глупые мне. Основной вопрос - то, что это напоминает мне слишком много JSP:s и его автоматически сгенерированных классов, которые ужасны.
- Гобелен не разделяет разметку и кодирует правильно способом, который мог быть легко проверен между двумя, которые вызовут проблемы в будущем.
Я использовал GWT для пары маленьких проектов. Вот некоторые вещи, мне нравится приблизительно он:
- Это - ajax по умолчанию, таким образом, я не имел к , делают , это делает ajax, это просто пришло с использованием GWT.
- Это имеет хорошее разделение клиента по сравнению с серверным кодом.
- я могу модульный тест мой клиентский код с помощью junit
- , которому Он позволяет, Вы создали хрустящий картофель, мгновенные приложения, в основном потому что это - ajax.
Вещи мне не нравится:
- Некоторые вещи не работают как ожидалось. Например, я видел случаи, где события щелчка не стреляли как ожидалось, таким образом, я должен был сделать обходное решение.
- Авторазвертываются коту, работающему в затмении, иногда просто прекращает работать, и я никогда не мог выяснять почему.
Самый большой вопрос, который я задал бы, состоит в том, почему Вы изменяете уровень представления? Это - очень дорогая стоимость, и я вижу преимущества одной технологии, перевешивающей другие так же как стоимость для изменения...
Короче говоря:
= JSF =
ПРОФЕССИОНАЛЫ:
- компонентная архитектура;
- многие библиотеки & инструменты;
- несколько хорошая поддержка IDE
CONS:
- тяжелый вес, и в ЦП/памяти и кривая обучения;
- , когда что-то не работает как ожидалось, трудно отладить
= КАЛИТКА =
ПРОФЕССИОНАЛЫ:
- легкий вес;
- разумная система шаблонной обработки;
- хорошие учебные руководства;
CONS:
- справочная документация не организована так хорошо и глубоко как учебные руководства;
- группа разработчиков испытала некоторые серьезные затруднения, особенно при становлении и вывела проект. Этот вывод к беспорядку на важных аспектах платформы, в то время я должен был переключиться на другую платформу из-за этого...
Мой выбор был бы Калитка . Использовали его, и, дает превосходную возможность многократного использования. Это имеет один из самого вибрирующего форума/списка рассылки. Как вопрос и то, что это собиралось быть отвеченным в минутах. Это имеет превосходную поддержку Ajax. Одни из обычных недостатков, приписанных Калитке, являются крутой кривой обучения. Хорошо это были одни из недостатков старости, которые не содержат значения больше теперь.
JSF: Лучше держитесь подальше от него. Другая команда, которая разработала проект на JSF, теперь думает для смещения к Калитке после нашего успеха с нею.
@Megadix: Как Вы сказал, что документация была плоха в начале, но не больше. Существует превосходная книга под названием Калитка в Действии, записанном разработчиками Калитки. Код кода, предоставленный на сайте, является также хорошим местом, чтобы запуститься и учиться
Я задался бы вопросом, если Вы уровня служб, это отлично от веб-клиента, что-то, что веб-контроллеры просто вызывают, чтобы сделать их работу.
, Если Вы делаете, выбор веб-технологии UI может быть отделен от бэкэнда. Если это выставляется как контракт первый веб-сервис, у Вас могут быть различные приложения, совместно используют его. Пока Ваши клиенты могут отправить и получить XML, они могут взаимодействовать с Вашими сервисами. Хотите переключиться на Flex? Никакие заботы - не указывают на него на сервис и представляют ответ XML.
См. Мое сравнение Wicket и Tapestry 5: Разница между Apache Tapestry и Apache Wicket .