为什么我的 NodeJS 应用程序 return 是一个静态 Javascript 文件,当我访问它的根 URL
Why would my NodeJS app return a static Javascript file when I hit its root URL
我使用 VS Code 中的应用服务扩展在 Azure 应用服务上安装了我的 React 应用。 IT 说它已成功安装。我遇到了一些问题,不得不在 web.config 中设置默认文档 index.js 以避免 NodeJs 和 App Services 出现众所周知的问题。但是,当我点击我的应用程序的主要 url 时,我得到了返回给我的 index.js 一个静态文件。它不会像我期望的那样执行文件并呈现我的应用程序。我已经通过 Kudu 的调试控制台进行了检查,并且安装了 Node 和 npm。事实上,它们的正确版本。我已经为这个问题坐了整整 2 天,无法将应用程序升级到 运行。
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';
import { createStore } from 'redux';
import { Provider } from 'react-redux';
import { mainReducer } from './main/reducer';
import * as AuthService from '../src/authentication/authentication-service';
let store = createStore(mainReducer, {});
AuthService.init();
require('dotenv').config();
AuthService.runAuth(() => {
const Bootstrap = () => (
<Provider store={store}>
<App />
</Provider>
);
ReactDOM.render(<Bootstrap />, document.getElementById('root'));
serviceWorker.register();
});
我的 web.config 文件如下所示:
<?xml version="1.0" encoding="utf-8"?>
<!--
This configuration file is required if iisnode is used to run node processes behind
IIS or IIS Express. For more information, visit:
https://github.com/tjanczuk/iisnode/blob/master/src/samples/configuration/web.config
-->
<configuration>
<system.webServer>
<!-- Visit http://blogs.msdn.com/b/windowsazure/archive/2013/11/14/introduction-to-websockets-on-windows-azure-web-sites.aspx for more information on WebSocket support -->
<webSocket enabled="false" />
<handlers>
<!-- Indicates that the index.js file is a node.js site to be handled by the iisnode module -->
<add name="iisnode" path="index.js" verb="*" modules="iisnode"/>
</handlers>
<rewrite>
<rules>
<!-- Do not interfere with requests for node-inspector debugging -->
<rule name="NodeInspector" patternSyntax="ECMAScript" stopProcessing="true">
<match url="^index.js\/debug[\/]?" />
</rule>
<!-- First we consider whether the incoming URL matches a physical file in the /public folder -->
<rule name="StaticContent">
<action type="Rewrite" url="public{REQUEST_URI}"/>
</rule>
<!-- All other URLs are mapped to the node.js site entry point -->
<rule name="DynamicContent">
<conditions>
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="True"/>
</conditions>
<action type="Rewrite" url="index.js"/>
</rule>
</rules>
</rewrite>
<!-- 'bin' directory has no special meaning in node.js and apps can be placed in it -->
<security>
<requestFiltering>
<hiddenSegments>
<remove segment="bin"/>
</hiddenSegments>
</requestFiltering>
</security>
<!-- Make sure error responses are left untouched -->
<httpErrors existingResponse="PassThrough" />
<!--
You can control how Node is hosted within IIS using the following options:
* watchedFiles: semi-colon separated list of files that will be watched for changes to restart the server
* node_env: will be propagated to node as NODE_ENV environment variable
* debuggingEnabled - controls whether the built-in debugger is enabled
See https://github.com/tjanczuk/iisnode/blob/master/src/samples/configuration/web.config for a full list of options
-->
<iisnode watchedFiles="web.config;*.js" debuggingEnabled="true"/>
</system.webServer>
</configuration>
您的默认文档可能应该是一个 HTML 文件,其中包含您的 React 应用程序而不是 js 文件。
您应该将您的应用配置为发送 index.html 而不是 index.js
检查 1
您是否部署了正确的 build
文件夹? (从未使用过 Azure 应用服务,但根据我的理解,它应该是捆绑版本)
我使用 VS Code 中的应用服务扩展在 Azure 应用服务上安装了我的 React 应用。 IT 说它已成功安装。我遇到了一些问题,不得不在 web.config 中设置默认文档 index.js 以避免 NodeJs 和 App Services 出现众所周知的问题。但是,当我点击我的应用程序的主要 url 时,我得到了返回给我的 index.js 一个静态文件。它不会像我期望的那样执行文件并呈现我的应用程序。我已经通过 Kudu 的调试控制台进行了检查,并且安装了 Node 和 npm。事实上,它们的正确版本。我已经为这个问题坐了整整 2 天,无法将应用程序升级到 运行。
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';
import { createStore } from 'redux';
import { Provider } from 'react-redux';
import { mainReducer } from './main/reducer';
import * as AuthService from '../src/authentication/authentication-service';
let store = createStore(mainReducer, {});
AuthService.init();
require('dotenv').config();
AuthService.runAuth(() => {
const Bootstrap = () => (
<Provider store={store}>
<App />
</Provider>
);
ReactDOM.render(<Bootstrap />, document.getElementById('root'));
serviceWorker.register();
});
我的 web.config 文件如下所示:
<?xml version="1.0" encoding="utf-8"?>
<!--
This configuration file is required if iisnode is used to run node processes behind
IIS or IIS Express. For more information, visit:
https://github.com/tjanczuk/iisnode/blob/master/src/samples/configuration/web.config
-->
<configuration>
<system.webServer>
<!-- Visit http://blogs.msdn.com/b/windowsazure/archive/2013/11/14/introduction-to-websockets-on-windows-azure-web-sites.aspx for more information on WebSocket support -->
<webSocket enabled="false" />
<handlers>
<!-- Indicates that the index.js file is a node.js site to be handled by the iisnode module -->
<add name="iisnode" path="index.js" verb="*" modules="iisnode"/>
</handlers>
<rewrite>
<rules>
<!-- Do not interfere with requests for node-inspector debugging -->
<rule name="NodeInspector" patternSyntax="ECMAScript" stopProcessing="true">
<match url="^index.js\/debug[\/]?" />
</rule>
<!-- First we consider whether the incoming URL matches a physical file in the /public folder -->
<rule name="StaticContent">
<action type="Rewrite" url="public{REQUEST_URI}"/>
</rule>
<!-- All other URLs are mapped to the node.js site entry point -->
<rule name="DynamicContent">
<conditions>
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="True"/>
</conditions>
<action type="Rewrite" url="index.js"/>
</rule>
</rules>
</rewrite>
<!-- 'bin' directory has no special meaning in node.js and apps can be placed in it -->
<security>
<requestFiltering>
<hiddenSegments>
<remove segment="bin"/>
</hiddenSegments>
</requestFiltering>
</security>
<!-- Make sure error responses are left untouched -->
<httpErrors existingResponse="PassThrough" />
<!--
You can control how Node is hosted within IIS using the following options:
* watchedFiles: semi-colon separated list of files that will be watched for changes to restart the server
* node_env: will be propagated to node as NODE_ENV environment variable
* debuggingEnabled - controls whether the built-in debugger is enabled
See https://github.com/tjanczuk/iisnode/blob/master/src/samples/configuration/web.config for a full list of options
-->
<iisnode watchedFiles="web.config;*.js" debuggingEnabled="true"/>
</system.webServer>
</configuration>
您的默认文档可能应该是一个 HTML 文件,其中包含您的 React 应用程序而不是 js 文件。
您应该将您的应用配置为发送 index.html 而不是 index.js
检查 1
您是否部署了正确的 build
文件夹? (从未使用过 Azure 应用服务,但根据我的理解,它应该是捆绑版本)