如何从Applet的传递图像JSF支持bean [英] How to pass image from Applet to JSF backing bean

问题描述

我在其中有一个Java小程序，从WACOM设备捕获图像插入的RenderedImage 对象的Web应用程序的工作。小程序本身嵌入到JSF 2.0页。

I am working with a web application in which there is a Java Applet that captures an image from a wacom device into a RenderedImage object. The applet itself is embedded into a JSF 2.0 page.

我需要通过创建的RenderedImage 从Applet的一个JSF支持bean所以，这将是一个用户的一部分对象。我支持bean是视图范围。

I need to pass the created RenderedImage from Applet to a JSF backing bean so that it would be a part of a User object. My backing bean is view scoped.

我真的失去了与此有关。我一直在寻找这个目标如何实现一个很好的例子。我应该使用 JSObject ，或者我应该的图像发送到一个servlet？

I'm really lost with this. I've been searching for a good example on how this goal can be achieved. Should I use JSObject, or should I send an image to a servlet?

可以提供关于如何解决这个问题的一些建议吗？

Can you offer some advice on how to solve this problem?

推荐答案

您的问题可分为以下子步骤：

You problem can be divided into the following sub-steps:

1. 创建从字节数组的的BufferedImage 所持有其数据;


2. 恩code正确，以便它不会因使用而损坏/改性而它被发送到服务器作为字符串，例如<数据一href=\"http://commons.apache.org/proper/commons-$c$cc/apidocs/org/apache/commons/$c$cc/binary/Base64.html\">Apache下议院的Base64 codeC ;


3. 通过小程序到JavaScript通信的数据另存为一个隐藏的表单字段;


4. 发送POST请求到服务器通过，例如，触发＆LT; H：的commandButton＆GT; 的的onclick


5. 写EN codeD字符串在标准JSF的方式将Java Bean属性;


6. 德code中的字符串来获取字节数组重新presenting形象;


7. 重新创建从字节数组的形象和在你看来它注入范围的bean。

1. Create a byte array from your BufferedImage that is holding its data;
2. Encode the data properly so that it won't be damaged/modified while it is being sent to the server as a string, for example by using Apache Commons Base64 codec;
3. Save the data as a hidden form field via Applet-to-JavaScript communication;
4. Send POST request to the server by, for example, triggering <h:commandButton>'s onclick;
5. Write encoded string to a java bean property in a standard JSF way;
6. Decode the string to get the byte array representing the image;
7. Recreate the image from the byte array and inject it in your view scoped bean.

这是说，让我们继续实施这一议程。

That said, let's move on to implementing that agenda.

在您的小程序你必须会做的方法要点（1） - （4）。说它是在通常的方式，您将获得后的图像：

In your applet you'll have a method that will do points (1) - (4). Call it in a usual way, after you obtain the image:

Java小程序的方法：

Java Applet method:

public void processImage() throws IOException, JSException {
    BufferedImage image = createBufferedImage();//the way you get the image
    /* point 1 */
    ByteArrayOutputStream bs = new ByteArrayOutputStream();
    ImageIO.write(image, "png", bs);
    bs.flush();
    byte[] imageByteArray = bs.toByteArray();
    bs.close();
    /* point 1 */
    String imageAsString = Base64.encodeBase64String(imageByteArray);//point 2
    /* points 3-4 */
    JSObject window = JSObject.getWindow(this);
    window.call("writeImageValue", new Object[] {imageAsString});
    /* points 3-4 */
}

JSF页面（表单和JavaScript）：

JSF page (form and JavaScript):

<script>
    function writeImageValue(imageValue) {
        document.getElementById('image').value = imageValue;//point 3
        document.getElementById('image-form:submit').click();//point 4
    }
</script>
<h:form id="image-form">
    <input type="hidden" id="image" name="image" />
    <h:commandButton id="submit" action="#{imageSubmitBean.submitImage}" style="display:none" />
</h:form>

JSF管理的bean：

JSF managed bean:

@ManagedBean
@RequestScoped
public class ImageSubmitBean {

    @ManagedProperty("#{param.image}")//point 5
    private String imageAsString;//getter+setter
    @ManagedProperty("#{userBean}")//your view scoped bean
    private UserBean userBean;//getter+setter

    public String submitImage() throws IOException {
        byte[] imageByteArray = Base64.decodeBase64(imageAsString);//point 6
        /* point 7 */
        InputStream is = new ByteArrayInputStream(imageByteArray);
        BufferedImage image = ImageIO.read(is);
        is.close();
        userBean.setUserImage(image);//update your view scoped bean
        /* point 7 */
        return null;
    }

}

这篇关于如何从Applet的传递图像JSF支持bean的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！