Como usar o servidor MVCBr OData com javascript !!!
Javascript possui tudo que é necessário para consumir RESTful – alias, não foi por lá que nasceu!
O exemplo é bem simples com objetivo somente de mostrar como estruturar os artefatos para fazer a busca no servidor. Para o teste, o servidor estava instalado como um serviço windows respondendo na porta 8080 configurado com o banco padrão que vai de exemplo com o servidor OData do MVCBr – Firebird3;
Classes construtura para OData Protocol:
[code lang=”javascript”]
class ODataBuilder{
constructor(AResource) {
this.BaseURL = "http://localhost:8080",
this.Service = "/OData.svc",
this.ServicePrefix = "/OData",
this.ResourceParams = "",
this.Top = 0,
this.Skip = 0,
this.Select = "",
this.OrderBy = "",
this.Filter = "",
this.Params = "";
this.Resource = "/" + AResource;
}
formatParams() {
var rt = "";
if (this.ResourceParams == "") {
return rt;
}
rt = rt + "(" + this.ResourceParams + ")";
}
BaseURI() {
return this.BaseURL + this.ServicePrefix + this.Service;
}
ResourceParams(AParams) {
this.ResourceParams = AParams;
}
addParams(prm) {
if (this.Params != "") { this.Params += "&" };
this.Params += prm;
};
URI() {
var rt = this.Resource + this.formatParams();
this.Params = "";
if (this.Top > 0) this.addParams("$top=" + this.Top.ToString());
if (this.Skip > 0) this.addParams("$skip=" + this.Skip.ToString());
if (this.Select != "") this.addParams("$select=" + this.Select);
if (this.Filter != "") this.addParams("$select=" + this.Filter);
return rt + "?" + this.Params;
};
ToString() {
return this.BaseURI() + this.URI();
}
};
[/code]
Classe RestClient para comunicação com o servidor:
[code lang=”javascript”]
class RestClient {
constructor(AODataBuilder) {
this.Builder = AODataBuilder;
this.ResponseCode = 0;
this.ResponseContent = "";
}
ResponseCode() {
return this.ResponseCode;
}
Content() {
return this.ResponseContent;
}
GET(fn) {
this.ResponseCode = 0;
$.ajax({
url: this.Builder.ToString(),
type: ‘GET’,
dataType: ‘json’,
success: function (data) {
this.ResponseContent = data;
if (fn != null) {
fn(data);
}
}
});
};
};
[/code]
Exemplo construção da chamada HTML5:
[code lang=”html”]
<html>
<head>
<script src="./js/jquery.min.js"></script>
<script src="./src/ODataBuilder.js"></script>
<script src="./src/ODataBuilder.js"></script>
<script src="./src/RestClient.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(‘#ok’).click(function(){
var builder = new ODataBuilder("produtos");
var rc = new RestClient(builder).GET(
function (data) {
$(‘#content’).text( JSON.stringify(data) );
});
});
});
</script>
</head>
<body>
<textarea rows="20" cols="80" id="content" name="content">
</textarea>
<button id="ok">Okey – Pedir dados proddutos</button>
</body>
</html>
[/code]
Exemplo completo no GIT