From c18595d33b5ac38a822f1a45bb21d95d806cbe47 Mon Sep 17 00:00:00 2001 From: IsolatedSushi <simen.vanherpt@gmail.com> Date: Wed, 30 Sep 2020 23:38:54 +0200 Subject: [PATCH] New proto file --- .../app/index.js | 12 ++- .../docker-compose.yml | 8 +- .../haproxy/haproxy.cfg | 8 +- backend/{serverv2.js => server(OLD).js} | 49 +++++------ backend/server.js | 49 ++--------- frontend/src/App.vue | 12 +-- frontend/src/components/gRPCDaprClient.vue | 83 ------------------- .../{gRPCclient.vue => gRPCPointclient.vue} | 7 +- .../src/components/gRPCProjectorClient.vue | 51 ++++++++++++ .../src/generated/projector_grpc_web_pb.js | 56 ++++++------- frontend/src/generated/projector_pb.js | 3 +- frontend/src/projector.proto | 8 +- 12 files changed, 137 insertions(+), 209 deletions(-) rename backend/{serverv2.js => server(OLD).js} (69%) delete mode 100644 frontend/src/components/gRPCDaprClient.vue rename frontend/src/components/{gRPCclient.vue => gRPCPointclient.vue} (98%) create mode 100644 frontend/src/components/gRPCProjectorClient.vue diff --git a/backend/microservices and load balancing/app/index.js b/backend/microservices and load balancing/app/index.js index ec74e89..0c4fa40 100644 --- a/backend/microservices and load balancing/app/index.js +++ b/backend/microservices and load balancing/app/index.js @@ -4,13 +4,14 @@ const http = require('http'); //Default at 8090 to enable easy development const appid = process.env.APPID || 8090; +//OLD (Single point) app.get("/generatePoint", (req,res) => { console.log("Generating single point") - res.send({"appid": appid, "point": generatePoint()}) }) - +//Sends the stream Had to limit the speed with intervals +// Otherwise it sends 2.000.000+ points a sec app.get("/generatePointStream",(req,res)=>{ console.log("Generating points") var intervalId = setInterval(function(){ @@ -30,14 +31,11 @@ app.get("/generatePointStream",(req,res)=>{ }) - //Generate randomPoint function generatePoint(){ console.log - var xVal = Math.floor(Math.random()*20); - var yVal = Math.floor(Math.random()*20); - //console.log("Generated point. ID: " + count + " x: " + xVal + " y: " + yVal); - + var xVal = Math.floor(Math.random()*100); + var yVal = Math.floor(Math.random()*100); return {id:appid, x:xVal,y:yVal}; } diff --git a/backend/microservices and load balancing/docker-compose.yml b/backend/microservices and load balancing/docker-compose.yml index 4d80f55..16bbbb7 100644 --- a/backend/microservices and load balancing/docker-compose.yml +++ b/backend/microservices and load balancing/docker-compose.yml @@ -10,17 +10,17 @@ services: nodeapp1: image: nodeapp environment: - - APPID=1 + - APPID=1111 nodeapp2: image: nodeapp environment: - - APPID=2 + - APPID=2222 nodeapp3: image: nodeapp environment: - - APPID=3 + - APPID=3333 nodeapptest: image: nodeapp environment: - - APPID=4 + - APPID=4444 \ No newline at end of file diff --git a/backend/microservices and load balancing/haproxy/haproxy.cfg b/backend/microservices and load balancing/haproxy/haproxy.cfg index c87d797..a13ae5c 100644 --- a/backend/microservices and load balancing/haproxy/haproxy.cfg +++ b/backend/microservices and load balancing/haproxy/haproxy.cfg @@ -6,7 +6,7 @@ frontend http backend all mode http - server s1 nodeapp1:1 - server s2 nodeapp2:2 - server s3 nodeapp3:3 - server s4 nodeapptest:4 + server s1 nodeapp1:1111 + server s2 nodeapp2:2222 + server s3 nodeapp3:3333 + server s4 nodeapptest:4444 diff --git a/backend/serverv2.js b/backend/server(OLD).js similarity index 69% rename from backend/serverv2.js rename to backend/server(OLD).js index 0b696ce..ef72a90 100644 --- a/backend/serverv2.js +++ b/backend/server(OLD).js @@ -6,6 +6,8 @@ const axios = require('axios'); var _ = require('lodash'); var grpc = require('@grpc/grpc-js'); var protoLoader = require('@grpc/proto-loader'); +const http = require("http"); + var packageDefinition = protoLoader.loadSync( PROTO_PATH, {keepCase: true, @@ -16,10 +18,9 @@ var packageDefinition = protoLoader.loadSync( }); var protoDescriptor = grpc.loadPackageDefinition(packageDefinition); var pointPackage = protoDescriptor.pointPackage; -var count = 0; - +var count = 0; //SERVICE function sendPoint(call, callback) { @@ -28,40 +29,30 @@ function sendPoint(call, callback) { }) } - - -//Points stream function sendPointStream(call) { - - function sender(point) { - return (callback) => { - call.write(point); - _.delay(callback, 1); // in ms - }; - } + http.get("http://localhost:8090/generatePointStream", res =>{ - var senders = []; - var count = 10; - for (var i = 0; i < count; i++) { - senders[i] = sender(generatePoint()); - } - async.series(senders, () => { - call.end(); - }); -} + res.on("data", data =>{ + sendDataStream(data,call) + }) + res.on("end",function() { + call.end(); + }) + }) +} +//Right now it doesnt fix cut off jsons (FIX LATER) +function sendDataStream(data,call){ + var list = data.toString().split("\n") -//Generate randomPoint -function generatePoint(){ - var xVal = Math.floor(Math.random()*20); - var yVal = Math.floor(Math.random()*20); - count++; - //console.log("Generated point. ID: " + count + " x: " + xVal + " y: " + yVal); - - return {id:count, x:xVal,y:yVal}; + for(var i =1; i <list.length-2;i++){ + var response = JSON.parse(list[i]); + call.write(response["point"]); + } } + //Create server and route the grpc functions to js functions function getServer() { var server = new grpc.Server(); diff --git a/backend/server.js b/backend/server.js index c8650de..6dfd835 100644 --- a/backend/server.js +++ b/backend/server.js @@ -1,5 +1,5 @@ //SETUP -var PROTO_PATH = __dirname + '/point.proto'; +var PROTO_PATH = __dirname + '../../../protos/v3/projector.proto'; var assert = require('assert'); var async = require('async'); const axios = require('axios'); @@ -7,8 +7,7 @@ var _ = require('lodash'); var grpc = require('@grpc/grpc-js'); var protoLoader = require('@grpc/proto-loader'); const http = require("http"); -const { hostname } = require('os'); -const { SSL_OP_SSLEAY_080_CLIENT_DH_BUG } = require('constants'); + var packageDefinition = protoLoader.loadSync( PROTO_PATH, {keepCase: true, @@ -18,15 +17,9 @@ var packageDefinition = protoLoader.loadSync( oneofs: true }); var protoDescriptor = grpc.loadPackageDefinition(packageDefinition); -var pointPackage = protoDescriptor.pointPackage; - - -var count = 0; - +var projectorPackage = protoDescriptor.provee; - - -//SERVICE +//OLD function sendPoint(call, callback) { axios.get('http://localhost:8090/generatePoint').then(resp=>{ callback(null, resp["data"]["point"]); @@ -46,6 +39,7 @@ function sendPointStream(call) { }) } +//Right now it doesnt fix cut off jsons (FIX LATER) function sendDataStream(data,call){ var list = data.toString().split("\n") @@ -55,40 +49,15 @@ function sendDataStream(data,call){ } } -//Points stream -function sendPointStream2(call) { - - - - var senders = []; - var count = 10; - for (var i = 0; i < count; i++) { - senders[i] = sender(generatePoint()); - } - async.series(senders, () => { - call.end(); - }); -} - - - -//Generate randomPoint -function generatePoint(){ - var xVal = Math.floor(Math.random()*20); - var yVal = Math.floor(Math.random()*20); - count++; - //console.log("Generated point. ID: " + count + " x: " + xVal + " y: " + yVal); - - return {id:count, x:xVal,y:yVal}; -} //Create server and route the grpc functions to js functions function getServer() { + var server = new grpc.Server(); - server.addService(pointPackage.Point.service, { - readPoint: sendPoint, - readPointsStream: sendPointStream, + server.addService(projectorPackage.Projector.service, { + getProjectionPoints: sendPointStream, }); + console.log("started"); return server; } diff --git a/frontend/src/App.vue b/frontend/src/App.vue index 8fa103a..1a0f397 100644 --- a/frontend/src/App.vue +++ b/frontend/src/App.vue @@ -4,8 +4,8 @@ <Navbar/> <v-main class="grey lighten-2" align="center"> <!-- set to true for normal grpcClient --> - <gRPCclient v-if="true" v-on:newPoint="addPoint($event)" /> - <gRPCDaprClient v-if="false" v-on:newPoint="addPoint($event)" /> + <gRPCPointclient v-if="false" v-on:newPoint="addPoint($event)" /> + <gRPCProjectorClient v-if="true" v-on:newPoint="addPoint($event)" /> <ScatterPlot ref = "scatter"/> <Counter ref = "counter"/> @@ -15,8 +15,8 @@ <script> import Navbar from './components/Navbar'; -import gRPCDaprClient from './components/gRPCDaprClient' -import gRPCclient from './components/gRPCclient' +import gRPCProjectorClient from './components/gRPCProjectorClient' +import gRPCPointclient from './components/gRPCPointclient' import ScatterPlot from './components/ScatterPlot' import { interval } from 'rxjs'; import Counter from './components/counter' @@ -25,8 +25,8 @@ export default { components: { Navbar, - gRPCDaprClient, - gRPCclient, + gRPCProjectorClient, + gRPCPointclient, ScatterPlot, Counter }, created(){ diff --git a/frontend/src/components/gRPCDaprClient.vue b/frontend/src/components/gRPCDaprClient.vue deleted file mode 100644 index 32e6644..0000000 --- a/frontend/src/components/gRPCDaprClient.vue +++ /dev/null @@ -1,83 +0,0 @@ -/*eslint-disable*/ -<template> - <div> - <h1>Dapr grpc</h1> - <h1 class="my-10">Check the developer console for the messages</h1> - - <v-layout row> - <v-spacer></v-spacer> - - <v-btn v-on:click="testPrint">Request new point</v-btn> - <v-file-input show-size counter dense label="File input"></v-file-input> - <v-spacer></v-spacer> - </v-layout> - </div> -</template> - -<script> -const { TrainingSet } = require("../generated/projector_pb"); -//const { PointClient } = require("../generated/point_grpc_web_pb.js"); -const {ProjectorClient} = require("../generated/projector_grpc_web_pb") - -import axios from "axios"; - -export default { - name: "gRPCDaprClient", - data() { - return {}; - }, - created: function () { - const daprPort = process.env.DAPR_HTTP_PORT || 5051; - const dapr_url = "http://localhost:" + daprPort + "/v1.0/invoke/projector"; - - axios.get(dapr_url + "/method/url").then(response=> - { - console.log("Response: "); - console.log(response); - console.log("Dapr backend running on: " + response.data["ip_address"]+":"+response.data["port"]); - } - - - ); - var r = axios.post(dapr_url + "/method/start", 1).then((Response) => { - if (Response.data["successful"]) { - console.log(Response.data); - var connectURL = Response.data["url"]; - connectURL = "http://" + window.location.hostname + ":7050" - console.log(connectURL) - var client = new ProjectorClient( - connectURL, - null, - null) - - - console.log(client); - var param = new TrainingSet(); - - var stream = client.getProjectionPoints(param); - - stream.on("data", (response) => { - this.$emit('newPoint', response); - }); - stream.on("error", (err) => { - this.errorAlert = true - this.succesAlert=false - console.log( - `Unexpected stream error: code = ${err.code}` + - `, message = "${err.message}"` - ); - }); - } - console.log(r); - - }) - }, - methods: { - testPrint: function () { - console.log("print"); - }, - - - }, -}; -</script> \ No newline at end of file diff --git a/frontend/src/components/gRPCclient.vue b/frontend/src/components/gRPCPointclient.vue similarity index 98% rename from frontend/src/components/gRPCclient.vue rename to frontend/src/components/gRPCPointclient.vue index ea063ad..51f4f12 100644 --- a/frontend/src/components/gRPCclient.vue +++ b/frontend/src/components/gRPCPointclient.vue @@ -34,7 +34,7 @@ const { voidNoParam } = require("../generated/point_pb.js"); const { PointClient } = require("../generated/point_grpc_web_pb.js"); export default { - name: "gRPCclient", + name: "gRPCPointclient", data(){ return{ errorAlert: false, @@ -68,7 +68,7 @@ export default { //Create the stream var stream = this.client.readPointsStream(streamRequest, {}); - + //When data is received stream.on("data", (response) => { this.receivedPoint(response); @@ -83,8 +83,9 @@ export default { `, message = "${err.message}"` ); }); + }, - + unaryResponseHandler: function (err, response) { if (err) { this.errorAlert = true diff --git a/frontend/src/components/gRPCProjectorClient.vue b/frontend/src/components/gRPCProjectorClient.vue new file mode 100644 index 0000000..3545dfb --- /dev/null +++ b/frontend/src/components/gRPCProjectorClient.vue @@ -0,0 +1,51 @@ +/*eslint-disable*/ +<template> + <div> + <h1>Dapr grpc</h1> + <h1 class="my-10">Check the developer console for the messages</h1> + + <v-layout row> + <v-spacer></v-spacer> + + <v-file-input show-size counter dense label="File input"></v-file-input> + <v-spacer></v-spacer> + </v-layout> + </div> +</template> + +<script> +const { TrainingSet } = require("../generated/projector_pb"); +const { ProjectorClient } = require("../generated/projector_grpc_web_pb"); + +export default { + name: "gRPCProjectorClient", + data() { + return {}; + }, + created: function () { + const connectURL = "http://" + window.location.hostname + ":8080"; + console.log(connectURL); + var client = new ProjectorClient(connectURL, null, null); + + console.log(client); + var param = new TrainingSet(); + + var stream = client.getProjectionPoints(param); + + stream.on("data", (response) => { + this.$emit("newPoint", response); + }); + stream.on("error", (err) => { + this.errorAlert = true; + this.succesAlert = false; + console.log( + `Unexpected stream error: code = ${err.code}` + + `, message = "${err.message}"` + ); + }); + }, + methods: { + + }, +}; +</script> \ No newline at end of file diff --git a/frontend/src/generated/projector_grpc_web_pb.js b/frontend/src/generated/projector_grpc_web_pb.js index c32c1eb..b6434d0 100644 --- a/frontend/src/generated/projector_grpc_web_pb.js +++ b/frontend/src/generated/projector_grpc_web_pb.js @@ -78,8 +78,8 @@ proto.provee.ProjectorPromiseClient = * !proto.google.protobuf.Empty, * !proto.google.protobuf.Empty>} */ -const methodDescriptor_Projector_Start = new grpc.web.MethodDescriptor( - '/provee.Projector/Start', +const methodDescriptor_Projector_start = new grpc.web.MethodDescriptor( + '/provee.Projector/start', grpc.web.MethodType.UNARY, google_protobuf_empty_pb.Empty, google_protobuf_empty_pb.Empty, @@ -100,7 +100,7 @@ const methodDescriptor_Projector_Start = new grpc.web.MethodDescriptor( * !proto.google.protobuf.Empty, * !proto.google.protobuf.Empty>} */ -const methodInfo_Projector_Start = new grpc.web.AbstractClientBase.MethodInfo( +const methodInfo_Projector_start = new grpc.web.AbstractClientBase.MethodInfo( google_protobuf_empty_pb.Empty, /** * @param {!proto.google.protobuf.Empty} request @@ -126,10 +126,10 @@ const methodInfo_Projector_Start = new grpc.web.AbstractClientBase.MethodInfo( proto.provee.ProjectorClient.prototype.start = function(request, metadata, callback) { return this.client_.rpcCall(this.hostname_ + - '/provee.Projector/Start', + '/provee.Projector/start', request, metadata || {}, - methodDescriptor_Projector_Start, + methodDescriptor_Projector_start, callback); }; @@ -145,10 +145,10 @@ proto.provee.ProjectorClient.prototype.start = proto.provee.ProjectorPromiseClient.prototype.start = function(request, metadata) { return this.client_.unaryCall(this.hostname_ + - '/provee.Projector/Start', + '/provee.Projector/start', request, metadata || {}, - methodDescriptor_Projector_Start); + methodDescriptor_Projector_start); }; @@ -158,8 +158,8 @@ proto.provee.ProjectorPromiseClient.prototype.start = * !proto.google.protobuf.Empty, * !proto.google.protobuf.Empty>} */ -const methodDescriptor_Projector_Stop = new grpc.web.MethodDescriptor( - '/provee.Projector/Stop', +const methodDescriptor_Projector_stop = new grpc.web.MethodDescriptor( + '/provee.Projector/stop', grpc.web.MethodType.UNARY, google_protobuf_empty_pb.Empty, google_protobuf_empty_pb.Empty, @@ -180,7 +180,7 @@ const methodDescriptor_Projector_Stop = new grpc.web.MethodDescriptor( * !proto.google.protobuf.Empty, * !proto.google.protobuf.Empty>} */ -const methodInfo_Projector_Stop = new grpc.web.AbstractClientBase.MethodInfo( +const methodInfo_Projector_stop = new grpc.web.AbstractClientBase.MethodInfo( google_protobuf_empty_pb.Empty, /** * @param {!proto.google.protobuf.Empty} request @@ -206,10 +206,10 @@ const methodInfo_Projector_Stop = new grpc.web.AbstractClientBase.MethodInfo( proto.provee.ProjectorClient.prototype.stop = function(request, metadata, callback) { return this.client_.rpcCall(this.hostname_ + - '/provee.Projector/Stop', + '/provee.Projector/stop', request, metadata || {}, - methodDescriptor_Projector_Stop, + methodDescriptor_Projector_stop, callback); }; @@ -225,10 +225,10 @@ proto.provee.ProjectorClient.prototype.stop = proto.provee.ProjectorPromiseClient.prototype.stop = function(request, metadata) { return this.client_.unaryCall(this.hostname_ + - '/provee.Projector/Stop', + '/provee.Projector/stop', request, metadata || {}, - methodDescriptor_Projector_Stop); + methodDescriptor_Projector_stop); }; @@ -238,8 +238,8 @@ proto.provee.ProjectorPromiseClient.prototype.stop = * !proto.provee.TrainingSet, * !proto.provee.Point>} */ -const methodDescriptor_Projector_GetProjectionPoints = new grpc.web.MethodDescriptor( - '/provee.Projector/GetProjectionPoints', +const methodDescriptor_Projector_getProjectionPoints = new grpc.web.MethodDescriptor( + '/provee.Projector/getProjectionPoints', grpc.web.MethodType.SERVER_STREAMING, proto.provee.TrainingSet, proto.provee.Point, @@ -260,7 +260,7 @@ const methodDescriptor_Projector_GetProjectionPoints = new grpc.web.MethodDescri * !proto.provee.TrainingSet, * !proto.provee.Point>} */ -const methodInfo_Projector_GetProjectionPoints = new grpc.web.AbstractClientBase.MethodInfo( +const methodInfo_Projector_getProjectionPoints = new grpc.web.AbstractClientBase.MethodInfo( proto.provee.Point, /** * @param {!proto.provee.TrainingSet} request @@ -283,10 +283,10 @@ const methodInfo_Projector_GetProjectionPoints = new grpc.web.AbstractClientBase proto.provee.ProjectorClient.prototype.getProjectionPoints = function(request, metadata) { return this.client_.serverStreaming(this.hostname_ + - '/provee.Projector/GetProjectionPoints', + '/provee.Projector/getProjectionPoints', request, metadata || {}, - methodDescriptor_Projector_GetProjectionPoints); + methodDescriptor_Projector_getProjectionPoints); }; @@ -300,10 +300,10 @@ proto.provee.ProjectorClient.prototype.getProjectionPoints = proto.provee.ProjectorPromiseClient.prototype.getProjectionPoints = function(request, metadata) { return this.client_.serverStreaming(this.hostname_ + - '/provee.Projector/GetProjectionPoints', + '/provee.Projector/getProjectionPoints', request, metadata || {}, - methodDescriptor_Projector_GetProjectionPoints); + methodDescriptor_Projector_getProjectionPoints); }; @@ -313,8 +313,8 @@ proto.provee.ProjectorPromiseClient.prototype.getProjectionPoints = * !proto.google.protobuf.Empty, * !proto.provee.Point>} */ -const methodDescriptor_Projector_GetUpdates = new grpc.web.MethodDescriptor( - '/provee.Projector/GetUpdates', +const methodDescriptor_Projector_getUpdates = new grpc.web.MethodDescriptor( + '/provee.Projector/getUpdates', grpc.web.MethodType.SERVER_STREAMING, google_protobuf_empty_pb.Empty, proto.provee.Point, @@ -335,7 +335,7 @@ const methodDescriptor_Projector_GetUpdates = new grpc.web.MethodDescriptor( * !proto.google.protobuf.Empty, * !proto.provee.Point>} */ -const methodInfo_Projector_GetUpdates = new grpc.web.AbstractClientBase.MethodInfo( +const methodInfo_Projector_getUpdates = new grpc.web.AbstractClientBase.MethodInfo( proto.provee.Point, /** * @param {!proto.google.protobuf.Empty} request @@ -358,10 +358,10 @@ const methodInfo_Projector_GetUpdates = new grpc.web.AbstractClientBase.MethodIn proto.provee.ProjectorClient.prototype.getUpdates = function(request, metadata) { return this.client_.serverStreaming(this.hostname_ + - '/provee.Projector/GetUpdates', + '/provee.Projector/getUpdates', request, metadata || {}, - methodDescriptor_Projector_GetUpdates); + methodDescriptor_Projector_getUpdates); }; @@ -375,10 +375,10 @@ proto.provee.ProjectorClient.prototype.getUpdates = proto.provee.ProjectorPromiseClient.prototype.getUpdates = function(request, metadata) { return this.client_.serverStreaming(this.hostname_ + - '/provee.Projector/GetUpdates', + '/provee.Projector/getUpdates', request, metadata || {}, - methodDescriptor_Projector_GetUpdates); + methodDescriptor_Projector_getUpdates); }; diff --git a/frontend/src/generated/projector_pb.js b/frontend/src/generated/projector_pb.js index 3f6d027..91a4309 100644 --- a/frontend/src/generated/projector_pb.js +++ b/frontend/src/generated/projector_pb.js @@ -1,3 +1,5 @@ +/* eslint-disable */ + // source: src/projector.proto /** * @fileoverview @@ -7,7 +9,6 @@ * @public */ // GENERATED CODE -- DO NOT EDIT! -/* eslint-disable */ var jspb = require('google-protobuf'); var goog = jspb; diff --git a/frontend/src/projector.proto b/frontend/src/projector.proto index 6cd0b79..a2a1dab 100644 --- a/frontend/src/projector.proto +++ b/frontend/src/projector.proto @@ -15,24 +15,24 @@ service Projector { // A simple RPC. // // Start the Projector calculation - rpc Start(google.protobuf.Empty) returns (google.protobuf.Empty); + rpc start(google.protobuf.Empty) returns (google.protobuf.Empty); // Stop the Projector calculation - rpc Stop(google.protobuf.Empty) returns (google.protobuf.Empty); + rpc stop(google.protobuf.Empty) returns (google.protobuf.Empty); // A server-to-client streaming RPC. // // Obtains the Projection Points in 2D given the trainings values stored in a row format. Results are // streamed rather than returned at once (e.g. in a response message with a // repeated field). - rpc GetProjectionPoints(TrainingSet) returns (stream Point) {} + rpc getProjectionPoints(TrainingSet) returns (stream Point) {} // A server-to-client streaming RPC. // // Obtains the Projection Points in 2D given the trainings values stored in a row format. Results are // streamed rather than returned at once (e.g. in a response message with a // repeated field). - rpc GetUpdates(google.protobuf.Empty) returns (stream Point) {} + rpc getUpdates(google.protobuf.Empty) returns (stream Point) {} // // A client-to-server streaming RPC. // // -- GitLab