无法使用云应用程序中的 http 客户端读取 angular 应用程序中的 json 文件

Question

我在部署后使用 http 客户端读取 angular 应用程序中的 JSON 文件时遇到问题。仅供参考，代码在我的本地机器上运行良好并且能够获取 JSON 详细信息。将其部署到服务器后，尽管文件在服务器中不可用，但出现 404 文件未找到错误。

文件位置： src/assets/data/roles.json JSON file location screenshot

错误信息： 404 找不到文件

请注意，我在 angular.json 文件的资产数组中添加了 src/assets/data。部署后我仍然在服务器中收到文件未找到错误，但在本地机器上运行良好。资产文件夹中的图像文件也没有问题。它工作正常。不确定为什么无法读取服务器中的 JSON 文件。

angular.json:

"assets": ["src/favicon.ico", "src/assets",
          "src/assets/data"],

service.ts:

        return this.http.get('/assets/data/roles.json').toPromise().then(res => {
        this.data.setRoles(res);
        this.acceptedRoles = this.authService.getAcceptedRoles(state.url);
        this.userRoles = this.authService.getUserRoles();
        matchingRoles = this.userRoles.filter(x => this.acceptedRoles.includes(x))
        if (matchingRoles.length > 0) {
            return true;
        }
        else {
            return false;
        }

Answer 1

我找到了导致问题的原因。服务器未配置为处理或读取 JSON 文件。所以我在 src 文件夹下的 web.config 文件中添加了创建和添加以下代码。问题已解决。

web.config

<?xml version="1.0" encoding="UTF-8" ?>
<configuration>
<system.webServer>
    <staticContent>
        <remove fileExtension=".json" />
        <remove fileExtension=".woff" />
        <remove fileExtension=".woff2" />
        <mimeMap fileExtension=".json" mimeType="application/json" />
        <mimeMap fileExtension=".woff" mimeType="application/font-woff" />
        <mimeMap fileExtension=".woff2" mimeType="application/font-woff" />      
    </staticContent>
</system.webServer>

无法使用云应用程序中的 http 客户端读取 angular 应用程序中的 json 文件

Unable to read json file in angular application using http client in cloud application

json

angular

http-status-code-404

angular-httpclient

file-not-found