Pawan
Pawan

Reputation: 32321

javascript : sending custom parameters with window.open() but its not working

<html>
<head>
<script>
function open_win()
{
    window.open("http://localhost:8080/login","mywindow")
}
</script>
</head>
<body>

<input type="button" value="Open Window" onclick="open_win()">

</body>
</html>

Hi ,

On click of a button , i am opening a new website (My web site ) I have two text fields ( One Text Field and another Password Field) , i am trying to send this values to the other opened window .

But its not working as I want.

I have tried the following ways

1.  window.open("http://localhost:8080/login?cid='username'&pwd='password'","mywindow")

2.  window.open("http://localhost:8080/login","mywindow")
    mywindow.getElementById('cid').value='MyUsername'
    mywindow.getElementById('pwd').value='mypassword'

Could anybody please help me if this is possible or not ??

Sorry for the incomplete details , its a Post request .

Upvotes: 12

Views: 184779

Answers (7)

tofsjonas
tofsjonas

Reputation: 61

I agree that passing username and password as parameters is a bad idea, no matter how you do it.

However, if it's same site, you could use sessionStorage, like so:

sessionStorage.setItem('username', username)
sessionStorage.setItem('password', password)
window.open("http://localhost:8080/login","mywindow")

And then in the opened window:

var username = sessionStorage.getItem('username')
var password = sessionStorage.getItem('password')

// if you no longer need them:
sessionStorage.removeItem('username')
sessionStorage.removeItem('password')

Upvotes: 1

Aun Abbas
Aun Abbas

Reputation: 590

I found this method very useful, I hope this will be helpful for many users too.

// --> screen 1:

var url = 'screen_2_url';
var id = 'some_ID';


window.open(url + '?id=' + id);

This will open the Screen 2 tab. There you can get the passed values like this:

// --> screen 2:

const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
const id = urlParams.get('id');

Upvotes: 1

polin
polin

Reputation: 2835

You can use this but there remains a security issue

<script type="text/javascript">
function fnc1()
{
    var a=window.location.href;

    username="p";
    password=1234;
    window.open(a+'?username='+username+'&password='+password,"");

}   
</script>
<input type="button" onclick="fnc1()" />
<input type="text" id="atext"  />

Upvotes: 2

user1801972
user1801972

Reputation:

Please find this example code, You could use hidden form with POST to send data to that your URL like below:

function open_win()
{
    var ChatWindow_Height = 650;
    var ChatWindow_Width = 570;

    window.open("Live Chat", "chat", "height=" + ChatWindow_Height + ", width = " + ChatWindow_Width);

    //Hidden Form
    var form = document.createElement("form");
    form.setAttribute("method", "post");
    form.setAttribute("action", "http://localhost:8080/login");
    form.setAttribute("target", "chat");

    //Hidden Field
    var hiddenField1 = document.createElement("input");
    var hiddenField2 = document.createElement("input");

    //Login ID
    hiddenField1.setAttribute("type", "hidden");
    hiddenField1.setAttribute("id", "login");
    hiddenField1.setAttribute("name", "login");
    hiddenField1.setAttribute("value", "PreethiJain005");

    //Password
    hiddenField2.setAttribute("type", "hidden");
    hiddenField2.setAttribute("id", "pass");
    hiddenField2.setAttribute("name", "pass");
    hiddenField2.setAttribute("value", "Pass@word$");

    form.appendChild(hiddenField1);
    form.appendChild(hiddenField2);

    document.body.appendChild(form);
    form.submit();

}

Upvotes: 4

Carfire
Carfire

Reputation: 49

You can try this instead


var myu = document.getElementById('myu').value;
var myp = document.getElementById('myp').value;
window.opener.location.href='myurl.php?myu='+ myu +'&myp='+ myp;

Note: Do not use this method to pass sensitive information like username, password.

Upvotes: 1

Roman Abt
Roman Abt

Reputation: 444

if you want to pass POST variables, you have to use a HTML Form:

<form action="http://localhost:8080/login" method="POST" target="_blank">
    <input type="text" name="cid" />
    <input type="password" name="pwd" />
    <input type="submit" value="open" />
</form>

or:

if you want to pass GET variables in an URL, write them without single-quotes:

http://yourdomain.com/login?cid=username&pwd=password

here's how to create the string above with javascrpt variables:

myu = document.getElementById('cid').value;
myp = document.getElementById('pwd').value;
window.open("http://localhost:8080/login?cid="+ myu +"&pwd="+ myp ,"MyTargetWindowName");

in the document with that url, you have to read the GET parameters. if it's in php, use:

$_GET['username']

be aware: to transmit passwords that way is a big security leak!

Upvotes: 14

Quentin
Quentin

Reputation: 943230

To concatenate strings, use the + operator.

To insert data into a URI, encode it for URIs.

Bad:

var url = "http://localhost:8080/login?cid='username'&pwd='password'"

Good:

var url_safe_username = encodeURIComponent(username);
var url_safe_password = encodeURIComponent(password);
var url = "http://localhost:8080/login?cid=" + url_safe_username + "&pwd=" + url_safe_password;

The server will have to process the query string to make use of the data. You can't assign to arbitrary form fields.

… but don't trigger new windows or pass credentials in the URI (where they are exposed to over the shoulder attacks and may be logged).

Upvotes: 2

Related Questions