如何将图像从 Applet 传递到 JSF 支持 bean [英] How to pass image from Applet to JSF backing bean
问题描述
我正在使用一个 Web 应用程序,其中有一个 Java Applet 可以将图像从 wacom 设备捕获到 RenderedImage
对象中.小程序本身嵌入到 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,以便它成为 User
对象的一部分.我的支持 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:
- 从保存数据的
BufferedImage
创建一个字节数组; - 正确编码数据,使其在作为字符串发送到服务器时不会被损坏/修改,例如使用 Apache Commons Base64 编解码器;
- 通过 Applet-to-JavaScript 通信将数据保存为隐藏表单字段;
- 向服务器发送POST请求,例如触发
的onclick
; - 以标准 JSF 方式将编码字符串写入 java bean 属性;
- 对字符串进行解码,得到表示图像的字节数组;
- 从字节数组重新创建图像并将其注入您的视图作用域 bean.
- Create a byte array from your
BufferedImage
that is holding its data; - 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;
- Save the data as a hidden form field via Applet-to-JavaScript communication;
- Send POST request to the server by, for example, triggering
<h:commandButton>
'sonclick
; - Write encoded string to a java bean property in a standard JSF way;
- Decode the string to get the byte array representing the image;
- 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 Applet 方法:
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屋!