We Keep Coding

How can I create a different URL for every new Object

I have built this site "https://supsurvey.herokuapp.com/SurveyCreate.html"
You create a survey and then it redirects you to a unique URL
https://supsurvey.herokuapp.com/SurveyPage.html#718807c9-3a5b-4745-b953-511afef5e073
In the surveyCreate page I have location.assign (SurveyPage.html#${survey.id}) which is linked to SurveyPage.js and from there I extract the uuid4 using currentUrl.split (#) and then I send a get request to my server which is built in NODE-JavaScript (only for strong survey objects in MongoDB) for the correct survey OBJECT and display it to the user.
I want so so that after you press create Survey you will be redirected to
https://supsurvey.herokuapp.com/SurveyPage/718807c9-3a5b-4745-b953-511afef5e073
So instead of .html#{uuid} to /{uuid}
How do I do that?
I have tried changing to location.assign (SurveyPage/${survey.id})
but it fail because it doesn't find the file without the .html extension
I also tried location.assign (SurveyPage.html/${survey.id}) which also doesn't work.

since you are using NODE for backend - you can build your app using express
https://expressjs.com/en/api.html#req.baseUrl
allows for api like route rewriting to accomplish what you want
can also be done using the more robust Hapi server
https://hapi.dev/
can be done on any language really
slimphp works great for php apps
http://www.slimframework.com/

Web api project on one port and Front end

I have 2 project in 1 visual studio solution - Front end(HTML, CSS and JS) and Web API.They are running on separated ports - the FE on 37056 and API on 6596.In the JS files im targeting the wep api controllers - for example http://localhost:6596/api/Contacts/GetContacts, and the rendering the response from the Wep API on the HTML page.So far so good..
Here is come the problem - in the HTML the URLs are presented http://localhost:37056/about.html, so if for example i want to point to some specific resource returned by the Web API this is not possible.If i type for example http://localhost:37056/api/Contacts/GetContacts there will be wrong request.
How i can to bypass this - i have a blog post in the Front end that are feed with data from WEB api + database.I want to give the user opportunity to http://localhost:37056/api/Blog/Page=1 at the moment this is only possible if he/she navigate to the page called Blog in the Front end and click on specific Post and the URL in the browser will Not change.It will be http://localhost:37056/api/Blog without page numbers and so on (JS is making the requests).
Thanks in advance!

You're concatenating FrontEnd URL (http://localhost:37056) with the BackEnd resource (api/Contacts/GetContacts).
There are two ways to solve this:
Return from BackEnd absolute URL (instead relative) pointing to backend resource. This should be feasible, since backend "knows" it's own URL.
Store in FrontEnd base URL from backend, and concatenate it to relative paths returned.
I suggest using first option, because in case some resources are moved to a new location (for example, external resources stored in third-party servers) you don't need to update front end at all.

Could you use absolute uri instead of relative Uri in html?

Call graph from javascript file and return boolean value

We want to define a graph via flowhub which should
receive a file (or maybe just two strings --> user & password) (Not sure which components to use for this part)
check if they are staged in our database (will be mocked, later the strings will be forwarded to the backend and the graph should get an answer if it's okay or not to proceed)
return the result as boolean so the homepage knows whether to log the user in or not
In the first step we want to call the graph with a button on our homepage. Normally it's started via javascript but we don't know how we should call the graph. Is there an url with port which forwards the request to our graph and gets the response as answer which we can handle or how does this kind of noflo process work?

So, for this there are couple of ways to go, depending how your setup looks like.
If your graph requires NoFlo on Node.js, then you could either:
Wrap it in another NoFlo graph that provides a web API to your graph. If you want to go the RESTful route, then noflo-xpress is a good option. noflo-websocket provides a nice way to do this with a WebSocket connection instead
Wrap it in a regular Node.js web app (for example, Express) via noflo.asCallback
If your graph doesn't require server-side functionality, the other option is:
Build a browser-executable bundle of your NoFlo graph with grunt-noflo-browser, then include that in your web app and use noflo.asCallback

Where to put the JS

I am writing a backend for a web based system and currently do testing using curl on the command line. I know too little about web design so I'll outsource this layer later, once the service has taken shape.
In the mean time I do want to just do a small proof of concept that a web site can act as middle (front-ish) tier.
The back-end (being written in python/bottle) receives data in JSON format (and replies in a similar format), so I can do
$> POSTING="-X POST -H Content-Type:application/json -u user:password"
$> curl $POSTING -d #input.json https://backend.server/path/to/function
I would like to try out a few of the functions using a web-based interface in stead of curl, so I wrote a simple handler in python using a preppy template that throws up a form, eg:
<form action="https://backend.server/path/to/function" method="post">
Enter Something <input name="fieldname" type="text" />
</form>
This form is actually generated by a simply python/bottle/preppy program running on a "front-end" server, eg: https://frontend.server/testform
The form action points to the same path that I would use in curl, but this has got some disadvantages because the backend system doesn't have any awareness of the front-end system being used, so there is no re-direction to a next step.
I can possibly let the form be handled on the frontend-server, re-package the request and forward it to the backend server as JSON, handle the response from the backend, and format it for the client. This makes sense because the front-end can do some value-add (by being not stateless, eg it can add smart logic (The backend provides a very simple interface).
So as a mostly academic question, and because I am sure I will need to know at some point how to do this in any case, I started to investigate how to use JavaScript to submit form data as JSON.
I have found This answer which seems good to me, but where does it go in the HTML document? I guess between <script> tags in the <head> section, but how does the script know when to execute - I may have multiple forms on a single page: So how does it know which form to attach to? Basically about this answer I want to know how it works?
How can I alter it to also be able to handle other HTTP methods, eg PUT or DELETE?
I have another question which relates to the Authentication header, as I want Authentication and Authorization to be handled on the back-end. The "front-end" can be owned by an untrusted third party, so how do I handle this?
My current thinking is that the user will sign the request and the JSON requests may look like this:
{
"FINGERPRINT": "xxxxxxxxxxxxxxx",
"REQUESTSIGNATURE": "xxxxxxxxxxxxxxxxxxxxxx",
"SUBJECT": "URL.....",
"REQUEST": {
"Field1": "Field1-value",
"Field2": "Field2 value"
}
}
In this case the Form Fields are packed into the "REQUEST" field of the main JSON document, and the signature is generated for that part only. The client must to the JSON packaging because the middle tier must not have access to the user's private key.
Since the request section of the JSON document is not encrypted, and since HTTP authentication lives outside of the request data, I can use a pre-stored public key for every user to authenticate the requests. The Middle tier can read the request, but depends on the back-end to verify the signature. The only problem with this is how to get the client (browser) to store a public key for a new user without first handing it to the untrusted middle tier. But this is probably a separate question?

knockout.js external model js file

I have an MVC.NET app which using Knockout.js (+ knockout.mapping) to deal with some cascading dropdowns. The data for these comes from a WebAPI call to an external service. As it happens this service requires an authentication token which expires after 2 hours, so I have the MVC app put the data from the service in a System.Web.Caching.Cache and return it from there unless the token has expired where it will grab it again from the service.
This is working fine.
However when I need to get this to the View, I am currently using the following method, which is to have a property of the ViewModel that I assign the service/Cache data to and then do this in the view:
var model = new ViewModel(#Html.Raw(Json.Encode(Model.ReferenceData)))
ko.applyBindings(model);
where Model.ReferenceData is the data from the service.
again this is working fine, but... the thing is with this, that the page then has all that Json data dumped in it on each request.
I would like to use an external JS file for the ReferenceData as then at least it can be cached by the browser and lessen the weight of the page on future requests.
However, I imagine that the overhead of generating a JS file is not that small, along with – what I really need is it to generate a link to that file that changes in much the same way that the built in MVC bundling of js files works – generating a link with a querystring.
My question is: is there an easy way of doing this?
For sure I can, when the cache is filled that first time, generate a js file and reference that from the View, but as I say getting that to change its link each time it is refreshed – or at least working out whether the data in it has changed and updating it only then is where the problem lies.
Any insight to this would be of great help
Thanks
Nat

Version the JS file (you can keep a GUID in the file it-self).
In Application_Start() get this version ID to a static variable.
In your controller pass this static variable data to ViewBag.
Ref your script with this ID
When you regenerate the file, update the version in file as well as your static variable. Next request from the client get the new version with new key.
Now if you want to update clients on the new version you have to use bi-directional protocol like web sockets or long-polling.