Web API return HTML

Question

I have a web application built for pharmacist.

I do business with a third party for the medication analysis...

Here's a high level of how it works...

The pharmacist logs in http://myapp.com/.
The pharmacist requires a profile analysis. The app opens a new page http://third-party.com/analyse?someparameters=something...

But the third party in question is making changes to their system. They will not accept GET anymore... That means, I will not be able to simply open a new page.

The new scenario they want me to do is:

POST http://third-party.com/analyse?someparameters=something.
They return HTML code...

Questions:

What do I do with their HTML Code?
How can I open it in a new page?

PS: Their HTML code contains reference to css and js hosted on their site and that are refered like this :

    <link rel="stylesheet" type="text/css" href="css/smoothness/jquery-ui-1.10.4.custom.min.css" />
    <link rel="stylesheet" type="text/css" href="css/bootstrap-3.1.1.min.css" />
    <!-- css -->
    <link rel="stylesheet" type="text/css" href="css/styles_globaux.css" />

I would like to have your thoughts on this? I feel like they are not doing things properly... Their API should normally returns the format I send in the accept header?

one option would be to display it in the iframe or you could parse the webpage to find any specific information you want. — Sudipta Mondal, Mar 01 '17 at 15:04
Are you talking about a real API? Or you're just linking the page? — Álvaro González, Mar 01 '17 at 15:12
@ÁlvaroGonzález They call it a API... It does not look like a real API to me.. — Baral, Mar 01 '17 at 15:13
So there's no integration (or application), it's just an `` tag or something similar? Even so, please post the code that needs fixing. Otherwise it's really hard to figure out what you're talking about. — Álvaro González, Mar 01 '17 at 15:27
@ÁlvaroGonzález As of today, it is just an .. But in the future, they will not accept GET (opening the page in another tab). I will need to POST the exact same URL that is in the ... The response to their POST is HTML code... refering their assets (css/js) what do I do with this HTML? — Baral, Mar 01 '17 at 15:51
Possible duplicate of [Make a link use POST instead of GET](http://stackoverflow.com/questions/3915917/make-a-link-use-post-instead-of-get). I suggest you review all answers, not just the top ones. — Álvaro González, Mar 01 '17 at 16:38

score 0 · Answer 1 · answered Mar 02 '17 at 20:31

Finally I created a page hosted on our site (page.html).

So instead of opening a page on their site, I open this page and I pass the third party's url as a parameter:

http://myapp.com/page.html?http://third-party.com/analyse?someparameters=something...

In page.html, there is a script that extract the third party URL and the parameters. It then dynamically creates a form and submits it:

<form method="POST" action="http://third-party.com/analyse">
    <input type="text" name="someparameters" value="something"/>
</form>

page.html:

<html>
<head>
</head>
<body>
    <script>
        function getAllUrlParams(url) {
            // get query string from url
            var queryString = url.split('?')[1]

            // we'll store the parameters here
            var obj = {};

            // if query string exists
            if (queryString) {

                // stuff after # is not part of query string, so get rid of it
                queryString = queryString.split('#')[0];

                // split our query string into its component parts
                var arr = queryString.split('&');

                for (var i = 0; i < arr.length; i++) {

                    // separate the keys and the values
                    var a = arr[i].split('=');

                    // in case params look like: list[]=thing1&list[]=thing2
                    var paramNum = undefined;
                    var paramName = a[0].replace(/\[\d*\]/, function(v) {
                        paramNum = v.slice(1, -1);
                        return '';
                    });

                    // set parameter value (use 'true' if empty)
                    var paramValue = typeof(a[1]) === 'undefined' ? true : a[1];

                    // (optional) keep case consistent
                    paramName = paramName.toLowerCase();
                    paramValue = paramValue.toLowerCase();

                    // if parameter name already exists
                    if (obj[paramName]) {
                        // convert value to array (if still string)
                        if (typeof obj[paramName] === 'string') {
                            obj[paramName] = [obj[paramName]];
                        }
                        // if no array index number specified...
                        if (typeof paramNum === 'undefined') {
                            // put the value on the end of the array
                            obj[paramName].push(paramValue);
                        }
                        // if array index number specified...
                        else {
                            // put the value at that index number
                            obj[paramName][paramNum] = paramValue;
                        }
                    }
                    // if param name doesn't exist yet, set it
                    else {
                        obj[paramName] = paramValue;
                    }
                }
            }

            return obj;
        }

        var debug = true;

        // Get third party Url
        var thirdpartyUrl = window.location.search.slice(1);
        var postAction = thirdpartyUrl.split('?')[0];


        // Create form
        var f = document.createElement("form");
        f.setAttribute('method', "post");
        f.setAttribute('action', postAction);

        // Get all parameters
        var params = getAllUrlParams(thirdpartyUrl);

        for (param in params) {
            var i = document.createElement("input"); //input element, text
            i.setAttribute('type', "text");
            i.setAttribute('name', param);
            i.setAttribute('value', params[param]);
            f.appendChild(i);
        }

        document.getElementsByTagName('body')[0].appendChild(f);
        f.submit();
    </script>
</body>
</html>

Web API return HTML

1 Answers1