在jquery中访问Web API [英] Access Web API in jquery

问题描述

嗨朋友们，



我是web api的新手。我已经一起创建了WEB API和MVC 4 APP的示例项目。现在当我尝试按如下方式提出请求时，我收到错误：



#jQuery代码。

  function  GetAllEmployees（）{
 jQuery.support.cors =  true ; 
  console  .log（ 输入GetAllEmployees ）; 
 $ .ajax（{
 url：'  http：// localhost：51848 / api / EmployeeAPI'，
类型：'  GET'，
 dataType ：'  json'，
成功： function （数据）{
 WriteResponse（数据）; 
}，
错误： function （x，y，z ）{
 alert（x + '  \ n' + y + '  \ n' + z）; 
} 
}）; 
} 

 XMLHttpRequest无法加载http：/ /本地主机：51848 / API / EmployeeAPI。请求的资源上不存在Access-Control-Allow-Origin标头。因此，不允许来源http：// localhost：51789访问。 

请指导我：

1.为什么我得到这个当web api和aap都在一个解决方案中时出错。

2.我创建了单个web api项目并将其托管在我的本地IIS服务器上并仍然收到相同的错误。





谢谢：）

解决方案

.ajax（{
url：< span class =code-string>' http：// localhost：51848 / api / EmployeeAPI'，
type：' GET'，
dataType：' json'，
成功： function （data）{
WriteResponse（data） ;
}，
错误： function （x，y，z）{
alert（x + ' \ n' + y + ' \ n' + z）;
}
}）;
}

 XMLHttpRequest无法加载http：/ /本地主机：51848 / API / EmployeeAPI。请求的资源上不存在Access-Control-Allow-Origin标头。因此，不允许来源http：// localhost：51789访问。 

请指导我：

1.为什么我得到这个当web api和aap都在一个解决方案中时出错。

2.我创建了单个web api项目并将其托管在我的本地IIS服务器上并仍然收到相同的错误。





谢谢：）

在< system下的API的web.config中添加以下代码。网络服务器>标签

 <   httpProtocol  >  
 <   customHeaders  >  
 <   add     name   =  Access-Control-Allow-Origin    value   =  *    /  >  
 <   add     name   =  Access-Control-Allow-Headers    value   = 内容 - 输入    /  >  
 <   add     name   =  Access-Control-Allow-Methods    value   =  GET，POST，PUT，DELETE，OPTIONS    /  >  
 <   / customHeaders  >  
 <   / httpProtocol  >  
 <  验证    validateIntegratedModeConfiguration   =  false    /  >  
 <   modules     runAllManagedModulesForAllRequests   =  true >  
 < ;  删除   名称  =  WebDAVModule    /  >  
 <   / modules  >  

如果您只想使用jQuery，可以使用curl创建file.php你的其他路径



in localhost：51789

  function  GetAllEmployees（）{
 jQuery.support.cors =  true ; 
  console  .log（ 输入GetAllEmployees ）; 

Hi Friends,

I am new to web api. I have created a sample project of WEB API and MVC 4 APP together. Now when I try to make a request as follows I get the error:

#jQuery code.

function GetAllEmployees() {
    jQuery.support.cors = true;
    console.log("Entered to GetAllEmployees");
    $.ajax({
        url: 'http://localhost:51848/api/EmployeeAPI',
        type: 'GET',
        dataType: 'json',
        success: function (data) {
            WriteResponse(data);
        },
        error: function (x, y, z) {
            alert(x + '\n' + y + '\n' + z);
        }
    });
}

XMLHttpRequest cannot load http://localhost:51848/api/EmployeeAPI. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:51789' is therefore not allowed access. 

Please guide me:
1. why I am getting this error when both the web api and aap are in one solution.
2. I created the single web api project and hosted it on my local IIS server and still getting the same error.


Thanks :)

解决方案

.ajax({ url: 'http://localhost:51848/api/EmployeeAPI', type: 'GET', dataType: 'json', success: function (data) { WriteResponse(data); }, error: function (x, y, z) { alert(x + '\n' + y + '\n' + z); } }); }

XMLHttpRequest cannot load http://localhost:51848/api/EmployeeAPI. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:51789' is therefore not allowed access. 

Please guide me:
1. why I am getting this error when both the web api and aap are in one solution.
2. I created the single web api project and hosted it on my local IIS server and still getting the same error.


Thanks :)

Add the below code in your web.config of your API under <system.webserver> tag

<httpProtocol>
     <customHeaders>
       <add name="Access-Control-Allow-Origin" value="*" />
       <add name="Access-Control-Allow-Headers" value="Content-Type" />
       <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
     </customHeaders>
   </httpProtocol>
   <validation validateIntegratedModeConfiguration="false" />
   <modules runAllManagedModulesForAllRequests="true">
     <remove name="WebDAVModule" />
   </modules>

if you want use only jQuery, you can create file.php with curl for you other path

in localhost:51789

function GetAllEmployees() {
    jQuery.support.cors = true;
    console.log("Entered to GetAllEmployees");

这篇关于在jquery中访问Web API的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！