部署Angular App w/ One One路线代理

发布于 2025-01-31 03:01:10 字数 2382 浏览 4 评论 0原文

我有一个带有一个在本地运作良好的代理的Angular应用程序。有一条路由使用节点API调用来利用它。

我的角度服务中的node.js

const express = require('express');
const api_service = require('./apiService');
const app = express();

app.get('/getData/:date', (req, res) => {
  const date = req.params.date;
  api_service.fetchData(...)
    .then(response => {
      res.json(response)
    })
    .catch(error => {
      res.send(error)
    })
})

app.listen(3000, () => {
  console.log("Server started in port 3000!");
});

函数:

  fetchData(date: string) {
    const requestOptions: Object = {
      responseType: 'text',
    };
    this._http
      .get<string>('/api/getData/' + date)
      .pipe(
        map((data) => {
          this.result = data;
        })
      )
      .subscribe((data) => {
        this.mediaSource.next(this.result);
        if (Object.keys(this.result).length != 0) {
          this.history.push(this.result);
        }
      });
  }

proxy-prod.config.json

{
    "/api/*": {
        "target": "https://example.com",
        "secure": false,
        "changeOrigin": true,
        "logLevel": "debug",
        "pathRewrite": { "^/api": "" }
    }
}

proxy-local.conf.conf.json

{
    "/api/*": {
        "target": "http://localhost:3000",
        "pathRewrite": {
            "^/api": ""
        },
        "secure": false,
        "changeOrigin": true,
        "logLevel": "debug"
    }
}

angular.json

 "serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "options": {
            "browserTarget": "ui-dev:build",
            "proxyConfig": "proxy-local.conf.json"
          },
          "configurations": {
            "production": {
              "browserTarget": "ui-dev:build:production",
              "proxyConfig": "proxy-prod.config.json"
            }
          }
        },

ng服务功能非常完美。 ng服务 - 生产和ng构建-aot -prod-utput-hashing无。

我遇到的错误是:

headers: d, status: 200, statusText: 'OK', url: 'myexample.com', ok: false

我已经在我的请求中尝试了此错误,但是它们也会引起错误:

const headers = new HttpHeaders().set('Content-Type', 'text/plain; charset=utf-8');
{ headers, responseType: 'text'}

一直在搜索,测试和解剖代码很多小时,并且不确定如何进行。你可以协助吗?

谢谢

I have an Angular app w/ a proxy that's working well in local. There's one route that utilizes it with a Node API call.

Node.js

const express = require('express');
const api_service = require('./apiService');
const app = express();

app.get('/getData/:date', (req, res) => {
  const date = req.params.date;
  api_service.fetchData(...)
    .then(response => {
      res.json(response)
    })
    .catch(error => {
      res.send(error)
    })
})

app.listen(3000, () => {
  console.log("Server started in port 3000!");
});

Function in my Angular Service:

  fetchData(date: string) {
    const requestOptions: Object = {
      responseType: 'text',
    };
    this._http
      .get<string>('/api/getData/' + date)
      .pipe(
        map((data) => {
          this.result = data;
        })
      )
      .subscribe((data) => {
        this.mediaSource.next(this.result);
        if (Object.keys(this.result).length != 0) {
          this.history.push(this.result);
        }
      });
  }

proxy-prod.config.json

{
    "/api/*": {
        "target": "https://example.com",
        "secure": false,
        "changeOrigin": true,
        "logLevel": "debug",
        "pathRewrite": { "^/api": "" }
    }
}

proxy-local.conf.json

{
    "/api/*": {
        "target": "http://localhost:3000",
        "pathRewrite": {
            "^/api": ""
        },
        "secure": false,
        "changeOrigin": true,
        "logLevel": "debug"
    }
}

angular.json

 "serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "options": {
            "browserTarget": "ui-dev:build",
            "proxyConfig": "proxy-local.conf.json"
          },
          "configurations": {
            "production": {
              "browserTarget": "ui-dev:build:production",
              "proxyConfig": "proxy-prod.config.json"
            }
          }
        },

ng serve works perfectly.
ng serve --prod and ng build --aot --prod --output-hashing none do not.

The error I'm getting is:

headers: d, status: 200, statusText: 'OK', url: 'myexample.com', ok: false

I've tried this in my request but they cause errors too:

const headers = new HttpHeaders().set('Content-Type', 'text/plain; charset=utf-8');
{ headers, responseType: 'text'}

Been searching, testing, and dissecting code for many hours and not sure how to proceed. Can you anyone assist?

Thanks

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文