Перенаправление на веб-форму с помощью JSON

#javascript #jquery #asp.net #ajax #json

#javascript #jquery ( jquery ) #asp.net #ajax #json

Вопрос:

У меня есть ситуация, когда я не хочу использовать строки запросов для передачи данных на страницу перенаправления.

Текущая реализация, исходная страница:

 window.location = "invaliduser.aspx?u="    encodeURI(username);
 

Я рассматривал возможность использования методологии AJAX, но не уверен, что она будет перенаправлять на страницу.

Целевая страница:

 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="invaliduser.aspx.cs" Inherits="iTask.Organizer.invaliduser" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Invalid User</title>
    <script type="text/javascript" src="Scripts/jquery-2.1.0.js"></script>
    <script src="Scripts/app.utility.js"></script>
    <script src="Scripts/InvalidUser.js"></script>
</head>
<body>
    <h1>Invalid User Account:</h1>
    <p>Your user account ( <span id="pUserName"></span> ) is not properly setup for this application.</p>
    <p>Please contact the <a href="mailto:email@domain.com">Email recipient</a> for further assistance.</p>
</body>
</html>
 

Текущий jQuery:

 jQuery(function ($) {
    $(document).ready(function () {
        var username = decodeURI(getUrlVars().u);
        $("#pUserName").text(username);
    });
});
 

Собирался использовать метод AJAX POST для передачи данных JSON на страницу, но не уверен, сохранится ли он в обратном направлении, так как мне нужно передать данные на страницу (без использования QueryString), в идеале все в одном запросе, чтобы перенаправление было упаковано с данными JSON.

Теоретический пост AJAX / JSON:

 PostJsonUTF8(
    'invaliduser.aspx',
    { data: username },
    function (resp) {
        window.location = "invaliduser.aspx";
    }
);
function PostJsonUTF8(url, data, success) {
    PostAPI('json', 'application/json;charset=utf-8', url, data, success);
}
function PostAPI(type, contentType, url, data, success) {
    if (typeof (success) === 'function') {
        $.ajax({
            type: "POST",
            contentType: contentType,
            dataType: type,
            url: url,
            data: data,
            success: success,
            error: AjaxFail
        });
    }
}
 

Комментарии:

1. Основываясь только на приведенном выше примере использования, что движет «я не хочу использовать строки запроса» ? Выше кажется «нормально» и не уверен, что вы хотите «получить» (?)…

2. Идеальная ситуация заключается в том, что я не хочу явно передавать информацию на страницу через строки запросов. Я знаю, что любой, у кого есть доступ к просмотру сети, может видеть передаваемые данные, но я бы предпочел, чтобы URL-адрес выглядел минимальным, а не имел расширенный URL-адрес с добавленным к нему списком значений QueryString.

Ответ №1:

Вы правы, что вы не можете выполнять обычные перенаправления (коды состояния 301/302) с помощью AJAX. Обычно я настраиваю следующее в своей логике обработки ответов AJAX:

 function tryHandleResponseRedirect(resp, data) {
        if (resp.status == 200 amp;amp; data amp;amp; data.redirect) {
            // force a hard re-direct
            window.location.href = data.redirect;
            return true;
        }
}
 

С которым вы можете справиться, подключив что-то вроде ajaxSuccess функции jQuery:

 $( document ).ajaxSuccess(function( event, xhr, settings, data ) {
    tryHandleResponseRedirect(xhr, data);
});
 

И затем я делаю что-то вроде следующего на стороне сервера в месте, где я могу обрабатывать все исходящие HTTP-ответы:

 public override void OnResultExecuted(ResultExecutedContext filterContext)
    {
        var req = filterContext.HttpContext.Request;
        var resp = filterContext.HttpContext.Response;

        var shouldProcess = (resp.IsRequestBeingRedirected amp;amp; req.IsAjaxRequest());
        if (!shouldProcess)
        {
            base.OnResultExecuted(filterContext);
            return;
        }

        var location = resp.RedirectLocation ?? resp.Headers["location"];
        var json = JsonConvert.SerializeObject(new { redirect = location });

        resp.ClearContent();
        resp.Headers.Remove("location");

        // send back a JSON object indicating a redirect
        resp.StatusCode = 200;
        resp.Write(json);
    }
 

Ответ №2:

Окончательная реализация: ApiController:

 [RoutePrefix( "api/users" )]
public class UsersController : ApiController {

    //GET api/users/netid
    [HttpGet , Route( "get/netid" )]
    public HttpResponseMessage GetUserId () {
        using ( var ctx = new DbContext() ) {
            JavaScriptSerializer s = new JavaScriptSerializer();
            var username = RequestContext.Principal.Identity.Name;

            try {
                var userid = ctx.Get_User_Id( username ).SingleOrDefault();

                if ( userid == default( string ) ) {
                    return this.BadRequestResponse( s.Serialize( new { username=username } ) );
                } else {
                    return this.OKResponse( s.Serialize( userid ) );
                }
            } catch ( Exception ex ) {
                return this.InternalServerResponse( ex );
            }
        }
    }
}
 

Javascript:

 /**** 
Return a well formatted API URL for Users
---------------------------------------------
    ~/api/users/get/netid
****/
function ApiGetUsersUrl() {
    return 'api/users/get/netid';
}

$(document).ready(function(){
    ....

    GetJsonUTF8(
        ApiGetUsersUrl(),
        function (resp) { //Success Function
            userid = JSON.parse(resp);

            //Cache Common Templates

            //Load Team DropDownList
            LoadTeamDropDownList();
        },
        null,
        function (xhr, status, err) { //Error Function
            console.log(JSON.parse(xhr.responseJSON).username);

            window.location = "invaliduser.aspx";
        });
   ....
}
 

Страница Html / Aspx (invaliduser.aspx):

 <!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Invalid User</title>
</head>
<body>
    <h1>Invalid User Account:</h1>
    <p>Your user account ( <%=Request.LogonUserIdentity.Name %> ) is not properly setup for this application.</p>
    <p>Please contact the <a href="mailto:user@domain.com">User Name</a> for further assistance.</p>
</body>
</html>
 

Если вам нужна ссылка на вспомогательную функцию GetJsonUTF8 , перейдите к IT Hobbit — jQuery / Ajax Helper