1

I am working on a react project, that will replace the login page of our legacy system. This react app, however, still need to make a post request to this legacy ASP page because of integration and business rules reasons.

My challenge is to integrate the return of this ASP with react. The legacy response is a string in case of error, or a script html tag in case of success.

Changing the legacy response is not an option

Error response example: Password/Username is invalid

Success example:

<script type='text/javascript'>top.location = 'http://www.contoso.com/myIndexPage.asp?token={FFF6F5F0F-F000-0F00-0000-F000F00F0000}'</script>

My problem is how to proper handle the request, and if is a success, execute this script tag automatically? I have tried using dangerouslySetInnerHTML, but it is not executing the script. The script tag is being inserted in the HTML correctly though.

This is how I am using it:

<div dangerouslySetInnerHTML={{__html: this.myASPReturn}} />

How do I execute the success script tag in case of a valid login, or just show the error message in case of an invalid login?

Tiago B
  • 1,937
  • 14
  • 34

1 Answers1

1

This is one solution.

First parse the html. I used this technique: Parse an HTML string with JS

const string = "<script type='text/javascript'>top.location = 'http://www.contoso.com/myIndexPage.asp?token={FFF6F5F0F-F000-0F00-0000-F000F00F0000}'</script>"

const el = document.createElement('div');
el.innerHTML = string;

Then get the code from the script element and eval() it.

const scriptString = el.firstChild.innerText;
eval(scriptString);
Max
  • 1,517
  • 9
  • 16
  • The response is a script only if it succeed. The error response will be a string, like: `"Invalid user"`. If I eval() this error message I will get an exception. – Tiago B Feb 20 '19 at 19:59
  • @TiagoBrenck you could handle that in a try/catch – Max Feb 20 '19 at 20:05