尝试通过Javascript jQuery调用从Web API URL获取响应时出错

Question

我有这段代码应该从localhost网站获得JSON答案。如果我从Chrome浏览此网址，我会得到一个很好的回复，但如果我尝试从HTML页面运行此代码，我会收到错误（通过VS调试）。

有什么想法吗？

$(document).ready(function () {
  alert("hello");
  var request = $.ajax({
    url: "http://localhost:3157/api/Products",
    type: "GET",
    dataType: "json"
  });
  request.done(function(msg) {
    alert("msg is: " + msg);
  });
  request.fail(function (jqXhr, textStatus) {
    alert("Request failed: " + textStatus);
  });
});

更新 - 添加了xml输出

<ArrayOfProduct xmlns:i="http://www.w3.org/2001/XMLSchema-instance"     xmlns="http://schemas.datacontract.org/2004/07/FirstWebApi.Models">
    <Product>
        <Category>Groceries</Category>
        <Id>1</Id>
        <Name>Tomato Soup</Name>
        <Price>1</Price>
    </Product>
    <Product>
        <Category>Toys</Category>
        <Id>2</Id>
        <Name>Yo-yo</Name>
        <Price>3.75</Price>
    </Product>
    <Product>
        <Category>Hardware</Category>
        <Id>3</Id>
        <Name>Hammer</Name>
        <Price>16.99</Price>
    </Product>
</ArrayOfProduct>

Answer 1

确保respone的{​​{1}}格式为url

Answer 2

为了将json指定为dataType，您必须从端点返回json，否则您将获得解析错误，因为json解析器将被显式调用。

的 Working Demo

的 Broken Demo

注意唯一的区别是端点（html vs json）。

您也可以尝试删除dataType属性，让jQuery自动识别它。

---

由于您的xml在语义上是正确的，因此问题必须在您要发回的标头中。确保回复的内容类型为＆text; xml＆＃39;

的 Live Demo

<强> HTML

<script id='xmlData' type='text/html'>
<ArrayOfProduct xmlns:i="http://www.w3.org/2001/XMLSchema-instance"     xmlns="http://schemas.datacontract.org/2004/07/FirstWebApi.Models">
    <Product>
        <Category>Groceries</Category>
        <Id>1</Id>
        <Name>Tomato Soup</Name>
        <Price>1</Price>
    </Product>
    <Product>
        <Category>Toys</Category>
        <Id>2</Id>
        <Name>Yo-yo</Name>
        <Price>3.75</Price>
    </Product>
    <Product>
        <Category>Hardware</Category>
        <Id>3</Id>
        <Name>Hammer</Name>
        <Price>16.99</Price>
    </Product>
</ArrayOfProduct>
</script>

<强> JS

$.mockjax({
  url: '/testXML/',
  responseTime: 0,
  contentType: 'text/xml',
  responseText: $('#xmlData').text()
});

$(document).ready(function () {
    $.ajax({
        url: "/testXML/",
        type: "GET"
    }).done(function(data, textStatus, jqXHR) {
        alert($(data).find('Product:eq(0) > Category').text());
    }).fail(function (jqXhr, textStatus) {
        alert("Request failed: " + textStatus);
    });
});

Answer 3

在尝试询问某人工作后，我必须做一些不同的事情，并收到“无运输”的错误信息。 从那里我找到了原因＆amp;解决方案here