JS调用WebMethod报cannot read property of undefined (reading 'ajax')错误原因

问题原因及解决方案 #

• 核心错误：WebMethod 禁止声明为静态方法
  ASMX 服务的WebMethod必须是实例方法，你当前代码给HelloWorld方法加了static修饰符，直接去掉即可。
• 缺少JSON调用支持特性
  要允许前端以JSON格式请求ASMX接口，需要给服务类添加[ScriptService]特性，否则会拒绝对应格式的请求。
• Web.config配置缺失
  需要确认Web.config中开启了ASMX的POST请求支持，添加对应配置项即可：

<system.web>
  <webServices>
    <protocols>
      <add name="HttpPost"/>
    </protocols>
  </webServices>
</system.web>

• 路径错误
  如果站点部署在虚拟目录下，根路径/WebService1.asmx可能指向错误，建议使用服务端路径解析方法生成正确的请求地址。
• 返回值取值错误
  ASMX 服务开启JSON支持后，返回结果会默认包裹在d字段中，前端取值需要从msg.d中获取实际返回内容。

修正后的服务端代码

using System.Web.Services;
using System.Web.Script.Services;

// 加ScriptService特性支持JSON调用
[ScriptService]
public class WebService1 : WebService
{
    [WebMethod]
    // 去掉static修饰符
    public string HelloWorld()
    {
        return "Hello World";
    }
}

修正后的前端JS代码

function funcGoster() {
      $.ajax({
          type: "POST",
          // 如路径不对可替换为服务端生成的路径：<%= ResolveUrl("~/WebService1.asmx/HelloWorld") %>
          url: "/WebService1.asmx/HelloWorld",
          data: "{}",
          contentType: "application/json; charset=utf-8",
          dataType: "json",
          success: function (msg) {
              document.getElementById('text').innerHTML = msg.d;
          },
          error: function (e) {
              // 输出responseText可查看服务端返回的具体报错信息
              alert("请求失败：" + e.responseText);
          }
      });
}

内容的提问来源于stack exchange，提问作者Coco jombo