Обработка маршрутизации ASP.NET MVC во внешнем JavaScript

Question

Какой лучший способ избежать жесткого кодирования URL-адресов в JavaScript (в основном используется при выполнении вызовов AJAX)?

В прошлом:

1. Отображение переменной JavaScript с результатом @Url.Actionили @Url.RouteUrl
2. Передать результат @Url.Action или @Url.RouteUrl в JavaScript в init / ctor.

Есть ли лучший способ?

Это будетбыло бы хорошо сделать что-то вроде этого:

var url = $.routes("actionName", "controllerName") // or "routeName" for named routes
$.post(url, { id = 1 }, function() { //.. });

Что, конечно, на самом деле невозможно (JavaScript не имеет прямого доступа к ViewContext и, следовательно, не имеет доступа к таблицам маршрутов).

Но мне интересно, можно ли как-то настроить мою собственную «таблицу маршрутов» для JavaScript, используя только те, которые, я знаю, понадобятся?(например, я настроил это в представлении)

Как люди справляются с этим?

Answer 1

, несмотря на внедрение javascript в представления, которые я предпочитаю - пусть HTML выполняет свою работу, а javascript - свою. Ниже приведен шаблон.

Для ссылок

/*A cssclass=ajaxlink is added to all those links which we want to ajaxify*/

//html in view
<a class='ajaxlink' href='@Url.Action("Action","Controller")'>I am An Ajax Link</a>

//generated clean html
<a class='ajaxlink' href='/controller/action'>I am An Ajax Link</a>


//Js


jQuery('.ajaxlink').live('click',function(e){
    e.preventDefault();    /*Prevent default behavior of links*/
    var url= $(e.target).attr('href');
   /*
          Now u have url, do post or get: 
          then append received data in some DOM element.
   */
});

// Контроллер

public ActionResult()
{
       if(Request.IsAjax())
       {    
            /*Return partial content*/
            return View(); 
       }
       else
       {
             return View("SomeOther_View.cshtml");

             /*
                At this point you may reject this request or return full view
                whatever you feel is okie.
             */
       }
}

Таким образом, оба типа пользователей могут обрабатываться как с включенным JavaScript, так и с отключенным Javascript.

То же самое можно сделать для форм.

Answer 2

Реализация механизма маршрутизации Javascript не будет слишком сложной.Во-первых, сериализуйте маршруты из C # в Javascript.Во-вторых, воссоздайте метод Url.Action.

Однако, это немного излишне для любого из проектов, над которыми я работал.Проекты моей команды всегда отображали общую переменную Javascript, которая содержит все необходимые URL-адреса.
Этот подход обеспечивает строго типизированные методы действий и лучше подходит для рефакторинга.

Answer 3

Я решил реализовать свой собственный UrlFactory, используя в своем коде непосредственно помощники ASP.NET (Html ​​/ Url), теперь у меня нет src, я опубликую их завтра.

Плюсы в этом: я могу легко отследить каждый URL-адрес и выполнить централизованное переписывание.

Пример использования:

@{
  string myAjaxUrl = UrlFactory.GetUrl (ActionName, ControllerName, new { query-params });
}

Затем, используя их в javascript с

var jsUrl = '@myAjaxUrl';

После того, как вы определили свою собственную Фабрику, вы можете перехватить «важные» URL-адреса (например, для перезаписи) и оставить общий для реализации помощника Url.

Однако для того, чтобы иметь эту полностью клиентскую сторону, существует дополнительный шаг рендеринга контекста маршрутизации Js для доступа к переменным на стороне клиента.

РЕДАКТИРОВАТЬ: Как и обещал мой очень простой конструктор класса Url:

public static class UrlFactory
{
    public static string GetUrl(string Action, string Controller, object RouteValues)
    {
        UrlHelper Url = new UrlHelper(HttpContext.Current.Request.RequestContext);
        return Url.Action(Action, Controller, RouteValues);
    }

    // Common URLS for Denied et similars.
    public static string GetDeniedUrl(PEDUtenti Utente, object RouteValues)
    {
        return GetUrl(Utente, "Denied", "Errors", RouteValues);
    }
    public static string GetDeniedUrl(object RouteValues)
    {
        return GetUrl("Denied", "Errors", RouteValues);
    }
}

Answer 4

Это легче сказать, чем достичь на практике, но ваш сайт должен быть полностью функциональным с отключенным JavaScript.Когда это будет достигнуто, вы сможете добавить поддержку AJAX на свой веб-сайт и повторно использовать существующие атрибуты HREF в своих тегах привязки или атрибутах действий в тегах FORM.Веб-сайт будет проще поддерживать, поскольку вам не нужно будет обновлять ссылки в файлах JavaScript.