CODEWITHSUNDEEP
javascripthpcc-eclhpcc
decoded051
decoded051

Reputation: 91

How to create a JSON request to a roxie query on a cluster with credentials?

I am currently using a HPCC Cluster, which has credentials for logging in. While creating a json request, to get the response from the roxie query, we are getting redirected to the login page. How do I use my credentials and create a request to get the response, using javascript?

<script>
document.getElementById('loginForm').addEventListener('submit', function(event) {
  event.preventDefault();

  var username = 'username';
  var password = 'password';

  login(username, password)
    .then(() => {
      document.getElementById('output').innerHTML = '<p>Login successful.</p>';
      window.location.href = 'http://cluster_abc:8002/esp/files/Login.html';
    })
    .catch(error => {
      console.error('Error:', error);
      document.getElementById('output').innerHTML = '<p>Login failed. Please try again.</p>';
    });
});

function login(username, password) {
  return new Promise((resolve, reject) => {
    var loginUrl = 'http://university-roxie.us-hpccsystems-dev.azure.lnrsg.io:8002/esp/login';
    var formData = new FormData();
    formData.append('username', username);
    formData.append('password', password);

    fetch(loginUrl, {
      method: 'POST',
      body: formData
    })
      .then(response => {
        if (!response.ok) {
          throw new Error('Login failed');
        }
        resolve();
      })
      .catch(error => {
        reject(error);
      });
  });
}
</script>

The following was the output of the above code: enter image description here

and when I use it in no CORS mode, I am getting the following login failed error: enter image description here

Upvotes: 2

Views: 55

Answers (1)

Jeremy
Jeremy

Reputation: 31

One way to do this would be to submit a request to the desired API and include a Basic Authorization header. For example, fetching the WUInfo for a given Workunit ID:

const headers = new Headers();
headers.set("Authorization", `Basic ${btoa("username:password")}`);
headers.set("Content-Type", "application/json");

fetch("https://clustername:8010/WsWorkunits/WUInfo", {
    method:'POST',
    headers: headers,
    body: JSON.stringify({
        WUInfoRequest: {
            Wuid: "W20240430-130438"
        }
    })
})
.then(async (response) => {
    const json = await response.json();
    console.log(json);
})
.catch(err => console.error(err));

You could check https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch#headers for more info on Fetch, Headers, etc.

You might also want to take a look at the HPCC-JS library (https://github.com/hpcc-systems/visualization). There are some mechanisms in the comms package for communicating with a cluster, querying WUs, and such.

Upvotes: 3

Related Questions