My online host service smarterasp.net require some changes made to publish my angular compiled app (Angular v. 11.1.1) as a node js app. On their quickstart guide(https://www.smarterasp.net/support/kb/a1970/quick-start-node_js.aspx?KBSearchID=818443) they say: "We are Hosting node.js applications in IIS on Windows via IISNode, so you need to update listening port to use "process.env.PORT" in your code" and there's code given as an example:
HelloWorld Sample:
hello.js
var http = require('http');
http.createServer(function(req, res) {
res.writeHead(200, {
'Content-Type': 'text/plain'
});
res.end('Hello, world!');
}).listen(process.env.PORT);
web.config
<?xml version="1.0" encoding="UTF-8" ?>
<configuration>
<system.webServer>
<handlers>
<add name="iisnode" path="hello.js" verb="*" modules="iisnode" />
</handlers>
<rewrite>
<rules>
<rule name="mysite">
<match url="/*" />
<action type="Rewrite" url="hello.js" />
</rule>
</rules>
</rewrite>
</system.webServer>
</configuration>
"You do not have to run any command line with npm or node.exe to host nodejs with us." They say.
Now, the problem is: My compiled Angular app consists on many .js files, but the hello.js example given only has a string return res.end('Hello, world!');. My questions are:
- What's the correct code to use in my case (instead of the hello.js) and where should I put this code? I already try to put it inside my index.html file, inside the header tags, inside a script, but the web browser console shows me the error (Uncaught ReferenceError: require is not defined).
- Once I uploaded my test files, my website shows a black screen.
This is my attempt of script inside my index.html file:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>DummyTitle</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script>
var http = require('http');
http.createServer(function (req, res) {
res.writeHead(200, {
'Content-Type': 'text/plain'
});
res.write(req.url);
res.end();
}).listen(process.env.PORT);
</script>
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</head>
<body style="background-color: black;">
<app-root></app-root>
</body>
</html>
And this is my web.config file (following the angular guide about IIS (https://angular.io/guide/deployment)):
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<system.webServer>
<rewrite>
<rules>
<rule name="Angular Routes" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
</conditions>
<action type="Rewrite" url="/mainwebpage/index.html" />
</rule>
</rules>
</rewrite>
<handlers>
<add name="iisnode" path="*.js" verb="*" modules="iisnode" />
</handlers>
</system.webServer>
</configuration>
Has somebody found the same issue before? Help please!!
question from:
https://stackoverflow.com/questions/66055786/angular-app-publish-with-iisnode-on-smarterasp-net 与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
