- Details
- Written by: Stanko Milosev
- Category: Core
- Hits: 1000
<!DOCTYPE html> <head> <meta charset="utf-8" /> <script defer type="text/javascript" src="lib/jquery-3.5.1.js"></script> <script defer type="text/javascript" src="js/index.js"></script> </head> <body> <button id="button" type="button">Click Me!</button> </body>index.js:
$( "#button" ).click(function() {
var json = JSON.stringify({"cities": ["Aurel Vlaicu", "Asquins", "Arnoldstein"]});
$.ajax({
url: "api/Empty/",
type: "POST",
data: json,
dataType: "json",
contentType: "application/json; charset=utf-8",
success: function (data) {
alert("Success.");
}
}).done(function (data) {
try {
json = $.parseJSON( JSON.stringify(data));
} catch (e) {
alert("Error not JSON. " + e.message)
}
}).error(function (xhr, ajaxOptions, thrownError) {
alert("Error.");
}).fail(function (data) {
alert("Sorry. Server unavailable. ");
});
});
.NET side:
[HttpPost]
public ActionResult Get([FromBody] Filter filter)
{
string returnValue = string.Empty;
foreach (var city in filter.cities)
{
returnValue = $"{city}, {returnValue}";
}
return Ok(JsonSerializer.Serialize(returnValue));
}
Notice that in "$.ajax.done" I added try..catch block, and JSON.stringify because of dataType: "json" jQuery will automatically parse string into JSON.
- Details
- Written by: Stanko Milosev
- Category: Core
- Hits: 1165
<!DOCTYPE html> <head> <meta charset="utf-8" /> <script defer type="text/javascript" src="lib/jquery-3.5.1.js"></script> <script defer type="text/javascript" src="js/index.js"></script> </head> <html xmlns="http://www.w3.org/1999/xhtml"> <button id="button" type="button">Click Me!</button> </html>index.js:
$( "#button" ).click(function() {
var json = JSON.stringify({"cities": ["Aurel Vlaicu", "Asquins", "Arnoldstein"]});
$.ajax({
url: "api/Empty/",
type: "POST",
data: json,
contentType: "application/json; charset=utf-8"
}).done(function (data) {
alert("Success.");
}).fail(function (data) {
alert("Sorry. Server unavailable. ");
});
});
Asp.Net core API:
using Microsoft.AspNetCore.Mvc;
namespace AspDotNetCorePostExample.Controllers
{
[Route("api/[controller]")]
[ApiController]
public class EmptyController : ControllerBase
{
[HttpGet]
public string Get()
{
return "Hello world";
}
[HttpPost]
public string Get([FromBody] Filter filter)
{
string returnValue = string.Empty;
foreach (var city in filter.cities)
{
returnValue = $"{city}, {returnValue}";
}
return returnValue;
}
public class Filter
{
public string[] cities { get; set; }
}
}
}
Notice in jQuery that in Ajax call I didn't add dataType: "json" since my API returns string and not JSON. In API notice [FromBody] in method signature, and Filter class which is defined exactly the same as JSON var json = JSON.stringify({"cities": ["Aurel Vlaicu", "Asquins", "Arnoldstein"]}); which I am sending to API.
Example download from here
- Details
- Written by: Stanko Milosev
- Category: Core
- Hits: 1142
Choose ASP.NET Core Web Application:
Choose "Empty":
Since I am not using reSharper, I had to create "Controllers" folder manually. Open some file from solution and right click on tab and open containing folder:
Create new folder and name it "Controllers":
Your folder structure now should look like:
In "Controllers" folder in create new file, and Name it like EmptyController.cs, write something like
using Microsoft.AspNetCore.Mvc;
namespace AspDotNetCorePostExample.Controllers
{
[Route("api/[controller]")]
[ApiController]
public class EmptyController : ControllerBase
{
[HttpGet]
public string Get()
{
return "Hello world";
}
}
}
In AspDotNetCorePostExample\AspDotNetCorePostExample\Startup.cs in method "Configure" delete:
app.UseEndpoints(endpoints =>
{
endpoints.MapGet("/", async context =>
{
await context.Response.WriteAsync("Hello World!");
});
});
Instead write:
app.UseEndpoints(endpoints =>
{
endpoints.MapControllers();
});
In ConfigureServices add services.AddControllers();
Start solution and go to like "https://localhost:44336/api/Empty" (just add /api/Empty)
If you like you can manually add wwwroot folder, and use him like I already explained here. Here is new Startup.cs, and to disable HTPPS go to project properties -> Debug -> uncheck "Enable SSL":
- Details
- Written by: Stanko Milosev
- Category: Core
- Hits: 1323
app.UseStaticFiles();When deploying in order to show default document, add following line:
app.UseDefaultFiles();My whole Startup.cs looks like this:
using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.Mvc;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.DependencyInjection;
namespace AllPics2gMaps
{
public class Startup
{
public Startup(IConfiguration configuration)
{
Configuration = configuration;
}
public IConfiguration Configuration { get; }
// This method gets called by the runtime. Use this method to add services to the container.
public void ConfigureServices(IServiceCollection services)
{
services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_1);
}
// This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
}
else
{
app.UseHsts();
}
app.UseHttpsRedirection();
app.UseMvc();
app.UseDefaultFiles();
app.UseStaticFiles();
}
}
}
UPDATE; Please note thatStartup.cs has been changed, refer to this article.