首页 > 解决方案 > Ajax 帖子在 Firefox 中不工作,但在 chrome 中工作

问题描述

我是 ReactJs 的新手,我正在尝试从 webAPI AJAX 帖子中获取一些数据

我的代码在 Chrome 中运行良好,但在 Mozilla fire fox 中它不起作用如果我删除 $.ajax api 中的标题部分,则调用它的工作但标题不是。请帮助我缺少什么或它将如何在 Firefox 或 chrome 中运行。

在我的 userTypeAPI.js 类中

export const constgetUsertype = (authenticationKey) => {
    return getUsertype(authenticationKey);
};
$.support.cors = true;
function getUsertype(authenticationKey) {
    var returnvalue = '';
    $.ajax({
        url: usertypeURL + "/getUserType",
        type: "POST",
        async: false,
        beforeSend: function (xhr) {
            xhr.withCredentials = false;
        },
        xhrFields: {
            withCredentials: false
        },
        crossDomain: true,
        headers: {
            "AuthenticationKey": authenticationKey
        },
        //contentType: 'application/json',
        contentType: "application/x-www-form-urlencoded",
        dataType: "json",
        success: function (data) {
            returnvalue = data.d;
        },
        error: function (request, error) {
            debugger;
            alert(error);
            returnvalue = "";
        }
    });
    return returnvalue;
}

在 react.jsx 类中

import * as userTypeAPI from '../UserTypeAPI';


    componentDidMount() {
        var usertypes = userTypeAPI.constgetUsertype(sessionStorage.getItem('AuthenticationKey'));

        this.setState({
            options: usertypes
        });
}

在 webAPI 控制器类代码是

 [RoutePrefix("api/UserType")]
    [EnableCors(origins: "*", headers: "*", methods: "*")]
    public class UserTypeController : ControllerBase
    {
        TaskUserType taskUserType = new TaskUserType();

        [HttpPost]
        [ActionName("getUserType")]
        public object getUserType() //Parameter is EntityUserType because we pass UserType information for get list of task
        {
            try
            {
                var requestId = string.Empty;
                var AuthenticationKey = string.Empty;
                var re = Request;
                var headers = re.Headers;
                if (headers.Contains("AuthenticationKey"))
                {
                    AuthenticationKey = headers.GetValues("AuthenticationKey").First();
                }

                long userId = 0;

                if (!Authenticated(AuthenticationKey))
                    return Ok("Unauthorize user");
                else
                    userId = Convert.ToInt64(dtSession.FirstOrDefault().User_Id);

                Dictionary<string, object> returnDict = new Dictionary<string, object>();
                List<EntityUserType> lstUserTypes = new List<EntityUserType>();
                lstUserTypes = taskUserType.getAllUserTypes();
                returnDict = new Dictionary<string, object>();
                returnDict.Add("d", lstUserTypes);
                return returnDict;
            }
            catch (Exception ex)
            {
                return ex.Message;
            }
        }
   }

webAPI的配置是

    <httpProtocol>
      <customHeaders>
        <add name="Access-Control-Allow-Origin" value="*" />
        <add name="Access-Control-Allow-Headers" value="Overwrite, Destination, Content-Type, Depth, User-Agent, Translate, Range, Content-Range, Timeout, X-File-Size, X-Requested-With, If-Modified-Since, X-File-Name, Cache-Control, Location, Lock-Token, If" />
        <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
        <add name="Access-Control-Allow-Credentials" value="true" />
      </customHeaders>
    </httpProtocol>

我已经检查 了在 Chrome 中工作的 $.ajax 帖子,但不是在 Firefox链接中,但这里显示 event.preventDefault(); 在我的代码中没有任何事件。

标签: javascriptajaxreactjsasp.net-web-api

解决方案


推荐阅读