Fetch problem

General
1

hello I just learn about fuse and also java script, I have a problem. I can’t add Observable parameter into fetch function and convert to string. But I must prepare url with username and password parameters. Please, help me!

2

I am not entirely sure how you want to do it, but this example show two different ways of passing the login information to a server. Either using basic authentication or passing them as a json object:

<App Theme="Basic">
    <JavaScript>
        var o = require("FuseJS/Observable");
        var username = o("");
        var password = o("");

        var uri = "https://<yourpage>.com/&quot;
        var sendRequest = function() {
            var options = {
                method: 'POST',
                headers: {
                    'Accept': 'application/json',
                    'Content-Type': 'application/json',
                    'Authorization': 'Basic ' + btoa(username.value + ':' + password.value)
                },
                body: JSON.stringify({
                    username: username.value,
                    password: password.value,
                })
            };
            fetch(uri, options).then(function(response) {
                var data = JSON.stringify(response)
                debug_log(data);
            }, function(error) {
                debug_log(error);
            });
        };

        module.exports = {
            username: username, 
            password: password,
            send: sendRequest,
        };
    </JavaScript>
    <StackPanel>
        <TopFrameBackground />
        <TextInput Value="{username}" />
        <TextInput Value="{password}" IsPassword="True" />
        <Button Text="Send" Clicked="{send}" />
    </StackPanel>
</App>
3

thank you so much you are right I couldn’t explain my problem, anyway I just want two parameter (username,password) and create an url and wonder

var url = Observable(function () {
    return 'http://aasgadfs/ashx/fuse.ashx?komut=login&user_code=&#39; + username.value + '&user_pass=' + password.value + '';
})

thing I want and work. but

fetch('http://aasgadfs/ashx/fuse.ashx?komut=login&user_code=&#39; + username.value + '&user_pass=' + password.value + '')
    .then(function(response) { return response.json(); })
    .then(function(responseObject) { data1.value = responseObject; });

or fetch(url) doesn’t work. I don’t understand why?

4

Does it work if you just hardcode the values into the uri?

You should probably URI encode the querystring before sending it. Like this:

var queryString = '&user_code=' + encodeURIComponent(username.value) + '&user_pass=' + encodeURIComponent(password.value) + '';
fetch('http://aasgadfs/ashx/fuse.ashx?komut=login&#39; + queryString)
  .then(function(response) { return response.json(); })
  .then(function(responseObject) { data1.value = responseObject; })
  .catch(function(errpr) { console.log(error); });

Also take note of the catch I added to the bottom of the chain, that will print out any errors.

5

I mean

var url = Observable(function () { return ‘http://aasgadfs/ashx/fuse.ashx?komut=login&user_code=’ + username.value + ‘&user_pass=’ + password.value + ‘’; })

create right url that I want, but the others don’t. So the fetch don’t work because of wrong url. Your way also prepare right url -> (queryString) but it doesnt work into fetch func. ->(http: … + queryString) so the same result, I think I must try something else. Thank you for your help.

6

hello again, we finally found a method, may be useful somebody

function login(args){
    var queryString = '&user_code=' + encodeURIComponent(username.value) + '&user_pass=' + encodeURIComponent(password.value) + '';

  fetch('http://aasgadfs/ashx/fuse.ashx?komut=login&#39; + queryString)
    .then(function(response) { return response.json(); })
    .then(function(responseObject) { data1.value = responseObject; })
    .catch(function(errpr) { console.log(error); });
};

and call login func when button clicked, it worked. (By the way I think don’t have to use encodeURIComponent, the problem is about the func.) Thank you again.

7

If a user have any special character in the password you have to use encodeURIComponent. I am happy it worked out for you :slight_smile: