...

Objetivo

O objetivo desse guia é apresentar a integração de widgets com serviços JSON de outras fontes de dados, que estão fora do domínio do servidor Fluig.
Utilizaremos a técnica de Json Padding - JSONP - para obtermos dados de terceiros com uma função de callback. 

Problema

Se você chegou aqui é porque provavelmente estava desenvolvendo um widget e se deparou com uma mensagem similar a apresentada abaixo.:

XMLHttpRequest cannot load http://pudim.com.br/service.
No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://pudim.com.br’ is therefore not allowed access.

Páginas web comuns podem utilizar o objeto XMLHttpRequest para enviar e receber dados de servidores remotos, no entanto elas estão restritas nas ações que podem fazer porém as ações que essas páginas poderão realizar são limitadas pela política de mesma origem (same-origin policy). Isto

Este é um conceito muito importante nos modelos no modelo de segurança dos browsers atuais e dita como eles podem somente permitir navegadores atuais, pois define que scripts de uma página "A" somente podem acessar dados de uma página "Bsomente " se ambas estiverem na possuírem a mesma origem. A origem de uma página é definida pelo seu protocolo, endereço e porta.

Felizmente, nem tudo é afetado pela same-origin policy. Por exemplo, é possível carregar uma imagem externa ou um script de um domínio diferente da página atual. Isto Entretanto, isso ainda não é exatamente o que você faz quando utiliza uma imagem externa numa página. Entretando, apesar disso ser fantástico, não ajuda muito quando precisamos obter dados JSON para exibir em uma widget no fluig. suficiente quando precisa-se obter dados JSON e exibi-los em um widget na plataforma Fluig.

JSONP pode ser a solução

 JSONP - (JSON with Padding - ) é uma técnica que nos provê disponibiliza uma forma de acessar os dados JSON que precisamos. Isto é feito com os dados sendo envelopados através do empacotamento dos dados em uma função de callback (o "padding") que será interpretada pelo browser navegador em JavascriptJavaScript. Esta função precisa ser definida na no widget que receberá o retorno JSONP.

Exemplo

Veja abaixo um exemplo de uma chamada JSONP a um serviço fictício de terceiros:

displayPudimData: function(){
	this.getPudimData(function(error, data){
		if(error){
			FLUIGC.toast({
				message: 'Error getting pudim data: No dessert for you!',
				type: 'danger'
			});
			return false;
		}
		// Use the variable 'data', Luke!
	});
}
 
getPudimData: function(callback){
	var options = {
		url: 'http://pudim.com.br/service',
		async: falsetrue,
		contentType: 'application/json',
		dataType: 'jsonp',
		loading: false
	};
	FLUIGC.ajax(options, callback);
}

...