在使用代码拆分获取块时包括 header
Include header when chunks are fetched with code splitting
我使用代码拆分将应用程序的受限部分分成不同的块。到目前为止，这工作得很好，现在我想确保除非经过身份验证，否则文件本身不会得到服务。我正在考虑使用 ngx_http_auth_request_module
http://nginx.org/en/docs/http/ngx_http_auth_request_module.html#auth_request
允许在提供某些文件之前发送 sub-request。当 React 想要获取必要的块时，如何确保某些 headers 始终作为 HTTP 请求的一部分发送？
关于确保请求
webpack的一个特性是加载时只取必要的chunkpages.You必要的时候可以直接用likerequire.ensurn查询chunk，所以不需要保证一定的headers.
ngx_http_auth_request_module
Ngx_http_auth_request_module和sub-request在server.It中总是用来获取web文件module.Here在nginx中总是用作后端认证module.Here是数据流向。
当你下载文件时，下载请求会传递给服务器，然后服务器return覆盖Http请求给Nginx，然后Nginx会找到确切的文件。
ngx_http_auth_request_module允许向后台服务器发送请求（如php.tomcat），并根据请求是否通过，如果通过，你将能够在后台服务器中获取文件。
nginx-----加载速度
nginx 总是获取静态文件，比如index.html.If 每次都必须验证每个js/css 的权限，然后获取它抛出，页面加载速度会很慢。
关于如何认证
因为你已经分开了 app.Here 有点 suggestions.You 可以通过只在认证中导入限制部分来获得认证请求 file.And webpack 将自动处理其余部分。
在 non-restricted 部分从服务器获取数据，其中包含用于验证的信息，如下所示：
根据服务器中的信息进行身份验证，并将类型等其他信息传回前端
- 根据类型信息查看。
if (this.props.type === "restrict"){
<restrict component/>
} else {
<non-restrict component/>
}
我无法理解为什么您需要阻止未经身份验证的恶意用户访问您的静态块。
动态导入和代码拆分主要用于减少大型应用程序的包大小，因为用户不一定需要所有东西。
为了保护您的应用，您需要防止用户查看或篡改他们无权访问的数据。这意味着安全性取决于您的应用正在与之通信的API。
我的工作：
- 拒绝对 API
的未经身份验证的请求
- 在身份验证时保留令牌客户端
- 在所有请求上传递并检查令牌
- 过时时销毁令牌并重定向到登录
- 当用户无法访问某些数据或最好不要显示他们无权访问的内容时通知、重定向用户
我确定你已经做了我上面写的，我想强调的是块基本上是空的 UI 填充了来自安全 API.
的数据
假设我有恶意，我绕过客户端路由以访问受限块。它将是一个空的 UI 和安全的 API 路由，我将无法用它做任何事情。
如果您有非常特殊的需求，您可能需要编写一个 webpack 插件。
我使用代码拆分将应用程序的受限部分分成不同的块。到目前为止，这工作得很好，现在我想确保除非经过身份验证，否则文件本身不会得到服务。我正在考虑使用 ngx_http_auth_request_module
http://nginx.org/en/docs/http/ngx_http_auth_request_module.html#auth_request
允许在提供某些文件之前发送 sub-request。当 React 想要获取必要的块时，如何确保某些 headers 始终作为 HTTP 请求的一部分发送？
关于确保请求
webpack的一个特性是加载时只取必要的chunkpages.You必要的时候可以直接用likerequire.ensurn查询chunk，所以不需要保证一定的headers.
ngx_http_auth_request_module
Ngx_http_auth_request_module和sub-request在server.It中总是用来获取web文件module.Here在nginx中总是用作后端认证module.Here是数据流向。
当你下载文件时，下载请求会传递给服务器，然后服务器return覆盖Http请求给Nginx，然后Nginx会找到确切的文件。
ngx_http_auth_request_module允许向后台服务器发送请求（如php.tomcat），并根据请求是否通过，如果通过，你将能够在后台服务器中获取文件。
nginx-----加载速度
nginx 总是获取静态文件，比如index.html.If 每次都必须验证每个js/css 的权限，然后获取它抛出，页面加载速度会很慢。
关于如何认证
因为你已经分开了 app.Here 有点 suggestions.You 可以通过只在认证中导入限制部分来获得认证请求 file.And webpack 将自动处理其余部分。
在 non-restricted 部分从服务器获取数据，其中包含用于验证的信息，如下所示：
根据服务器中的信息进行身份验证，并将类型等其他信息传回前端
- 根据类型信息查看。
if (this.props.type === "restrict"){
<restrict component/>
} else {
<non-restrict component/>
}
我无法理解为什么您需要阻止未经身份验证的恶意用户访问您的静态块。
动态导入和代码拆分主要用于减少大型应用程序的包大小，因为用户不一定需要所有东西。
为了保护您的应用，您需要防止用户查看或篡改他们无权访问的数据。这意味着安全性取决于您的应用正在与之通信的API。
我的工作：
- 拒绝对 API 的未经身份验证的请求
- 在身份验证时保留令牌客户端
- 在所有请求上传递并检查令牌
- 过时时销毁令牌并重定向到登录
- 当用户无法访问某些数据或最好不要显示他们无权访问的内容时通知、重定向用户
我确定你已经做了我上面写的，我想强调的是块基本上是空的 UI 填充了来自安全 API.
的数据假设我有恶意，我绕过客户端路由以访问受限块。它将是一个空的 UI 和安全的 API 路由，我将无法用它做任何事情。
如果您有非常特殊的需求，您可能需要编写一个 webpack 插件。