使用 ajax asp.net 调用 Web 服务
Posted
技术标签:
【中文标题】使用 ajax asp.net 调用 Web 服务【英文标题】：Call a web service whith ajax asp.net 【发布时间】：2021-05-27 15:17:01 【问题描述】：我有一个问题：
我尝试调用一个用 VB.NET 编写的 Web 服务：
Imports System.Web.Services
Imports System.Web.Services.Protocols
Imports System.ComponentModel
Imports Newtonsoft.Json
<System.Web.Script.Services.ScriptService()>
<System.Web.Services.WebService(Namespace:="http://tempuri.org/")>
<System.Web.Services.WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)>
<ToolboxItem(False)>
Public Class WebService1
Inherits System.Web.Services.WebService
<WebMethod()>
Public Function Popola(cia As String) As Object
Dim p1 As New Persona
p1.cognome = cia
p1.nome = "mario"
p1.eta = 22
Dim p2 As New Persona
p2.cognome = "bianchi"
p2.nome = "luca"
p2.eta = 99
Dim list As New List(Of Persona)
list.Add(p1)
list.Add(p2)
Return JsonConvert.SerializeObject(list, Formatting.Indented)
End Function
之所以有效，是因为我在其他程序中使用它。
问题是在另一个程序WebForm1.aspx 中，我尝试用Ajax 调用它
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm1.aspx.vb" Inherits="WebApplication2.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" />
<link href="StyleSheet1.css" rel="stylesheet" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script type="text/javascript">
$(document).ready(function ()
$("#button_login").click(function () // al click del bottone
$.ajax(
type: "POST", // il method
url: "http://localhost/WebService1.asmx/Popola", // la action
data: cia: 88 ,
contentType: "application/x-www-form-urlencoded",
dataType: "json",
success: function ()
alert("ok")
,
error: function ()
console.log(arguments);
console.log("error");
);
);
);
</script>
</head>
<body>
<form runat="server">
<div class="container">
<div class="row">
<div class="col-sm-6">
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Button ID="button_login" runat="server" Text="Button" />
</div>
</div>
</div>
</form>
</body>
</html>
但是每次它进入Ajax，我都会从函数中得到一个错误：
从源“http://localhost”访问“http://localhost/WebService1.asmx/Popola”的 XMLHttpRequest 已被 CORS 策略阻止：不存在“Access-Control-Allow-Origin”标头请求的资源。
我能做什么？
【问题讨论】：
【参考方案1】：据我了解，您编写的代码属于同一个项目。所以你可以像下面这样修改调用
更改下面的行
url: "http://localhost/WebService1.asmx/Popola",
到
url: "WebService1.asmx/Popola",
它应该可以工作。
【讨论】：
不，不幸的是，它们是 2 个不同项目的 2 个不同代码，我删除了 localhost 的代码但不同。我忘了指定 您正在编写 webmethod 的应用程序是什么类型的。你需要在那边implement CORS policy。【参考方案2】：看来你需要使用JSONP作为数据类型和crossDomain=true如下：
$.ajax(
type: "POST",
url: "http://localhost/WebService1.asmx/Popola",
data: cia: 88 ,
contentType: "application/x-www-form-urlencoded",
dataType: "jsonp",
crossDomain:true,
success: function ()
alert("ok");
,
error: function ()
console.log(arguments);
console.log("error");
);
见：Ajax Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource
【讨论】：
以上是关于使用 ajax asp.net 调用 Web 服务的主要内容，如果未能解决你的问题，请参考以下文章
如何使用 ajax 从跨域调用 asp.net Web 服务
对 ASP.NET Web 服务的 jQuery ajax POST 调用随机失败
使用 ajax() 和 jsonp 调用 asp.net 远程 Web 服务 .asmx 时出现意外令牌 <
如何使用 ASP.NET C# 在使用 ajax 完成 Web 服务时生成警报