Call WCF service from JavaScript HTML within service - javascript

I currently have a WCF service that operates on a database. I'd like to be able to use JavaScript (specifically AngularJS) to call the service methods and display them in a webpage.
I know this can be done using a separate ASP.NET client application that uses the service, but I'd like to have the JavaScript/HTML be a part of the WCF service project. Ideally, I'd like the user to see my webpage when running the service, rather than something like this: https://pieterderycke.files.wordpress.com/2011/01/service-page-in-internet-explorer.png, but I have no idea where to start.
Where must I put my JS/HTML files in the project and how do I reference them from the WCF service? Does something need to be done to expose the service to the JS/HTML files? Thanks in advance!

It's actually rather simple, really just a matter of adding the files to your project. You just need to make sure the references within the JavaScript/HTML files all still point to the right spot. If you're using AngularJS specifically, add that to the project first, then add your custom files.
Also, if you're looking to show an HTML file when running the service in Visual Studio, have a look here: Displaying web page when running WCF service.

Related

Can I add pre-existing Javascript code to an ASP.NET MVC C# application

Apologies if this is a silly question. I currently have a small backend system written in ASP.NET Mvc in C# that allows you to do multiple features relating to profiles (Add, Edit, Delete, View) amongst other features.
My friend has an application he created as his University project and we're both just curious if we can merge his application with mine as his is purely a front-end system and mine is a back-end.
He has written an SQL web application that tests you with some general T-SQL questions with a pre-set SQLite3 database that you can modify based on the questions asked. He has written it all in Javascript and using HTML and CSS. He has 3 folders, a folder contaning all the javascript, a folder with an SQLITE3 database and a folder with the HTML/CSS.
I was just wondering, can I essentially 'drag and drop' all the 3 folders into my application on Visual Studio and will it just run seamlessly?. I assume I will need to go into the Javascript and modify any changes to the paths of the database which I can do. I'm not interested in calling any js functions or anything yet, just making it so I can start the application, be taken the HTML for the SQL application and then all the js scripts work for that page.
If this is not the case, is it a case where I can only use Javascript by injecting it into ASP.NET by using the tag <script type="text/javascript">?
Trying what I have stated. As it webpage was in HTML, I created an action in my controller that opens up the HTML page in CSHTML. This will display the HTML but no methods are called when the page loads therefore no database is loaded or what I presume to be any Javascript commands.
If there are any materials that help with this issue, can you please link them below. I had done some research but could not find anything that points to this specific issue.
Can I add pre-existing Javascript code to an ASP.NET MVC C# application
Yes.
Apologies if this is a silly question.
It isn't a silly question because there is an ambiguity in the question that might make the answer "no" in your specific case.
Firstly the good news - you can reference scripts written in Javascript in your HTML, and you can put blocks of Javascript in you CSHTML too. It's possible to use Razor to create a page that includes HTML, Javascript and C# in the same page - BUT there is a difference about where and when the code executes that might be an issue for you.
The question you need to determine is if your friend's project is written using the Node.js framework. Javascript is a language and it can be used in both front-end (execute in the client's browser) and back-end applications.
You can use your ASP application (which is server-side or back-end code) to write documents that either include Javscript or reference scripts to be executed by the client-side code in the browser. You can't get your back-end to run the Javascript in the same application) as it is intended for a different framework.
You can have two applications hosted on the same server, and make calls between them both and use them together in that respect, but otherwise you need to select one or other as the back-end providing framework for your web application.
So you can include Javascript in your ASP application, but for execution on the client-side in their browser. Your mentioning of database connections heavily implies that you are describing server-side code - so talk to your friend about Node.js to ensure that is what they are using.
You can read about Node.js here: https://nodejs.org/en/
There are some details about mixing ASP and Node on Azure here: Mixing node.js and ASP.NET projects in a single Azure Web Role?

What is the purpose of template engines in Java?

I'm an android developer and about two years and recently I've been thinking about building web applications. So I started researching about spring boot and everything is great. Then, I came across this thing called template engines (thymeleaf) which by definition separate your code from presentation.
What is confusing me is how can a backend server have html? should the presentation be handled by html, css and javascript in the front end? I even saw tutorials where they actually type in html code in their controller as return values.
My understanding is that the backend server exposes APIs for the frontend to use by using AJAX and the frontend will manipulate this data and present the information on the screen, why would a backend provide html code?
THank you
the frontend will manipulate this data
What front end? You mean the JavaScript code in the HTML page? Where did that come from? Oh yeah, the server.
It is the server that serves the HTML pages to the client, as well as any .js and .css files.
The server could provide static pages, and anything dynamic is handled by JavaScript. Or, the server could dynamically build the HTML page, using ... you guessed it ... a template engine.
You generally don't want JavaScript to build the page initially, just to use JavaScript for handling any dynamic behavior. Some pages don't even need any dynamic behavior.
Unless of course you're thinking about single-page applications (SPA), where there is only one root HTML page, and everything else is built client-side with JavaScript and AJAX calls, but most web applications are not SPAs.
Thymeleaf replaces JSP by providing HTML pages using a template engine. The controller requests the HTML file and Spring Boot provides that template after building it using the Model provided.
Thymeleaf is great because it allows you to rebuild templates on the fly. Lets say for example you're showing a users points to them on the front end, but maybe the points increase or decrease.
What you can do is build the template in the background using a Model. The Model reference is magically provided to the template provided which parses it.
#RequestMapping(...)
public String request(Model model) {
model.put("points", 5);
return "my-template.html"
}
Then use the Thymeleaf language to provide your object to the HTML file to be processed in the engine during runtime.
<html..>
<head>...</head>
<body>
<h1 th:text="${points}"></h1>
</html>
Spring Boots Template engine will build this in the background and present it to the user, but it will show the actual points to the end user! Hope this helps a tiny bit.
I know this question has been answered pretty effectively so far, but I want to add my two cents in as I work with Thymeleaf often.
The easiest way to think about a template engine is that it allows some dynamic development of html based on information passed to it by the controller method. This allows you to put logic in that normally wouldn't exist, or say display a certain section if a user is perhaps logged into admin.
If web pages were houses, html is the frame, css is the walls, Javascript is the lights and electricity, and a template engine would pretty much just be the architect designing the plans on the fly before the frame was built based on desires of the buyer of the house (user inputs).
OK, newer Apps and websites may just load/boot/open once and then pull or push data via AJAX requests, this is good, it saves traffic and it is fast.
But it has not always been like this and some Frameworks still don't build everything on small requests. Spring in Java or Symfony in PHP are MVC Frameworks and use template engines to build pages. This may sound a little outdated but there is still a lot of websites using this.
And if you build a web app for a customer with slow PCs or other devices and the page contents are performance heavy you might want to do as much work as possible on the server so that the user does not have to wait for long. And also you can cache the rendered pages. There is even server side rendering of react pages to e.g. make the initial page load faster...
With Java and Spring I did just use JSP I don't know thymeleaf. Just use what you like and maybe what is most supported/documented.
And building websites like this does not mean you cannot use AJAX, but if you use templates you need to think about what makes sense.
What is confusing me is how can a backend server have html?
The "back end" must have HTML, because that's what's delivered to, and rendered by, the client.
It may just be that the back end "server" is just a CDN delivering, say, an HTML/JS SPA, but there's still something delivering content to the browser.
That said: server-side rendering is still a thing, and has had a resurgence lately--a React app may have its initial rendering done on the server so again the client gets a page rendered with both HTML and associated data, and then starts acting like a normal SPA.
My understanding is that the backend server exposes APIs for the frontend to use by using AJAX and the frontend will manipulate this data and present the information on the screen, why would a backend provide html code?
Because something needs to run the JS to access those APIs.
Some history:
Browsers used to suck. JS used to be a neat add-on, sites were relatively static, and essentially all rendering was done on the server. The back end would get data from wherever it got data from and generate complete HTML pages, and there was little happening on the client side other than some form fields, maybe some validation, and that was about the extent of it.

How to use python in a JS based app

I have created an app using meteor.js framework. I need to run some python code for some important data crunching that will be used in the app. How can I do that? I am really new to Javascript and cant figure this out. I will be running python code on server. All I need is, as soon as I click a particular button, a piece of python code gets compiled.
You'll need to expose your Python code over some sort of API. Since your Python is "running on the server" as you mentioned.
The fastest way I can think of doing it is to setup an AWS Lambda function (https://aws.amazon.com/lambda/), then expose it as an API route using AWS API Gateway(https://aws.amazon.com/api-gateway/).
Once your "number crunching" is completed, you'll need to return the relevant variables back to your client app. JSON is probably a good choice for this.

Integrate nodsjs as embedded website in wordpress

I need some help.
I'm kind of new to javascript, but I built a flight search single page application using nodejs and angularjs and the Skyscanner API.
Now I would like to integrate this application as an embedded website in a wordpress in order to enjoy the advantages of wordpress. Does anybody have experience with this? Do the two system compete? Whats the best way to do this?
As wordpress is based on php, I guess there should be some troubles, maybe you know a turnaround.
Thanks in advance!
WordPress itself is written in PHP but whatever frontend you build with it can access your API written in Node, either directly from Angular or indirectly via PHP.
If you can get your Angular app embedded in WordPress then you shouldn't have problems accessing your Node API from it (keep in mind that you may need to configure CORS correctly).
But whether you can get your Angular app embedded in WordPress may be a big "if".
You can either use an iframe in order to embed a page that you're running in your Node.js environment or just provide some APIs from your Node.js server and call them from WordPress the way you prefer (jQuery, Angular.js or whatever). I don't see any particular issue about running an Angular app in WordPress.

Creating a dynamic web page using AngularJS, WCF Service and SQL Server

I want to create a web application and I am exploring how I could do this. So I came across AngularJS. I want to use WCF Service and SQL Server in my application also. I am trying to find what AngularJS, WCF Service, SQL Server can do for me because I do not want change technologies in the middle of my project after discovering that AngularJS cannot do things which I want my application to do.
So, my question is can AngularJS help me create Static web pages and Dynamic web pages?
I can start my project in ASP.NET MVC but I want to explore AngularJS and want to find out what it is.
My project is about
Sending E-mails
Displaying content from database (in any manner using Ajax)
Voice chat, Video chat, Text chat
Can contain Javascript, jQuery, CSS, HTML5
Tell me something about it. Any suggestions?
Thanks
Your question is vague, but I'd suggest using Microsoft WebAPI instead of WCF or even ASP MVC, due to the from the ground up RESTful design of WebAPI and much easier configuration.
Using this approach, you'll still be able to query SQL Server in C# using WebAPI, so you won't need to switch your database.
There's very little documentation by comparison for querying non-RESTful web services, so you'll gain a huge advantage in terms of tutorials, blogs, etc. by going this route.
Please see below for your questions:
Can AngularJS help me create Static web pages and Dynamic web pages?
Yes certainly it can. Check it out at the official website
2.Sending E-mails
This should be the server side responsibility using an e-mail client, for instance SMTP client
3.Displaying content from database (in any manner using Ajax)
Yes, it certainly can.
4.Voice chat, Video chat, Text chat
Try WebRTC first to see if it's sufficient for your tasks
5.Can contain Javascript, jQuery, CSS, HTML5
Yes, you can use whatever you want as long as you are sure about what you are doing.
I hope following guidelines will help you.
When you create the project select WebApi template.
Then include angularjs files in the scripts folder.
Use cshtml files,but do as you in html file.
Use angular client side mvc features to build your app fast and performance.
Use the angular http service to call webapi methods.
All the c# specfic features build in the webapi.

Categories