Onde colocar arquivos javascript específicos da visualização em um aplicativo ASP.NET MVC?

Qual é o melhor lugar (qual pasta, etc) para colocar arquivos javascript específicos da visualização em um aplicativo ASP.NET MVC?

Para manter meu projeto organizado, eu realmente adoraria colocá-los lado a lado com os arquivos .aspx da visualização, mas não encontrei uma boa maneira de referenciá-los ao fazer isso sem expor o ~ / Views / Ação / estrutura de pastas. É realmente ruim permitir que detalhes dessa estrutura de pastas vazem?

A alternativa é colocá-los nas pastas ~ / Scripts ou ~ / Content, mas é um pouco irritante porque agora tenho que me preocupar com conflitos de nome de arquivo. É uma irritação que posso superar, no entanto, se for "a coisa certa".

Pergunta antiga, mas gostaria de responder no caso de alguém vir procurá-la.

Eu também queria meus arquivos js / css específicos de visualização na pasta de visualizações, e foi assim que fiz:

Na pasta web.config na raiz de / Views, você precisa modificar duas seções para permitir que o servidor da web exiba os arquivos:

    <system.web>
        <httpHandlers>
            <add path="*.js" verb="GET,HEAD" type="System.Web.StaticFileHandler" />
            <add path="*.css" verb="GET,HEAD" type="System.Web.StaticFileHandler" />
            <add path="*" verb="*" type="System.Web.HttpNotFoundHandler"/>
        </httpHandlers>
        <!-- other content here -->
    </system.web>

    <system.webServer>
        <handlers>
            <remove name="BlockViewHandler"/>
            <add name="JavaScript" path="*.js" verb="GET,HEAD" type="System.Web.StaticFileHandler" />
            <add name="CSS" path="*.css" verb="GET,HEAD" type="System.Web.StaticFileHandler" />
            <add name="BlockViewHandler" path="*" verb="*" preCondition="integratedMode" type="System.Web.HttpNotFoundHandler" />
        </handlers>
        <!-- other content here -->
    </system.webServer>

Então, a partir do seu arquivo de visualização, você pode referenciar os urls conforme o esperado:

@Url.Content("~/Views/<ControllerName>/somefile.css")

Isso permitirá a exibição de arquivos .js e .css e proibirá a exibição de qualquer outra coisa.

Uma maneira de conseguir isso é fornecer o seu próprio produto ActionInvoker. Usando o código incluído abaixo, você pode adicionar ao construtor do seu controlador:

ActionInvoker = new JavaScriptActionInvoker();

Agora, sempre que você colocar um .jsarquivo próximo à sua visualização:

Você pode acessá-lo diretamente:

http://yourdomain.com/YourController/Index.js

Abaixo está a fonte:

namespace JavaScriptViews {
    public class JavaScriptActionDescriptor : ActionDescriptor
    {
        private string actionName;
        private ControllerDescriptor controllerDescriptor;

        public JavaScriptActionDescriptor(string actionName, ControllerDescriptor controllerDescriptor)
        {
            this.actionName = actionName;
            this.controllerDescriptor = controllerDescriptor;
        }

        public override object Execute(ControllerContext controllerContext, IDictionary<string, object> parameters)
        {
            return new ViewResult();
        }

        public override ParameterDescriptor[] GetParameters()
        {
            return new ParameterDescriptor[0];
        }

        public override string ActionName
        {
            get { return actionName; }
        }

        public override ControllerDescriptor ControllerDescriptor
        {
            get { return controllerDescriptor; }
        }
    }

    public class JavaScriptActionInvoker : ControllerActionInvoker
    {
        protected override ActionDescriptor FindAction(ControllerContext controllerContext, ControllerDescriptor controllerDescriptor, string actionName)
        {
            var action = base.FindAction(controllerContext, controllerDescriptor, actionName);
            if (action != null)
            {
                return action;
            } 

            if (actionName.EndsWith(".js"))
            {
                return new JavaScriptActionDescriptor(actionName, controllerDescriptor);
            }

            else 
                return null;
        }
    }

    public class JavaScriptView : IView
    {
        private string fileName;

        public JavaScriptView(string fileName)
        {
            this.fileName = fileName;
        }

        public void Render(ViewContext viewContext, TextWriter writer)
        {
            var file = File.ReadAllText(viewContext.HttpContext.Server.MapPath(fileName));
            writer.Write(file);
        }
    }


    public class JavaScriptViewEngine : VirtualPathProviderViewEngine
    {
        public JavaScriptViewEngine()
            : this(null)
        {
        }

        public JavaScriptViewEngine(IViewPageActivator viewPageActivator)
            : base()
        {
            AreaViewLocationFormats = new[]
            {
                "~/Areas/{2}/Views/{1}/{0}.js",
                "~/Areas/{2}/Views/Shared/{0}.js"
            };
            AreaMasterLocationFormats = new[]
            {
                "~/Areas/{2}/Views/{1}/{0}.js",
                "~/Areas/{2}/Views/Shared/{0}.js"
            };
            AreaPartialViewLocationFormats = new []
            {
                "~/Areas/{2}/Views/{1}/{0}.js",
                "~/Areas/{2}/Views/Shared/{0}.js"
            };
            ViewLocationFormats = new[]
            {
                "~/Views/{1}/{0}.js",
                "~/Views/Shared/{0}.js"
            };
            MasterLocationFormats = new[]
            {
                "~/Views/{1}/{0}.js",
                "~/Views/Shared/{0}.js"
            };
            PartialViewLocationFormats = new[]
            {
                "~/Views/{1}/{0}.js",
                "~/Views/Shared/{0}.js"
            };
            FileExtensions = new[]
            {
                "js"
            };
        }

        public override ViewEngineResult FindView(ControllerContext controllerContext, string viewName, string masterName, bool useCache)
        {
            if (viewName.EndsWith(".js"))
                viewName = viewName.ChopEnd(".js");
            return base.FindView(controllerContext, viewName, masterName, useCache);
        }


        protected override IView CreatePartialView(ControllerContext controllerContext, string partialPath)
        {
            return new JavaScriptView(partialPath);
        }

        protected override IView CreateView(ControllerContext controllerContext, string viewPath, string masterPath)
        {
            return new JavaScriptView(viewPath);
        }
    }
}

Você pode inverter a sugestão de davesw e bloquear apenas .cshtml

<httpHandlers>
    <add path="*.cshtml" verb="*" type="System.Web.HttpNotFoundHandler"/>
</httpHandlers>

Sei que este é um tópico bastante antigo, mas gostaria de acrescentar algumas coisas. Tentei a resposta de davesw, mas ele estava gerando um erro 500 ao tentar carregar os arquivos de script, então tive que adicionar isso ao web.config:

<validation validateIntegratedModeConfiguration="false" />

para system.webServer. Aqui está o que eu tenho e consegui fazer funcionar:

<system.webServer>
  <handlers>
    <remove name="BlockViewHandler"/>
    <add name="JavaScript" path="*.js" verb="GET,HEAD" type="System.Web.StaticFileHandler" />
    <add name="CSS" path="*.css" verb="GET,HEAD" type="System.Web.StaticFileHandler" />
    <add name="BlockViewHandler" path="*" verb="*" preCondition="integratedMode" type="System.Web.HttpNotFoundHandler" />
  </handlers>
  <validation validateIntegratedModeConfiguration="false" />
</system.webServer>
<system.web>
  <compilation>
    <assemblies>
      <add assembly="System.Web.Mvc, Version=5.2.3.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />
    </assemblies>
  </compilation>
  <httpHandlers>
      <add path="*.js" verb="GET,HEAD" type="System.Web.StaticFileHandler" />
      <add path="*.css" verb="GET,HEAD" type="System.Web.StaticFileHandler" />
      <add path="*" verb="*" type="System.Web.HttpNotFoundHandler"/>
  </httpHandlers>
</system.web>

Aqui estão mais informações sobre validação: https://www.iis.net/configreference/system.webserver/validation

adicione este código no arquivo web.config dentro da tag system.web

<handlers>
    <remove name="BlockViewHandler"/>
    <add name="JavaScript" path="*.js" verb="GET,HEAD" type="System.Web.StaticFileHandler" />
    <add name="CSS" path="*.css" verb="GET,HEAD" type="System.Web.StaticFileHandler" />
     <add name="BlockViewHandler" path="*" verb="*" preCondition="integratedMode" type="System.Web.HttpNotFoundHandler" />
</handlers>

Também queria colocar os arquivos js relacionados a uma visualização na mesma pasta da visualização.

Não fui capaz de fazer as outras soluções neste segmento funcionarem, não que elas estejam quebradas, mas sou muito novo no MVC para fazê-las funcionar.

Usando as informações fornecidas aqui e várias outras pilhas, encontrei uma solução que:

• Permite que o arquivo javascript seja colocado no mesmo diretório da visualização à qual está associado.
• Os URLs de script não revelam a estrutura física subjacente do site
• O URL do script não precisa terminar com uma barra final (/)
• Não interfere com recursos estáticos, por exemplo: /Scripts/someFile.js ainda funciona
• Não requer runAllManagedModulesForAllRequests para ser ativado.

Observação: também estou usando o roteamento de atributo HTTP. É possível que a rota usada na minha alma possa ser modificada para funcionar sem habilitar isso.

Dado o seguinte exemplo de estrutura de diretório / arquivo:

Controllers
-- Example
   -- ExampleController.vb

Views
-- Example
   -- Test.vbhtml
   -- Test.js

Usando as etapas de configuração fornecidas abaixo, combinadas com a estrutura do exemplo acima, o URL de visualização de teste seria acessado por meio de: /Example/Teste o arquivo javascript seria referenciado por meio de:/Example/Scripts/test.js

Etapa 1 - Habilitar Roteamento de Atributo:

Edite seu arquivo /App_start/RouteConfig.vb e adicione routes.MapMvcAttributeRoutes()logo acima das rotas existentes.MapRoute:

Imports System
Imports System.Collections.Generic
Imports System.Linq
Imports System.Web
Imports System.Web.Mvc
Imports System.Web.Routing

Public Module RouteConfig
    Public Sub RegisterRoutes(ByVal routes As RouteCollection)
        routes.IgnoreRoute("{resource}.axd/{*pathInfo}")

        ' Enable HTTP atribute routing
        routes.MapMvcAttributeRoutes()

        routes.MapRoute(
            name:="Default",
            url:="{controller}/{action}/{id}",
            defaults:=New With {.controller = "Home", .action = "Index", .id = UrlParameter.Optional}
        )
    End Sub
End Module

Etapa 2 - configure seu site para tratar e processar /{controller}/Scripts/*.js como um caminho MVC e não um recurso estático

Edite seu arquivo /Web.config, adicionando o seguinte à seção system.webServer -> handlers do arquivo:

<add name="ApiURIs-ISAPI-Integrated-4.0" path="*/scripts/*.js" verb="GET" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />

Aqui está novamente com contexto:

  <system.webServer>
    <modules>
      <remove name="TelemetryCorrelationHttpModule"/>
      <add name="TelemetryCorrelationHttpModule" type="Microsoft.AspNet.TelemetryCorrelation.TelemetryCorrelationHttpModule, Microsoft.AspNet.TelemetryCorrelation" preCondition="managedHandler"/>
      <remove name="ApplicationInsightsWebTracking"/>
      <add name="ApplicationInsightsWebTracking" type="Microsoft.ApplicationInsights.Web.ApplicationInsightsHttpModule, Microsoft.AI.Web" preCondition="managedHandler"/>
    </modules>
    <validation validateIntegratedModeConfiguration="false"/>
    <handlers>
      <remove name="ExtensionlessUrlHandler-Integrated-4.0"/>
      <remove name="OPTIONSVerbHandler"/>
      <remove name="TRACEVerbHandler"/>
      <add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="*" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0"/>
      <add name="ApiURIs-ISAPI-Integrated-4.0" path="*/scripts/*.js" verb="GET" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />
    </handlers>
  </system.webServer>  

Etapa 3 - Adicione o seguinte resultado de ação de scripts ao arquivo do controlador

• Certifique-se de editar o caminho da rota para corresponder ao nome do {controlador} para o controlador, para este exemplo é: <Route (" Exemplo / Scripts / {nome do arquivo}")>

• Você precisará copiar isso para cada um dos arquivos do controlador. Se você quiser, provavelmente há uma maneira de fazer isso como uma configuração de rota única e única.

      ' /Example/Scripts/*.js
      <Route("Example/Scripts/{filename}")>
      Function Scripts(filename As String) As ActionResult
          ' ControllerName could be hardcoded but doing it this way allows for copy/pasting this code block into other controllers without having to edit
          Dim ControllerName As String = System.Web.HttpContext.Current.Request.RequestContext.RouteData.Values("controller").ToString()
  
          ' the real file path
          Dim filePath As String = Server.MapPath("~/Views/" & ControllerName & "/" & filename)
  
          ' send the file contents back
          Return Content(System.IO.File.ReadAllText(filePath), "text/javascript")
      End Function

Para contexto, este é meu arquivo ExampleController.vb:

Imports System.Web.Mvc

Namespace myAppName
    Public Class ExampleController
        Inherits Controller

        ' /Example/Test
        Function Test() As ActionResult
            Return View()
        End Function


        ' /Example/Scripts/*.js
        <Route("Example/Scripts/{filename}")>
        Function Scripts(filename As String) As ActionResult
            ' ControllerName could be hardcoded but doing it this way allows for copy/pasting this code block into other controllers without having to edit
            Dim ControllerName As String = System.Web.HttpContext.Current.Request.RequestContext.RouteData.Values("controller").ToString()

            ' the real file path
            Dim filePath As String = Server.MapPath("~/Views/" & ControllerName & "/" & filename)

            ' send the file contents back
            Return Content(System.IO.File.ReadAllText(filePath), "text/javascript")
        End Function


    End Class
End Namespace

Notas finais Não há nada de especial sobre os arquivos javascript test.vbhtml view / test.js e não são mostrados aqui.

Eu mantenho meu CSS no arquivo de visualização, mas você pode facilmente adicionar a esta solução para que possa referenciar seus arquivos CSS de maneira semelhante.