How do I call a web api method using ajax

Question

0.00/5 (No votes)

See more:

I have the following code:

$.ajax({
type: 'GET',
url: 'http://localhost:51914/PlayerPortal/User/Test',
}).done(function (data) {
self.user(data.userName);
// Cache the access token in session storage.
sessionStorage.setItem(tokenKey, data.access_token);
}).fail(showError);

When I CTRL+click on the url above, the call works.
But when I run it through the webpage, I get
status: 0
statusText: error

How do I debug this? What could be wrong.
Sorry, I am very new to this.

What I have tried:

I have tried everything I can.

I can create a Web API 2 combined with MVC 5 in one solution, but I want separate solutions for each. I come from a WPF/WCF background.

I want a standalone Web API 2 solution and call it from a standalone MVC 5 solution.
Simple, right?

Posted 4-Jan-17 5:00am

Nick Van Tassell

Updated 4-Jan-17 5:44am

v2

Add a Solution

Comments

Pankaj Nikam 4-Jan-17 11:02am

Is the application and the api on the same address?

Nick Van Tassell 4-Jan-17 11:23am

No, they are separate solutions in separate web hosts.

Pankaj Nikam 4-Jan-17 11:35am

I thought about it and I guess that it must be related to CORS. Not sure though.

F-ES Sitecore 4-Jan-17 11:14am

Use the network tab of the browser debugging tools, and also the error console of the browser to see if any errors are happening. As mentioned in the other comment ajax calls only work by default to urls on the same domain so if this is not the case you'll get a CORS error, the solution for which is well documented so google it.

Nick Van Tassell 4-Jan-17 11:26am

Oh yeah! I remember reading about CORS. Thank you.
Do most software shops split their MVC and Web API code into separate solutions or combine them as I have seen example of all over the web?

In the WPF/WCF world, we separate these concerns since CORS is not a problem.

F-ES Sitecore 4-Jan-17 11:43am

As long as you control the web api site it's a simple case of configuring it to allow your front-end site access to its methods, it's easy to do and not a problem, anyone that separates their apis onto a different server\domain has to do this. It's only a problem when you don't control the server of the api you are calling but want to call its methods, however in that case you're doing something the server doesn't want you to do which is why CORS is there in the first place.

Nick Van Tassell 4-Jan-17 11:29am

Would this constitute CORS? I don't think it would since they are both localhost, but different ports:

Web API app: http://localhost:51914/PlayerPortal/User/Test
MVC app: http://localhost:44305/

F-ES Sitecore 4-Jan-17 11:40am

Yes that is CORS as the port is part of the domain URI. If browsers allowed that I could host a site on the same shared server as your site only on a different port and have my site call functions on your site and vice versa.

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Nick Van Tassell · Answer 1 · 2017-01-04T05:44:00

Solution 1

It IS due to CORS: Origin is defined by 1) host, 2) port, and 3) protocol
I guess I'll make it all in one app, like I've seen everywhere else.

Posted 4-Jan-17 5:44am

Nick Van Tassell