阅读外部网站提交的 Angular 中的 POST 表单 [英] Read POST form in Angular submitted by external websites

问题描述

I am developing a website with Java for the backend and Angular for frontend. There is a situation when some external websites may send data to my website using POST form. For instance,

▼ General
        Request URL: https://myangularwebsite/
        Request Method: POST
        ...

▼ Request Headers
        Content-Type: application/x-www-form-urlencoded
        Host: myangularwebsite
        Origin: https://externalwebsite
        Referer: https://externalwebsite/send.form?id=0
        ...

▼ Form data
        ID: 0000000
        TIME: 2017.06.04 11:53:58
        SIGNATURE: ...geirgmGKFGJWR...
        ...

Now, I need to capture the form in Angular somehow, send/redirect it to the backend to validate the signature and return the answer back to Angular to proceed working with this website. I tried posting to my website to test how it might work using Postman, but get Cannot POST /.

I know how to work with GET and URL query parameters in Angular but I think I need to process a POST request based on headers I see with Chrome DevTools 'Network' section when coming from externalwebsite to myangularwebsite.

Should I dedicate a route in the backend and expose it, for example, .../api/external in my backend and tell these websites to use this link instead of directly posting to my Angular website's homepage?

I have already read another question ( How to read form post data in Angular 2 typescript? ) which is somewhat similar but I do not think using PHP is the right way for me as the website I am developing already has an older version written in PHP.

解决方案

The answer at the link you provided is correct: you cannot do it in just Javascript, you have to use some server-side code. They mention PHP as an example, but any server-side component will do, and as you have Java at your backend, let it be Java.

So, when an HTTP request comes from an external site, you have to use a server-side component to handle it. But there are some options.

1. If this request is made using your user browser (so it is something like a redirect, but using a POST method), then you can do the following: catch that request at your backend, output some javascript with some data to the user's browser and process that data in your Angular code. Or this could be a redirection to your main Angular entry point, it is up to you.

2. If this request is made by some other means (for example, this is a server-to-server request made with with curl like a notification from a Credit Card processing), with no browser involved, then you don't need to have any Javascript (Angular or whatever it could be) as they are needed for browser only. In this case you just handle the request at your server-side.

In both cases, it seems plausible to dedicate some special endpoint for handling (or landing) such externally-originated requests.

这篇关于阅读外部网站提交的 Angular 中的 POST 表单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！