How to store value in a string object and display this element on another page?

0

My function myFunction takes the username and password elements typed, and sends those values storing in a global variable to the next page.

My function tToken authenticates this information and plays to the next page the valid Token for me to manipulate.

The problem is that I can not do or think of a way to play the login and password typed in the field for the next pages dynamically. Then I can do this but it works only on the LOGIN page, it displays the filled object only on the login page. When login is done and authenticated, after updating the page everything disappears, exactly because the values I want are stored in variables. How to do this, other than by variables?

var globalcredential =  "/v1/credentials";
var globalauth = "/v1/auth";
var userlogin = new String();
var passwordlogin = new String();

function myFunction(){
       var userElement = document.getElementsByName('username');
       var passwordElement = document.getElementsByName('password');
       userlogin = $(userElement).val().toString();
       passwordlogin = $(passwordElement).val().toString();
    };



function auth(){

var account = {
        grant_type: "password",
        login : userlogin,
        senha : passwordlogin
    };

    var jsonAccount = JSON.stringify(account);

    console.log(jsonAccount);
    $.ajax({
                  type: "POST" 
                , method : "POST"
                , url : globalauth
                , contentType : "application/json"
                , dataType : "json"
                , data: jsonAccount
                ,success : function(data){
                    console.log("oi");

                },beforeSend : function(request){
                request.setRequestHeader('Content-Type', 'application/json');
        },
        }).done(function(response, status){
          console.log(response,status);     
        }).fail(function(error){
          console.log(error);
        }).always(function(response, status){
        });
}

var classname = document.getElementsByClassName("buttonlogin");

 Array.from(classname).forEach(function(element) {
          element.addEventListener('click', myFunction);
                  element.addEventListener('click', auth);
      });
    
asked by anonymous 07.02.2018 / 20:33

2 answers

0

The idea would be an extension to assist an Angular system, where I pull information from an x server and use this information to optimize automatic logins in z and v.

I used a specific google.storage documentation function that would be slightly different from the localstorage link With localstorage would not be possible, as it already says is local, I could not use it to authenticate and provide the token to pull the logins and passwords stored on a server to automatically access the urls z v and.

GET example:

   tToken(function(d){
            $.ajax({
                  type: "GET"
                , method : "GET"
                , url : globalauth
                , contentType : "application/json"
                , dataType : "json"
                , Authorization : "Bearer" + d

Below is just the function that dynamically captures what is typed and authenticates the token to later perform a GET ajax of this information to pull the data from the database.

 function tToken(callback){
    var b;
    var a;
    chrome.storage.local.get('login', function (result) {
              b = result.login;
              console.log(b); 
          chrome.storage.local.get('password', function (result) {
              a = result.password; 

  var account = {
            grant_type: "password",
            login : b,
            senha : a
        };

  var jsonAccount = JSON.stringify(account);
  console.log(jsonAccount);
        $.ajax({
                      type: "POST" 
                    , method : "POST"
                    , url : globalext
                    , contentType : "application/json"
                    , dataType : "json"
                    , data: jsonAccount
                    ,success: function(data){
                        var obs1 = JSON.stringify(data);
                        var newa = JSON.parse(obs1);  
                        var key = newa.data["token"];
                        callback(key);
                    },beforeSend : function(request){
                    request.setRequestHeader('Content-Type', 'application/json');                   },
    }).done(function(response, status){
    }).fail(function(error){
      console.log(error);
    }).always(function(response, status){
    });
    });
    });
  }

function save(){
    var userElement = document.getElementsByName('username');
    var passwordElement = document.getElementsByName('password');
    var channels = $(userElement).val();
    var keywords = $(passwordElement).val();

    chrome.storage.local.set({'login': channels});
    chrome.storage.local.set({'password': keywords});
    console.log(keywords);
    console.log(channels);
}


var classname = document.getElementsByClassName("buttonlogin");

 Array.from(classname).forEach(function(element) {
           element.addEventListener('click', save);
      });
    
21.02.2018 / 19:13
0

You can use the window.localStorage object (see more at link ) With it you will be able to store information on one page and retrieve it on another page as it stores the information in the browser.

Increasing your code:

function myFunction(){
   var userElement = document.getElementsByName('username');
   var passwordElement = document.getElementsByName('password');
   userlogin = $(userElement).val().toString();
   passwordlogin = $(passwordElement).val().toString();

   // armazenar o usuário
   window.localStorage.setItem('usuario', userLogin);

};

On a subsequent page, you can get the user with the statement:

var usuario = window.localStorage.getItem('usuario');

When you need to remove the item, use:

window.localStorage.removeItem('usuario')

But beware of storing sensitive information (such as passwords) in the browser, they can be accessed by another page! It is best to store with some encryption. The most common authentication mechanisms in different languages do not require you to send the password to each request, so it's worth not storing it! Usually for subsequent requests, after login, a session number generator is used by the server, or encrypted tokens, as in JWT.

    
07.02.2018 / 21:48