如何使用asp.net MVC中的href从javascript在新窗口中打开打开的窗口答案

【问题标题】：How to open open window in new window from javascript using href in asp.net MVC如何使用asp.net MVC中的href从javascript在新窗口中打开打开的窗口
【发布时间】：2018-03-03 01:25:25
【问题描述】：

我有以下代码，我从我的 asp.net MVC 视图中打开一个外部 url 链接。

现在我必须在打开链接时添加一个条目。我的想法是我应该通过一些 javascript 函数来执行此操作，该函数将调用 ajax 调用到我的 web api 控制器，然后打开一个新的 url 窗口

 @{
            var token = Session["SecurityToken"] as AppSecurityToken;
            if (token != null && token.Claims != null)
            {
                foreach (var claim in token.Claims)
                {
                    if (!String.IsNullOrWhiteSpace(claim.Description))
                    {
                        string imagepathv = Url.Content("~/") + "images/" + claim.Name + ".png";
                        string hreftext = $"{claim.Description}?sessionid={token.SessionId}";
                        <li>
                            <a href="" onclick="UserNameAccess('@hreftext');">
                                <img src="@imagepathv" />
                            </a>
                        </li>
                    }
                }
            }
        }


<script lang="javascript" type="text/javascript">
        function UserNameAccess(input) {
            window.open(input, "_blank");


            var baseSiteUrl = '@ConfigurationManager.AppSettings["WebApiBaseUrl"]';
            var request = { "email": "sadasd", "firstname": "asdasd", "lastname": "dasdasda" };

            $.ajax({
                type: "POST",
                url: baseSiteUrl + "DataAccessApi/LogUserClaimAccesshistory",
                data: JSON.stringify(request),
                datatype: "text",
                contentType: "application/json",
                success: function (resultData) {
                    var responseJson = resultData;
                    if (responseJson.Success === true) {
                        alert("success");
                    }
                    else {
                        alert("error1");
                    }
                },
                failure: function (error) {
                    alert(error);
                },
                error: function (jqXhr, textStatus) {

                    if (textStatus === 'timeout') {
                        alert("Request Timeout");
                        //do something. Try again perhaps?
                    } else {
                        alert(jqXhr.statusText);
                    }
                },
                timeout: 30000 // sets timeout to 3 seconds
            });
        }
    </script>       


 public class DataAccessController : ApiController
    {

        [Route("DataAccessApi/LogUserClaimAccesshistory")]
        public MyJsonResponse LogUserClaimAccesshistory(UserClaimHistory request)
        {
            MyJsonResponse result = new MyJsonResponse();
            return result;
        }
    }   


    public class MyJsonResponse
    {
        [JsonProperty]
        public bool Success { get; set; }

        [JsonProperty]
        public string Message { get; set; }

        [JsonProperty]
        public string CustomInfo { get; set; }
    }


    public class UserClaimHistory
    {
        [JsonProperty("email")]
        public string Email { get; set; }

        [JsonProperty("firstname")]
        public string FirstName { get; set; }

        [JsonProperty("lastname")]
        public string LastName { get; set; }
    }

【问题讨论】：

我无法理解您想要达到的目标，也无法为什么 ...？
在href点击调用一个web api然后打开一个链接
什么网络 API ？你怎么称呼它？你使用图书馆吗？它返回什么？
如果您在调用 API 的方式方面需要帮助，请向我们提供有关您想要实现的目标的更多信息。
我认为这样最好。使用a 标记来完成它的设计目的是保持代码可读性的最佳方式。很高兴我帮助了:-)

标签： javascript ajax asp.net-mvc asp.net-web-api href

【解决方案1】：

你为什么不使用下面的代码？让a标签做网页打开，而JS负责API调用。

更新答案：

@{
    var token = Session["SecurityToken"] as AppSecurityToken;
    if(token != null && token.Claims != null)
    {
        foreach(var claim in token.Claims)
        {
            if(!String.IsNullOrWhiteSpace(claim.Description))
            {
                string imagepathv = Url.Content("~/") + "images/" + claim.Name + ".png";
                string hreftext = $"{claim.Description}?sessionid={token.SessionId}";
                <li>
                    <!-- We use the <a> tag to handle the new page opening -->
                    <a href="@hreftext" onclick="UserNameAccess();" target="_blank">
                        <img src="@imagepathv"/>
                    </a>
                </li>
            }
        }
    }
}

<!-- The javascript completly ignores the new page, and only focus on the API call -->
<script lang="javascript" type="text/javascript">
    function UserNameAccess()
    {
        var baseSiteUrl = '@ConfigurationManager.AppSettings["WebApiBaseUrl"]';
        var request = { "email": "sadasd", "firstname": "asdasd", "lastname": "dasdasda" };

        $.ajax({
            type: "POST",
            url: baseSiteUrl + "DataAccessApi/LogUserClaimAccesshistory",
            data: JSON.stringify(request),
            datatype: "text",
            contentType: "application/json",
            success: function(resultData)
            {
                var responseJson = resultData;
                if (responseJson.Success === true)
                {
                    alert("success");
                } else
                {
                    alert("error1");
                }
            },
            failure: function(error)
            {
                alert(error);
            },
            error: function(jqXhr, textStatus)
            {
                if (textStatus === 'timeout')
                {
                    alert("Request Timeout");
                    //do something. Try again perhaps?
                } else
                {
                    alert(jqXhr.statusText);
                }
            },
            timeout: 30000 // sets timeout to 3 seconds
        });
    }
</script>

【讨论】：