iisnuxt.jshttpplatformhandler

What's the proper way to host Nuxt.js web app on IIS?

I use IIS in Windows to run several web page servers. And this time, I studied Nuxt.js. Build a project created with Nuxt.js using the "npm run build" command. I know that if you go into that folder and "npm run dev", the server opens on port 3000. At this time, instead of "http://example.com:3000" on the web browser, I would like to launch the service through "http://example.com". How shall I do it?

  1. Is there a way to set it up in IIS Manager?
  2. If not, should we consider a new web server instead of IIS?
  3. If not, is there a way to set it up in Nuxt.js?

I tried the HTTP redirection feature in IIS Manager, but I could not get the desired result.

Solution

  • With HttpPlatformHandler you can easily host Nuxt.js web apps on IIS, but changes to your project are required as below,

    Nuxt 2.x

    The official guide to host Nuxt 2.x for Azure App Service (Windows) shows the general hints,

    1. Create server\index.js.
    2. Modify nuxt.config.js.

    but it misses important steps,

    Then your web.config should look similar to,

    <?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <handlers>
            <add name="httpPlatformHandler" path="*" verb="*" modules="httpPlatformHandler" resourceType="Unspecified" requireAccess="Script" />
        </handlers>
        <httpPlatform stdoutLogEnabled="true" stdoutLogFile=".\node.log" startupTimeLimit="20" processPath="C:\Users\<user name>\AppData\Roaming\nvm\v16.13.2\node.exe" arguments=".\server\index.js">
            <environmentVariables>
                <environmentVariable name="PORT" value="%HTTP_PLATFORM_PORT%" />
                <environmentVariable name="NODE_ENV" value="Production" />
            </environmentVariables>
        </httpPlatform>
    </system.webServer>
</configuration>

    Note that iisnode mentioned in that Nuxt.js guide is no longer maintained, and only HttpPlatformHandler is recommended.

    Note that rewrite rules in official guide were not added as the minimal sample project does not require them, but you can add them for your project if needed.

    Nuxt 3.0

    The steps are simplified,

    npx nuxi init test-nuxt
cd test-nuxt
npm install
npm run build

    with web.config,

    <?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <handlers>
            <add name="httpPlatformHandler" path="*" verb="*" modules="httpPlatformHandler" resourceType="Unspecified" requireAccess="Script" />
        </handlers>
        <httpPlatform stdoutLogEnabled="true" stdoutLogFile=".\node.log" startupTimeLimit="20" processPath="C:\Users\<user name>\AppData\Roaming\nvm\v16.13.2\node.exe" arguments=".output\server\index.mjs">
            <environmentVariables>
                <environmentVariable name="PORT" value="%HTTP_PLATFORM_PORT%" />
                <environmentVariable name="NODE_ENV" value="Production" />
            </environmentVariables>
        </httpPlatform>
    </system.webServer>
</configuration>

    Reference