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