CODEWITHSUNDEEP
node.jsangularazureiisweb
RaShe
RaShe

Reputation: 1880

web.config with angular universal

I want to run angular 4 univeral in Azure Web. I deployed the code, but I have some troubles with web.config (i think so).

The server.js located in dist folder, so I set path in web.config "dist/server.js", but when server.js runs it gives an error:

ENOENT: no such file or directory, open 'D:\home\site\wwwroot\dist\dist\browser\index.html'

If I remove the "dist" from path it will 404. And if I remove "dist" from 

const DIST_FOLDER = join(process.cwd(), 'dist'); in server.js

it will give me an error:

ENOENT: no such file or directory, open 'D:\home\site\wwwroot\browser\index.html'

Or double dist, or no dist at all.

The web.config looks like this:

    <?xml version="1.0" encoding="utf-8"?>
<configuration>
  <system.webServer>
    <webSocket enabled="false" />
    <handlers>
      <add name="iisnode" path="dist/server.js" verb="*" modules="iisnode"/>
    </handlers>
    <rewrite>
      <rules>
        <rule name="NodeInspector" patternSyntax="ECMAScript" stopProcessing="true">
          <match url="^dist/server.js\/debug[\/]?" />
        </rule>
        <rule name="StaticContent">
          <action type="Rewrite" url="public{REQUEST_URI}"/>
        <rule name="DynamicContent">
          <conditions>
            <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="True"/>
          </conditions>
          <action type="Rewrite" url="dist/server.js"/>
        </rule>
      </rules>
    </rewrite>
    <security>
      <requestFiltering>
        <hiddenSegments>
          <remove segment="bin"/>
        </hiddenSegments>
      </requestFiltering>
    </security>
    <httpErrors existingResponse="PassThrough" />
  </system.webServer>
</configuration>

The server.js code:

const PORT = process.env.PORT || 8080;
const DIST_FOLDER = join(process.cwd(), 'dist');

const app = express();

const template = readFileSync(join(DIST_FOLDER, 'browser', 'index.html')).toString();
const { AppServerModuleNgFactory } = require('main.server');

app.engine('html', (_, options, callback) => {
  const opts = { document: template, url: options.req.url };

  renderModuleFactory(AppServerModuleNgFactory, opts)
    .then(html => callback(null, html));
});

app.set('view engine', 'html');
app.set('views', 'src');

app.get('*.*', express.static(join(DIST_FOLDER, 'browser')));

app.get('*', (req, res) => {
  res.render('index', { req });
});

app.listen(PORT, () => {
  console.log(`listening on http://localhost:${PORT}!`);
});

Upvotes: 1

Views: 2003

Answers (2)

RaShe
RaShe

Reputation: 1880

I figured out, instead of process.cwd(), I should use __dirname.

Upvotes: 1

Aaron Chen
Aaron Chen

Reputation: 9940

Your server.js is located in "dist" folder. So, please change the following line

const DIST_FOLDER = join(process.cwd(), 'dist');

to

const DIST_FOLDER = process.cwd();

Upvotes: 0

Related Questions