I have a fully operational ASP.NET Webform application (.aspx) that sends and retrieves data to the server (CodeBehind) using jQuery AJAX. For my next project I need to recreate this application but with Phonegap to make it mobile and platform independent.
I'm trying to use the same CodeBehind file that handles the database connection and all the needed methods to make the application work.
// File-structure
Application
App_Code
pages
Default.aspx (with codebehind)
phonegapapp
www
- index.html (with jquery AJAX calls)
...
From the index.html file I'm trying to make a connection to the Default.aspx.cs file to access the necessary functions:
// phonegapapp/www/index.html
$(function () {
$.ajax({
type: "POST",
...
url: "../../Default.aspx/testFunction",
// tried with only one ../ and going to root and follow file structure but non is working.
...
});
});
I get an error showing that the file is not found:
XMLHttpRequest cannot load file:///C:/Application/pages/Default.aspx.cs/testFunction. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
You cant execute/access aspx files wihtin phonegap app. Simply you have to put your aspx files behind an Asp.Net supporting webserver such as IS and then you load call ajax with relative path, like http://localhost/default.aspx and then you will be able to get the response.
Related
I am new to electron and developing desktop application using .NET core.
I have implemented Partial view and calling through AJAX but AJAX is not working in electron desktop app and it is working fine in browser.
And when I did auto refresh of Partial view, it is working smooth in browser but page is blinking/flickering in electron desktop app. Can anyone help me out from this. Thanks!
I have used this code for auto refresh Partial view:
<script>
function AutoRefresh( t ) {
setTimeout("location.reload(true);", t);
}
</script>
<body onload="Javascript:AutoRefresh(7000);">
This code I have used for Partial Ajax but it is not working in electron desktop app:
<script type="text/javascript">
$("#btnAddMappingKey").click(function() {
var mappingKey = $("#addMappingKeyForm").serialize();
$.ajax({
type:"POST",
url: "/Home/GetAccessKey",
data: mappingKey,
success: function(response) {
console.log("Success");
window.location.reload();
}
})
});
</script>
public async Task<IActionResult> GetAccessKey()
{
UtilityViewModel utilityView = new UtilityViewModel();
// Written logic
return PartialView("_ShowCompany", utilityView);
}
This is an old question, I am not sure if you got the answer yet but this might help others who are wondering about this.
Electron is a desktop development environment based on Node that allows you to use Node and Javascript to create cross-platform desktop application. It does this by running the Chromium browser in a kind of a virtual environment and exposing platform APIs to it.
It does not however run a HTTP server and that's why your Ajax calls (They are http calls) are not working.
What you need to do instead is use Electron-style data communication system> I.e. create a function in javascript at the front-end and fetch data using preload scripts that pull the data from the database or wherever you have it.
Instead of Ajax, you have to create functions in the renderer preload script and expose it to the main world. Check this article
https://www.electronjs.org/docs/latest/tutorial/context-isolation
I am invoking API calls to get JSON data from server using javascript.
$(function () {
var customersTable = $('#Customers');
var returnCustomersTable = UpdateDataTable(customersTable, "/Customers/Loaddata");
}
This works fine when I am working with Visual studio Dev environment , because my web application is on root and so all javascripts Works fine.
Example:
My WebSite URL: http://localhost:4391
API Calls will be: http://localhost:4391/Customers/Loaddata
This works fine.
But when I deploy application to IIS, my website URL will be,
My WebSite URL: http://localhost/MyAppName
But API calls would still be,
API Calls will be: http://localhost/Customers/Loaddata, which results in not found.
Since I am using javascript in a separate file , I wont be able to do URL.Action.
The other option would be to create a base URL for dev and prod and the append with each servcie call.
But I am thinking if there is any other way.
The routing configuration in ASP.NET MVC is designed to serve as the single place in the application where all of the URLs can be maintained.
It helps considerably with maintenance of the project if all URLs are generated using routing through one of the UrlHelper based methods, such as Url.Action() rather than hard coded in controllers and views.
As long as your JavaScript is in an MVC view, you can just resolve Url.Action inline.
$(function () {
var customersTable = $('#Customers');
var returnCustomersTable = UpdateDataTable(customersTable,
'#Url.Action("Loaddata", "Customers")');
}
If the JavaScript is in a separate file outside of MVC, consider passing the URL through a variable or function parameter.
This routing feature also makes it easier to deploy ASP.NET MVC, because the generated URLs will adapt to use the application path when the application is not deployed to the root website virtual directory.
Application running in IIS web site root:
/Customers/Loaddata
Application running in virtual subdirectory configured as IIS Application named "MyAppName":
/MyAppName/Customers/Loaddata
I'm very new to web development but I wanted to create a web api for an existing Windows Service application I created for work.
My goal right now is to create a simple web app consisting of some text input fields where someone can enter their email and subscribe to a mailing list.
I was pointed in the direction of using OWIN to self-host a web api in my existing project so I looked at this guide to get started:
https://www.asp.net/web-api/overview/hosting-aspnet-web-api/use-owin-to-self-host-web-api
This guide shows the console app calling and displaying the API, but I wanted to do the same from a web app. So I tried to do what is accomplished here in the 'Getting Started with ASP.NET Web Api 2' guide using a console application with OWIN.
When I start my console application, I can enter http://localhost:8080/api/values/1 and I get <string xmlns="http://schemas.microsoft.com/2003/10/Serialization/">value</string> Which I assume means the web server is running and responds to the request to get my string value that I'm returning from my ValuesController.
However I've been trying to create a simple web page that calls the API to get the value but I haven't been able to figure it out.
Right now my index.html has the following in the body:
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.0.3.min.js"></script>
<script>
var uri = "http://localhost:8080/api/values/1";
$(document).ready(function () {
$.getJSON(uri)
.done(function (data) {
$('#value').text("done");
})
.fail(function (jqXHR, textStatus, err) {
$('#value').text('Error: ' + err);
});
});
</script>
And I just get Error: printed on the page. Again I'm new to working on web related technologies so any guidance would be much appreciated.
Ok so, following the discussion in comments (helping you to debug the app).
The cross-origin security policy in browsers restricts web pages from calling an data source that exists on a different domain. A domain is either a different url, or a different port at the same url.
http://localhost:80
is a different url/domain from:
http://localhost:81
There are two solutions to this, either utilise JSONP, or CORS to make the request to the api, JSONP basically wraps your json data up in a function call. When the api call returns, it executes the callback/function call, bypassing the security restriction.
However, both JSONP and CORS require server support, which brings solution 2...
Serve up the webpage you are trying to use from the API, meaning you server it from the same domain, hence no cross-domain issues!!
Glad you have got it sorted, I know it can be frustrating with web calls.
I have an .NET application that uses mostly AngularJS, but for getting some things to work on IE9 we used sometimes a Jquery plugin to fix it (e.g. file upload)
Then on the other side there is an API that handles that application. But the API and the App won't be running on the same urls, so as good practice I would love to have 1 place where all the URl's can be set for where the API is where you can find the videos, ....
but how can I handle all this?
If i set them on the angular side, the controller is loaded after the JQuery,
so the value is undefined.
It can't read the web.config because it's just plain html files that are getting loaded. so no support from C#.
And didn't find any way on loading it in via JQuery.
Any suggestion on how to do this?
You can set it as a basic Object so scripts outside of Angular can use it. When you need to use it in the app, you can either require it directly or set it as a constant or create a service using it.
For example,
var api = {
baseUrl: 'www.moo.com/api/v1',
dogs: '/dogs',
cows: '/cows'
};
alert('This alert was created prior to angular module declartion with your api: ' + api.baseUrl);
angular.module('myCheeseIsGoodApp', [])
.constant('apiConstant', api)
.controller('TestController', ['$scope', 'apiConstant', function($scope, apiConstant){
$scope.apiConstant = apiConstant;
}]);
Here is a plunkr to check out how it works.http://plnkr.co/edit/fnqcwHxgxgrZlCpryMiC?p=preview
Keep in mind this was just a quick way to show you how to use it, but you may want to make it a bit more elegant.
Basically, I have a need for a c# server to be able to send data back to an HTML5 webpage which has previously send data to the server. The server is retrieving data from another application and this data then needs to be send to the webpage to be displayed.
This c# server is running on .NET CF 3.5 so websockets are not an option (not supported).
I have seen some suggestions elsewhere but nothing which fits the necessary criteria for this particular situation. Most other implementations seem to work on the basis that the webpage will only be waiting for this data to be sent over.
Any and all suggestions welcome!
If websockets are not an option then you are left with Comet.
Client-side you could do something like this :
(function poll(){
$.ajax({
url: "url",
success: function(data) { /*display data*/ },
complete: poll,
timeout: 30000 });
})();
Which means an ajax request will be sent every 30 seconds.
This is not as performant as websockets but it works quite well.
Create an .aspx page and remove all the HTML from it. Call it GetData.aspx
In the code behind of GetData.aspx.cs you can receive the POST data from the HTML5 page.
Do work.
Use jquery.
$.post("GetData.aspx",{name: value},function(json){
// put processing instructions here.
});
There are two ways to do this :
Using a ASP.NET web-page
Create HTML element that calls a javascript function
Inside of the javascript function, use ajax to make a POST to a ASP.NET Web Page (that uses C# as back-end)
Get the returned value in the ajax "success" block.
Use as you wish...
Using a jSON string return
Create HTML element that calls a javascript function
Inside of the javascript function, use ajax to make a POST to a Web Service (that uses C# as back-end), that returns a jSON string.
Use the returned jSON data in which ever way needed.
I personally prefer jSON, as it emulates a data set, and works well with HTML and ajax.