Feature/stevesa/spaservices extensions package

JavaScriptServices.sln

@@ -1,7 +1,7 @@
 
 Microsoft Visual Studio Solution File, Format Version 12.00
 # Visual Studio 15
-VisualStudioVersion = 15.0.26730.0
+VisualStudioVersion = 15.0.26730.16
 MinimumVisualStudioVersion = 15.0.26730.03
 Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "src", "src", "{27304DDE-AFB2-4F8B-B765-E3E2F11E886C}"
 	ProjectSection(SolutionItems) = preProject
@@ -37,6 +37,8 @@ Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "Solution Items", "Solution
 		Directory.Build.targets = Directory.Build.targets
 	EndProjectSection
 EndProject
+Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Microsoft.AspNetCore.SpaServices.Extensions", "src\Microsoft.AspNetCore.SpaServices.Extensions\Microsoft.AspNetCore.SpaServices.Extensions.csproj", "{D40BD1C4-6A6F-4213-8535-1057F3EB3400}"
+EndProject
 Global
 	GlobalSection(SolutionConfigurationPlatforms) = preSolution
 		Debug|Any CPU = Debug|Any CPU
@@ -67,6 +69,10 @@ Global
 		{93EFCC5F-C6EE-4623-894F-A42B22C0B6FE}.Debug|Any CPU.Build.0 = Debug|Any CPU
 		{93EFCC5F-C6EE-4623-894F-A42B22C0B6FE}.Release|Any CPU.ActiveCfg = Release|Any CPU
 		{93EFCC5F-C6EE-4623-894F-A42B22C0B6FE}.Release|Any CPU.Build.0 = Release|Any CPU
+		{D40BD1C4-6A6F-4213-8535-1057F3EB3400}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
+		{D40BD1C4-6A6F-4213-8535-1057F3EB3400}.Debug|Any CPU.Build.0 = Debug|Any CPU
+		{D40BD1C4-6A6F-4213-8535-1057F3EB3400}.Release|Any CPU.ActiveCfg = Release|Any CPU
+		{D40BD1C4-6A6F-4213-8535-1057F3EB3400}.Release|Any CPU.Build.0 = Release|Any CPU
 	EndGlobalSection
 	GlobalSection(SolutionProperties) = preSolution
 		HideSolutionNode = FALSE
@@ -79,6 +85,7 @@ Global
 		{1931B19A-EC42-4D56-B2D0-FB06D17244DA} = {E6A161EA-646C-4033-9090-95BE809AB8D9}
 		{DE479DC3-1461-4EAD-A188-4AF7AA4AE344} = {E6A161EA-646C-4033-9090-95BE809AB8D9}
 		{93EFCC5F-C6EE-4623-894F-A42B22C0B6FE} = {E6A161EA-646C-4033-9090-95BE809AB8D9}
+		{D40BD1C4-6A6F-4213-8535-1057F3EB3400} = {27304DDE-AFB2-4F8B-B765-E3E2F11E886C}
 	EndGlobalSection
 	GlobalSection(ExtensibilityGlobals) = postSolution
 		SolutionGuid = {DDF59B0D-2DEC-45D6-8667-DCB767487101}

build/dependencies.props

@@ -13,6 +13,7 @@
     <MicrosoftAspNetCoreServerIISIntegrationPackageVersion>2.1.0-preview1-27478</MicrosoftAspNetCoreServerIISIntegrationPackageVersion>
     <MicrosoftAspNetCoreServerKestrelPackageVersion>2.1.0-preview1-27478</MicrosoftAspNetCoreServerKestrelPackageVersion>
     <MicrosoftAspNetCoreStaticFilesPackageVersion>2.1.0-preview1-27478</MicrosoftAspNetCoreStaticFilesPackageVersion>
+    <MicrosoftAspNetCoreWebSocketsPackageVersion>2.1.0-preview1-27478</MicrosoftAspNetCoreWebSocketsPackageVersion>
     <MicrosoftExtensionsDependencyInjectionPackageVersion>2.1.0-preview1-27478</MicrosoftExtensionsDependencyInjectionPackageVersion>
     <MicrosoftExtensionsLoggingConsolePackageVersion>2.1.0-preview1-27478</MicrosoftExtensionsLoggingConsolePackageVersion>
     <MicrosoftExtensionsLoggingDebugPackageVersion>2.1.0-preview1-27478</MicrosoftExtensionsLoggingDebugPackageVersion>

src/Microsoft.AspNetCore.SpaServices.Extensions/AngularCli/AngularCliBuilder.cs

@@ -0,0 +1,73 @@
+// Copyright (c) .NET Foundation. All rights reserved.
+// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
+
+using Microsoft.AspNetCore.Builder;
+using Microsoft.AspNetCore.NodeServices.Npm;
+using Microsoft.AspNetCore.NodeServices.Util;
+using Microsoft.AspNetCore.SpaServices.Prerendering;
+using System;
+using System.IO;
+using System.Text.RegularExpressions;
+using System.Threading.Tasks;
+
+namespace Microsoft.AspNetCore.SpaServices.AngularCli
+{
+    /// <summary>
+    /// Provides an implementation of <see cref="ISpaPrerendererBuilder"/> that can build
+    /// an Angular application by invoking the Angular CLI.
+    /// </summary>
+    public class AngularCliBuilder : ISpaPrerendererBuilder
+    {
+        private static TimeSpan RegexMatchTimeout = TimeSpan.FromSeconds(5); // This is a development-time only feature, so a very long timeout is fine
+        private static TimeSpan BuildTimeout = TimeSpan.FromSeconds(50); // Note that the HTTP request itself by default times out after 60s, so you only get useful error information if this is shorter
+
+        private readonly string _npmScriptName;
+
+        /// <summary>
+        /// Constructs an instance of <see cref="AngularCliBuilder"/>.
+        /// </summary>
+        /// <param name="npmScript">The name of the script in your package.json file that builds the server-side bundle for your Angular application.</param>
+        public AngularCliBuilder(string npmScript)
+        {
+            if (string.IsNullOrEmpty(npmScript))
+            {
+                throw new ArgumentException("Cannot be null or empty.", nameof(npmScript));
+            }
+
+            _npmScriptName = npmScript;
+        }
+
+        /// <inheritdoc />
+        public Task Build(ISpaBuilder spaBuilder)
+        {
+            var sourcePath = spaBuilder.Options.SourcePath;
+            if (string.IsNullOrEmpty(sourcePath))
+            {
+                throw new InvalidOperationException($"To use {nameof(AngularCliBuilder)}, you must supply a non-empty value for the {nameof(SpaOptions.SourcePath)} property of {nameof(SpaOptions)} when calling {nameof(SpaApplicationBuilderExtensions.UseSpa)}.");
+            }
+
+            var logger = AngularCliMiddleware.GetOrCreateLogger(spaBuilder.ApplicationBuilder);
+            var npmScriptRunner = new NpmScriptRunner(
+                sourcePath,
+                _npmScriptName,
+                "--watch");
+            npmScriptRunner.AttachToLogger(logger);
+
+            using (var stdErrReader = new EventedStreamStringReader(npmScriptRunner.StdErr))
+            {
+                try
+                {
+                    return npmScriptRunner.StdOut.WaitForMatch(
+                        new Regex("chunk", RegexOptions.None, RegexMatchTimeout),
+                        BuildTimeout);
+                }
+                catch (EndOfStreamException ex)
+                {
+                    throw new InvalidOperationException(
+                        $"The NPM script '{_npmScriptName}' exited without indicating success. " +
+                        $"Error output was: {stdErrReader.ReadAsString()}", ex);
+                }
+            }
+        }
+    }
+}

src/Microsoft.AspNetCore.SpaServices.Extensions/AngularCli/AngularCliMiddleware.cs

@@ -0,0 +1,131 @@
+// Copyright (c) .NET Foundation. All rights reserved.
+// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
+
+using Microsoft.AspNetCore.Builder;
+using System;
+using System.Threading.Tasks;
+using Microsoft.AspNetCore.NodeServices.Npm;
+using System.Text.RegularExpressions;
+using Microsoft.Extensions.Logging;
+using Microsoft.Extensions.DependencyInjection;
+using Microsoft.Extensions.Logging.Console;
+using System.Net.Sockets;
+using System.Net;
+using System.IO;
+using Microsoft.AspNetCore.NodeServices.Util;
+
+namespace Microsoft.AspNetCore.SpaServices.AngularCli
+{
+    internal static class AngularCliMiddleware
+    {
+        private const string LogCategoryName = "Microsoft.AspNetCore.SpaServices";
+        private static TimeSpan RegexMatchTimeout = TimeSpan.FromSeconds(5); // This is a development-time only feature, so a very long timeout is fine
+        private static TimeSpan StartupTimeout = TimeSpan.FromSeconds(50); // Note that the HTTP request itself by default times out after 60s, so you only get useful error information if this is shorter
+
+        public static void Attach(
+            ISpaBuilder spaBuilder,
+            string npmScriptName)
+        {
+            var sourcePath = spaBuilder.Options.SourcePath;
+            if (string.IsNullOrEmpty(sourcePath))
+            {
+                throw new ArgumentException("Cannot be null or empty", nameof(sourcePath));
+            }
+
+            if (string.IsNullOrEmpty(npmScriptName))
+            {
+                throw new ArgumentException("Cannot be null or empty", nameof(npmScriptName));
+            }
+
+            // Start Angular CLI and attach to middleware pipeline
+            var appBuilder = spaBuilder.ApplicationBuilder;
+            var logger = GetOrCreateLogger(appBuilder);
+            var angularCliServerInfoTask = StartAngularCliServerAsync(sourcePath, npmScriptName, logger);
+
+            // Everything we proxy is hardcoded to target http://localhost because:
+            // - the requests are always from the local machine (we're not accepting remote
+            //   requests that go directly to the Angular CLI middleware server)
+            // - given that, there's no reason to use https, and we couldn't even if we
+            //   wanted to, because in general the Angular CLI server has no certificate
+            var targetUriTask = angularCliServerInfoTask.ContinueWith(
+                task => new UriBuilder("http", "localhost", task.Result.Port).Uri);
+
+            SpaProxyingExtensions.UseProxyToSpaDevelopmentServer(spaBuilder, targetUriTask);
+        }
+
+        internal static ILogger GetOrCreateLogger(IApplicationBuilder appBuilder)
+        {
+            // If the DI system gives us a logger, use it. Otherwise, set up a default one.
+            var loggerFactory = appBuilder.ApplicationServices.GetService<ILoggerFactory>();
+            var logger = loggerFactory != null
+                ? loggerFactory.CreateLogger(LogCategoryName)
+                : new ConsoleLogger(LogCategoryName, null, false);
+            return logger;
+        }
+
+        private static async Task<AngularCliServerInfo> StartAngularCliServerAsync(
+            string sourcePath, string npmScriptName, ILogger logger)
+        {
+            var portNumber = FindAvailablePort();
+            logger.LogInformation($"Starting @angular/cli on port {portNumber}...");
+
+            var npmScriptRunner = new NpmScriptRunner(
+                sourcePath, npmScriptName, $"--port {portNumber}");
+            npmScriptRunner.AttachToLogger(logger);
+
+            Match openBrowserLine;
+            using (var stdErrReader = new EventedStreamStringReader(npmScriptRunner.StdErr))
+            {
+                try
+                {
+                    openBrowserLine = await npmScriptRunner.StdOut.WaitForMatch(
+                        new Regex("open your browser on (http\\S+)", RegexOptions.None, RegexMatchTimeout),
+                        StartupTimeout);
+                }
+                catch (EndOfStreamException ex)
+                {
+                    throw new InvalidOperationException(
+                        $"The NPM script '{npmScriptName}' exited without indicating that the " +
+                        $"Angular CLI was listening for requests. The error output was: " +
+                        $"{stdErrReader.ReadAsString()}", ex);
+                }
+                catch (TaskCanceledException ex)
+                {
+                    throw new InvalidOperationException(
+                        $"The Angular CLI process did not start listening for requests " +
+                        $"within the timeout period of {StartupTimeout.Seconds} seconds. " +
+                        $"Check the log output for error information.", ex);
+                }
+            }
+
+            var uri = new Uri(openBrowserLine.Groups[1].Value);
+            var serverInfo = new AngularCliServerInfo { Port = uri.Port };
+
+            // Even after the Angular CLI claims to be listening for requests, there's a short
+            // period where it will give an error if you make a request too quickly. Give it
+            // a moment to finish starting up.
+            await Task.Delay(500);
+
+            return serverInfo;
+        }
+
+        private static int FindAvailablePort()
+        {
+            var listener = new TcpListener(IPAddress.Loopback, 0);
+            listener.Start();
+            try
+            {
+                return ((IPEndPoint)listener.LocalEndpoint).Port;
+            }
+            finally
+            {
+                listener.Stop();
+            }
+        }
+
+        class AngularCliServerInfo
+        {
+            public int Port { get; set; }
+        }
+    }
+}

src/Microsoft.AspNetCore.SpaServices.Extensions/AngularCli/AngularCliMiddlewareExtensions.cs

@@ -0,0 +1,43 @@
+// Copyright (c) .NET Foundation. All rights reserved.
+// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
+
+using Microsoft.AspNetCore.Builder;
+using System;
+
+namespace Microsoft.AspNetCore.SpaServices.AngularCli
+{
+    /// <summary>
+    /// Extension methods for enabling Angular CLI middleware support.
+    /// </summary>
+    public static class AngularCliMiddlewareExtensions
+    {
+        /// <summary>
+        /// Handles requests by passing them through to an instance of the Angular CLI server.
+        /// This means you can always serve up-to-date CLI-built resources without having
+        /// to run the Angular CLI server manually.
+        ///
+        /// This feature should only be used in development. For production deployments, be
+        /// sure not to enable the Angular CLI server.
+        /// </summary>
+        /// <param name="spaBuilder">The <see cref="ISpaBuilder"/>.</param>
+        /// <param name="npmScript">The name of the script in your package.json file that launches the Angular CLI process.</param>
+        public static void UseAngularCliServer(
+            this ISpaBuilder spaBuilder,
+            string npmScript)
+        {
+            if (spaBuilder == null)
+            {
+                throw new ArgumentNullException(nameof(spaBuilder));
+            }
+
+            var spaOptions = spaBuilder.Options;
+
+            if (string.IsNullOrEmpty(spaOptions.SourcePath))
+            {
+                throw new InvalidOperationException($"To use {nameof(UseAngularCliServer)}, you must supply a non-empty value for the {nameof(SpaOptions.SourcePath)} property of {nameof(SpaOptions)} when calling {nameof(SpaApplicationBuilderExtensions.UseSpa)}.");
+            }
+
+            AngularCliMiddleware.Attach(spaBuilder, npmScript);
+        }
+    }
+}

src/Microsoft.AspNetCore.SpaServices.Extensions/DefaultSpaBuilder.cs

@@ -0,0 +1,24 @@
+// Copyright (c) .NET Foundation. All rights reserved.
+// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
+
+using Microsoft.AspNetCore.Builder;
+using System;
+
+namespace Microsoft.AspNetCore.SpaServices
+{
+    internal class DefaultSpaBuilder : ISpaBuilder
+    {
+        public IApplicationBuilder ApplicationBuilder { get; }
+
+        public SpaOptions Options { get; }
+
+        public DefaultSpaBuilder(IApplicationBuilder applicationBuilder, SpaOptions options)
+        {
+            ApplicationBuilder = applicationBuilder 
+                ?? throw new ArgumentNullException(nameof(applicationBuilder));
+
+            Options = options
+                ?? throw new ArgumentNullException(nameof(options));
+        }
+    }
+}

src/Microsoft.AspNetCore.SpaServices.Extensions/ISpaBuilder.cs

@@ -0,0 +1,25 @@
+// Copyright (c) .NET Foundation. All rights reserved.
+// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
+
+using Microsoft.AspNetCore.Builder;
+
+namespace Microsoft.AspNetCore.SpaServices
+{
+    /// <summary>
+    /// Defines a class that provides mechanisms for configuring the hosting
+    /// of a Single Page Application (SPA) and attaching middleware.
+    /// </summary>
+    public interface ISpaBuilder
+    {
+        /// <summary>
+        /// The <see cref="IApplicationBuilder"/> representing the middleware pipeline
+        /// in which the SPA is being hosted.
+        /// </summary>
+        IApplicationBuilder ApplicationBuilder { get; }
+
+        /// <summary>
+        /// Describes configuration options for hosting a SPA.
+        /// </summary>
+        SpaOptions Options { get; }
+    }
+}

src/Microsoft.AspNetCore.SpaServices.Extensions/Microsoft.AspNetCore.SpaServices.Extensions.csproj

@@ -0,0 +1,17 @@
+<Project Sdk="Microsoft.NET.Sdk">
+
+  <PropertyGroup>
+    <Description>Helpers for building single-page applications on ASP.NET MVC Core.</Description>
+    <TargetFramework>netstandard2.0</TargetFramework>
+  </PropertyGroup>
+
+  <ItemGroup>
+    <ProjectReference Include="..\Microsoft.AspNetCore.SpaServices\Microsoft.AspNetCore.SpaServices.csproj" />
+  </ItemGroup>
+
+  <ItemGroup>
+    <PackageReference Include="Microsoft.AspNetCore.StaticFiles" Version="$(MicrosoftAspNetCoreStaticFilesPackageVersion)" />
+    <PackageReference Include="Microsoft.AspNetCore.WebSockets" Version="$(MicrosoftAspNetCoreWebSocketsPackageVersion)" />
+  </ItemGroup>
+
+</Project>