Problemas com a4j:mediaOutput [JSF]

15 respostas
C

iai pessual, bele?

to com um problema chato e num to entendendo como resolver…

seguinte, tenho que fazer em um cadastro um upload de uma imagem, e assim que o upload for feito carregar a imagem em um a4j:mediaOutput (parecido com o exemplo de rich:fileUpload da pagina de samples do RichFaces)…fiz um codigo aki, mas não sei oq pode estar errado…O upload acredito que esteja correto pois ja usei isso em outra aplicação…quando eu clico em “upload” no componente ele faz o upload, a parte de carregar a imagem é renderizada (assim como esperado), as informações do arquivo (nome e tamanho) tb aparecem corretamente…mas o mediaOutput aparece com um x no canto superior esquerdo (como se app não achasse a imagem)

segue meu código:

Imagem.java

public class Imagem implements Serializable{ private String nome; private int tamanho; private byte[] dados; //.... }

No Managed Bean:

listener do richFileUpload:

public void listener(UploadEvent event) { UploadItem item = event.getUploadItem(); this.imagem = new Imagem(); this.imagem.setTamanho(item.getData().length); this.imagem.setNome(item.getFileName()); this.imagem.setDados(item.getData()); this.uploadsDisponiveis--; this.qtdeArquivos++; }

paint para carregar imagem no a4j:mediaOutput

public void paint(OutputStream stream, Object object) throws IOException { //stream.write(this.getImagens().get((Integer)object).getDados()); stream.write(this.getImagem().getDados()); }

no jsp:

tag do upload

<rich:fileUpload id="upload" addControlLabel="Adicionar" clearAllControlLabel="Limpar Tudo"
                                                 clearControlLabel="Limpar" stopEntryControlLabel="Parar Processo"
                                                 listWidth="375px" listHeight="90px"
                                                 uploadControlLabel="Upload file"
                                                 fileUploadListener="#{produtoBean.listener}"
                                                 maxFilesQuantity="#{produtoBean.uploadsDisponiveis}"
                                                 immediateUpload="false"
                                                 acceptedTypes="jpg, gif, png, bmp">
                                    <a4j:support event="onuploadcomplete" reRender="info" />
                                    <f:facet name="label">
                                        <h:outputText value="{_KB}KB de {KB}KB carregados ---{mm}:{ss}"/>
                                    </f:facet>
                                </rich:fileUpload>

tag do mediaOutput

<a4j:mediaOutput element="img"
                                                                 mimeType="image/jpg"
                                                                 createContent="#{produtoBean.paint}"
                                                                 value="#{produtoBean.imagem}"
                                                                 style="width:180px; height:100px;"
                                                                 cacheable="false">
                                                </a4j:mediaOutput>

alguem poderia me ajudar?
vlw

15 Respostas

L

cara to com o mesmo problema tu já achou a solucao

N

E ai pessoal, blz ?

Vocês conseguiram resolver esse problema ?
Também estou com o mesmo aqui.

Aguardo e Obrigado !

L

Cara a unica solução que consegui foi criar uma sessão para recuperar a imagen e depois manipular do jeito que quero, tirando isso não consegui de nenhuma outra maneira

N

Então cara, eu acho que esse exemplo do rich faces esta furado. Porque estou tentando fazer igual e não consigo.
Ao executar a aplicação teste que montei, ele executa primeiro o método “paint” do a4j:outputmedia para depois eu adicionar a imagem no “rich:fileupload”. Sendo que o correto acho que seria executar esse método depois que carregasse o arquivo no fileupload.

Porque o teste que estou fazendo aqui é o seguinte:

  • Faço um upload da imagem;
  • Pego o “Data” (Byte[]) e armazeno em um arquivo Blob no banco.
  • Ai estou tentando pegar esses dados e colocar na tela de volta.
    Porém esse ultimo passo eu não consigo. Até gravar no banco esta OK, agora ler e mostrar a imagem de volta não consigo.

Vou ver se do jeito que vc falou da certo, mas quero ver se encontro uma outra solução. Pois aqui no meu caso não posso ficar utilizando muito a sessão.

Se tiver mais alguma ideia, poste ai…

Vlw e obrigado por enquanto !

L

Pois é, tiver que fazer o mesmo você, guarda no banco como LOB, inserir normal e tudo mais na hora de mostra da esse erro ai tive que usar sessão
só que se você colocar uma imagem muito pequena mas muito mesmo ele carregar eu já fiz o teste e funciona normal mais tipo é um pontinho preto
em uma bandeira branca ^^

esse aqui e o listener : quiz somente um arquivo para UP

public void listener(UploadEvent event) throws Exception {
        UploadItem item = event.getUploadItem();
        File file = new File();
        file.setTipo(item.getContentType());
        file.setLength(item.getData().length);
        file.setNome(item.getFileName());
        file.setImagem(item.getData());
        cliente.setFoto(file);
        novaImagem = true;
    }

    public void paint(OutputStream stream, Object object) throws IOException {
        try {
            stream.write(cliente.getFoto().getImagem());
                } catch (IOException iOException) {
                       iOException.printStackTrace();
                }       
        }
N

E ai Luirton, blz ?

Cara o que vc esta usando para imprimir a imagem na tela ? o a4j:mediaoutput ?
Porque estou fazendo uns testes aqui e o a4j:mediaoutput esta com um comportamento estranho. Vou dentar excplicar, por exemplo:

  • Eu cadastrei um cliente e la no momento do cadastro faço upload de uma imagem e gravo em um atributo do mesmo (em um byte[]);
  • Gravo esse cliente no banco de dados com os dados certinho.
  • Ai quando termino de gravar, volto para uma tela que tem uma “grid” com todos os clientes cadastrados.
  • Com isso clico em editar o cliente que acabei de cadastrar.
  • Ao voltar para o cadastro, esta acontecendo o seguinte:
    • Primeiro ele popula todos os dados do cliente na tela normalmente;
    • Em seguinte, eu coloquei o a4j:mediaoutput para pegar o valor do atributo do cliente e exibir a imagem.
      Porém é ai que esta estranho. Ao inves de ele executar o método que recupera a imagem ( “public void paint(OutputStream stream, Object object)” ) pegando os valores que estão no atributo do obj cliente, ele passa no construtor, cria um novo cliente (pois esta definido assim no construtor) e depois ele vai para o método do a4j:mediaoutput. Com isso perdeu todos os valores e com isso o atributo que esta o byte[] esta vazio. :?
      Deu pra entender o que esta aconteceu ? Não consigo entender porque ele faz isso.

Como que vc esta fazendo ai ? Quando vc manda exibir os dados de seu cliente, como vc exibe a imagem e com qual componente ? Pode posta o código do Bean e da tela ?

Aguardo e obrigado !

L

Junior, coloca no teu faces-config o teu bean cliente como session que vai da certo

L

Dá uma olhada nesse links
acho que também da pra ajudar

http://www.guj.com.br/posts/list/131960.java

http://www.guj.com.br/posts/list/121087.java

L

esse aqui ta funcionando legal mais tu tem que tratar a session


"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:c="http://java.sun.com/jsf/core"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:t="http://myfaces.apache.org/tomahawk" template="/template.xhtml">










value="#{clienteManagedBean.cliente.nome}" size="40" />
requiredMessage="CPF é obrigatoria"
value="#{clienteManagedBean.cliente.cpf}">
timing="onload" />






id="telefone" />
timing="onload" />




size="40" />

value="#{clienteManagedBean.cliente.dataNascimento}"
datePattern="dd/M/yyyy" cellWidth="20px" cellHeight="22px"
style="width:160px" />



fileUploadListener="#{clienteManagedBean.listener}" id="upload"
immediate="false" immediateUpload="true"
acceptedTypes="jpg, gif, png, bmp" clearAllControlLabel="Limpar"
stopEntryControlLabel="Parar Processo" listWidth="375px"
listHeight="150px">






value="#{clienteManagedBean.cliente.foto}" var="file" rowKeyVar="row">


createContent="#{clienteManagedBean.paint}" value="#{row}"
style="width:100px; height:100px;" cacheable="false" session="true">





















value="#{clienteManagedBean.dependente.nomeDependete}" />
value="#{clienteManagedBean.dependente.grauDeParentesco}">


action="#{clienteManagedBean.salvarDependente}" value="Salvar" />

[code]public class ClienteManagedBean implements Serializable{
	Dependente dependente = new Dependente();
	Cliente cliente = new Cliente();
	private List<Cliente> buscarClientes;
	private List<SelectItem> grauDeparentescos;
	CilenteRepositorio clienteRepositorio = new CilenteRepositorio();
	FileRepositorio fileRepositorio = new FileRepositorio();
	boolean novaImagem;
	File imagemAnterior;
	boolean alterarDep;
	Integer posicao;
	private File file = new File();

	public List<SelectItem> getGrauDeparentescos() {
		if (grauDeparentescos == null) {
			grauDeparentescos = new ArrayList<SelectItem>();
			GrauDeParentesco[] grauDeParentescoList = GrauDeParentesco.values();
			for (int i = 0; i < grauDeParentescoList.length; i++) {
				grauDeparentescos.add(new SelectItem(grauDeParentescoList[i],
						grauDeParentescoList[i].name()));
			}
		}
		return grauDeparentescos;
	}

	public void listener(UploadEvent event) throws Exception {
		UploadItem item = event.getUploadItem();
		File file = new File();
		file.setTipo(item.getContentType());
		file.setLength(item.getData().length);
		file.setNome(item.getFileName());
		file.setImagem(item.getData());
		cliente.setFoto(file);
		novaImagem = true;
	}

	public void paint(OutputStream stream, Object object) throws IOException {
	
		 byte[] imgBytes = cliente.getFoto().getImagem();  
		 BufferedImage img = ImageIO.read(new BufferedInputStream(new ByteArrayInputStream(imgBytes)));  
		 ImageIO.write(img,"jpeg",stream);
	}

	public long getTimeStamp() {
		return System.currentTimeMillis();
	}

	public void salvar() {
		try {
			if (clienteRepositorio.buscarCpf(cliente.getCpf()) != null
					&& !clienteRepositorio.buscarCpf(cliente.getCpf())
							.isEmpty() && cliente.getId() == null) {
				addMessage("CPF já cadastrado", FacesMessage.SEVERITY_INFO);

			} else {
				clienteRepositorio.salvar(cliente);
				if (imagemAnterior != null && novaImagem) {
					fileRepositorio.remover(imagemAnterior);
				}
				imagemAnterior = null;
				novaImagem = false;
				addMessage("Cliente salvo com sucesso",
						FacesMessage.SEVERITY_INFO);
				cliente = new Cliente();
			}
		} catch (Exception e) {
			e.printStackTrace();
			addMessage("Falha ao salvar o cliente", FacesMessage.SEVERITY_ERROR);
		}
	}

	public List<Cliente> getListaTodosOsClientes() {
		return clienteRepositorio.buscarTodosClientes();
	}

	public void pesqFilme() {
		if ((cliente.getNome() == null || cliente.getNome().trim().isEmpty())
				&& cliente.getCpf() == null) {
			buscarClientes = getListaTodosOsClientes();
		} else {
			buscarClientes = clienteRepositorio.pesquisaClientePor(cliente
					.getNome(), cliente.getCpf());
		}
		cliente = new Cliente();
	}

	public String editar() {
		FacesContext context = FacesContext.getCurrentInstance();
		Map<String, String> requestMap = context.getExternalContext()
				.getRequestParameterMap();
		Long id = Long.parseLong(requestMap.get("id"));
		cliente = clienteRepositorio.buscarPeloIdCliente(id);
		imagemAnterior = cliente.getFoto();
		return "cadCliente";
	}

	public String remover() {
		FacesContext context = FacesContext.getCurrentInstance();
		Map<String, String> requestMap = context.getExternalContext()
				.getRequestParameterMap();
		Long id = Long.parseLong(requestMap.get("id"));
		cliente = clienteRepositorio.buscarPeloIdCliente(id);
		clienteRepositorio.remover(cliente);
		cliente = new Cliente();
		buscarClientes = null;
		return "pesqCliente";
	}

	public void salvarDependente() {
		if (cliente.getDependente() == null) {
			cliente.setDependente(new ArrayList<Dependente>());
		}
		if (alterarDep) {
			cliente.getDependente().set(posicao, dependente);
		} else if (cliente.getDependente().size() < 3) {
			cliente.getDependente().add(dependente);
		} else if (cliente.getDependente().size() >= 3) {
			addMessage("Maximo de dependente são 3",
					FacesMessage.SEVERITY_ERROR);
		}
		alterarDep = false;
		dependente = new Dependente();
	}

	public void alterardependente() {
		FacesContext context = FacesContext.getCurrentInstance();
		Map<String, String> requestMap = context.getExternalContext()
				.getRequestParameterMap();
		posicao = Integer.parseInt(requestMap.get("posicao"));
		dependente = cliente.getDependente().get(posicao);
		alterarDep = true;
	}

	public void removerdependente() {
		FacesContext context = FacesContext.getCurrentInstance();
		Map<String, String> requestMap = context.getExternalContext()
				.getRequestParameterMap();
		Integer posicao = Integer.parseInt(requestMap.get("posicao"));
		cliente.getDependente().remove(posicao.intValue());
	}

	public static void addMessage(String messageText, Severity typeMessage) {
		FacesContext context = FacesContext.getCurrentInstance();
		FacesMessage message = new FacesMessage(typeMessage, messageText, null);
		context.addMessage(null, message);
	}

	public List<Cliente> getBuscarClientes() {
		return buscarClientes;
	}

	public void setBuscarClientes(List<Cliente> buscarClientes) {
		this.buscarClientes = buscarClientes;
	}

	public File getFile() {
		return file;
	}

	public void setFile(File file) {
		this.file = file;
	}

	public void setGrauDeparentescos(List<SelectItem> grauDeparentescos) {
		this.grauDeparentescos = grauDeparentescos;
	}

	public Dependente getDependente() {
		return dependente;
	}

	public void setDependente(Dependente dependente) {
		this.dependente = dependente;
	}

	public Cliente getCliente() {
		return cliente;
	}

	public void setCliente(Cliente cliente) {
		this.cliente = cliente;
	}

}

ai como te disse tu tem que por o scop como session oks ai tu trata para iniciar e feixar a sesão
se quizer te mando o meu exemplo todo é uma locadora o primeiro projeto :p

add ai no gtalk e no msn
[email removido]
[email removido]

N

Vlw ai pelo código e pelos links, vou dar uma olhada.

Com relação ao esquema de mudar o ManagedBean para Session, realmente funciona. Porém não posso fazer assim e nem vira também.
Com relação a jogar o Obj Cliente (no caso do exemplo) para Session e recupar depois e pegar o valor do atributo, seria melhor e também testei aqui. Funcionam legal, mas aqui no meu caso também não vai dar para usar assim.

Vou ver se testo com outros componentes, como por exemplo o “h:graphicImage”.
Assim que tiver uma posíção, posto aqui.

Obrigado por enquanto ! :thumbup:

R

nei.junior,

Você conseguiu resolver esse problema?

Estou passando pela mesma coisa.
Se eu mudar o escopo para session funciona, mas eu não posso mudar.

Se tiver resolvido, posta como fez por favor.

Caso tenha desistido do mediaOutput e tenha passado a utilizar h:graphicImage, posta aí como fez também.
Nesse momentos de desespero, qualquer ajuda.

Valeu!!!

N

rafael.bomfim:
nei.junior,

Você conseguiu resolver esse problema?

Rafael,

Não consegui resolver este problema também, e no momento não mais estou mexendo com isso. Na verdade desisti de apresentar a imagem, estou apenas armazenando. Mais para frente vou voltar a ver este caso, mas por enquanto parei de ver e não consegui resolver.
Fico devendo essa.

Abraço !

B

Coloque a classe que controla os dados do arquivo com o escopo de sessão e só passe o parâmetro value caso seja realmente necessário.
Este componente é problemático.

Os exemplos do site do richfaces devem estar usando escopo de sessão.

Um abraço

Blackstorm

L

Estou com o mesmo problema. Não funcionou com o @ViewScoped e nem anotado com @SessionScoped. O unico jeito foi colocar o bean no faces-config :thumbdown: e configurar a tag com session=“true”. Por mim se houvesse um listener de cancelar já resolvia o problema, acho ridículo o componente remover da tela e não remover do managed bean.

L

cara, eu resolvi assim , crei uma HttpSession… e joguei a img dentro dela ai quando é pra usar o metodo Paint você recupera a img da session e exibe ela… você tem que jogar na session no metodo listener a sua img pois o richfaces executa em outro thread o metodo paint ai ele perde o objeto por isso qeu você tem que pegar da session ai no metodo paint

blz ??

Criado 29 de julho de 2009
Ultima resposta 6 de jul. de 2010
Respostas 15
Participantes 6