【问题标题】:Is there a way to send data from client to server in angular universal?有没有办法以角度通用的方式将数据从客户端发送到服务器?
【发布时间】:2018-03-30 10:37:54
【问题描述】:

我们正在使用 Angular 5.2.8 和 nguniversal/express-engine 5.0.0-beta.6,并且我们正在使用外部支付服务。支付系统需要将表单发布到他们的 URL 并具有 callbackURL 的输入。

该请求的回调向我们发送一个带有数据的 POST 请求。我们需要使用用户凭据将该数据发布到我们的后端。在 Angular 中,我们无法接收发布请求。

我已经尝试了一些解决方案,但到目前为止都没有奏效:

  • 在 express 中监听帖子,然后将数据传输到 angular
  • 试图向服务器发送 cookie 或用户信息,以便向我们的后端发出服务器到服务器的请求。

我需要将回调帖子的内容发送到客户端,或者将用户凭据传递到服务器端。

【问题讨论】:

    标签: angular angular5 angular-universal


    【解决方案1】:

    您的第一种方法应该有效。为了真正通用,您可以向您的 Angular 通用应用程序提供快速请求,以便需要请求值的组件/服务可以访问它

    server.ts

    app.engine('html', (_, options, callback) => {
    
    
      renderModuleFactory(AppServerModuleNgFactory, {
        // Our index.html
        document: template,
        url: options.req.path,
        extraProviders: [
          {
            provide: 'httpRequest',
            useValue: options.req,
    
          }
        ]
      }).then(html => {
    
        callback(null, html);
      });
    });
    
    //Handle your post
    app.post('/yourpostUrl', (req, res) => {
    
      res.render(join(DIST_FOLDER, 'browser', 'index.html'), {req});
    });
    

    然后提供请求的角度边。不要忘记将其设为可选,以免客户端抛出错误

    component.ts

     constructor(@Optional() @Inject('httpRequest') private httpRequest: any)
      {
          //here you can use httpRequest's valuesy
      }
    

    【讨论】:

    • 抱歉回复晚了。我无法在我们的项目中使用此解决方案,无法获取 httpRequest 对象,我认为这是因为身份验证流程和 authGuards。但是我们通过在服务器端捕获帖子并在客户端调用另一个服务以检查一切是否正常后解决了这个问题。
    • @David 你知道是否可以在 Angular 组件中使用 redis 吗?服务器端?例如。将渲染期间api调用中使用的GUID树传递回express,以便将来express可以处理缓存失效? stackoverflow.com/questions/55737200/…
    【解决方案2】:

    在 Angular Universal 项目中,在 server.ts 文件中,我们编写以下代码。

    所以,基本上,我们将浏览器重定向到所有 Angular 路由的 index.html。但是,以/api/* 开头的 URL 被排除在 API 之外,因为它们在下面。看来您需要有以 /api/* 开头的回调 URL,这就是您需要有一个 HTTP POST API 来处理调用的地方。

    app.get('/api/*', (req, res) => {
    
    });
    
    // Server static files from /browser
    app.get('*.*', express.static(join(DIST_FOLDER, 'browser')));
    
    // All regular routes use the Universal engine
    app.get('*', (req, res) => {
      res.render(join(DIST_FOLDER, 'browser', 'index.html'), { req });
    });
    

    【讨论】:

    • 感谢您的回答。我在服务器端处理 app.post('/someUrl') ,我可以读取 res.body 但我需要一种方法将其发送到 Angular。
    • 啊,对不起。那我就错了。我暂时没有现成的答案。服务人员可以在这里帮忙吗?需要检查...
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2022-01-17
    • 1970-01-01
    • 2013-04-11
    • 2021-12-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多