tobiasg tobiasg - 11 days ago 7
Javascript Question

Writing out local IP in replace() (jQuery)

I want to replace a localhost adress pasted into an input field with the current local IP adress of the user. I've already got this jQuery script where the user enters the localhost adress in an input field, clicks a button and then receives the adress with "localhost" replaced with something else in the input field and in the clipboard automatically.

//Clicking button
$("button").click(function() {
var $textArea = $("input");

//Entered texts value
var oldText = $textArea.val();

//Entered texts value, with words replaced
var newText = oldText.replace("localhost", "something else");

//Replace old value with new value and select it
$textArea.val(newText).select();

//Copy new text to clipboard and view new text in textarea
document.execCommand('copy');
$textArea.val(newText);
});


Now I want the script to replace "localhost" with the actual local IP adress dynamically (instead of "something else", in the code above). In order to return the local IP adress, I'm using this snippet. I got some help turning the snippet into a function that I can use, that returns the local IP adress.

function getLocalIPAddress() {
window.RTCPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection; //compatibility for firefox and chrome
var pc = new RTCPeerConnection({iceServers:[]}), noop = function(){};
pc.createDataChannel(""); //create a bogus data channel
pc.createOffer(pc.setLocalDescription.bind(pc), noop); // create offer and set local description
var myIP;
pc.onicecandidate = function(ice){ //listen for candidate events
if(!ice || !ice.candidate || !ice.candidate.candidate) return;
myIP = /([0-9]{1,3}(\.[0-9]{1,3}){3}|[a-f0-9]{1,4}(:[a-f0-9]{1,4}){7})/.exec(ice.candidate.candidate)[1];
pc.onicecandidate = noop;
};
return myIP;
}


However, I'm kind of lost in how I would do to use the function in the jQuery code, so that "localhost" is replaced with what the
getLocalIPAddress
function returns. This is how I tried to do it, but I end up getting "localhost" replaced with
undefined
:

function getLocalIPAddress() {
window.RTCPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection; //compatibility for firefox and chrome
var pc = new RTCPeerConnection({iceServers:[]}), noop = function(){};
pc.createDataChannel(""); //create a bogus data channel
pc.createOffer(pc.setLocalDescription.bind(pc), noop); // create offer and set local description
var myIP;
pc.onicecandidate = function(ice){ //listen for candidate events
if(!ice || !ice.candidate || !ice.candidate.candidate) return;
myIP = /([0-9]{1,3}(\.[0-9]{1,3}){3}|[a-f0-9]{1,4}(:[a-f0-9]{1,4}){7})/.exec(ice.candidate.candidate)[1];
pc.onicecandidate = noop;
};
return myIP;
}

//Clicking button
$("button").click(function() {
var $textArea = $("input");

//Entered texts value
var oldText = $textArea.val();

//Entered texts value, with words replaced
var newText = oldText.replace("localhost", getLocalIPAddress());

//Replace old value with new value and select it
$textArea.val(newText).select();

//Copy new text to clipboard and view new text in textarea
document.execCommand('copy');
$textArea.val(newText);
});


I'm obviously doing something fundamentally wrong.

Answer

I got this solution from another developer forum. Apparently the easiest way to make this work is to create a function that can run when the result is done.

function getLocalIPAddress(success) {
    window.RTCPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection; //compatibility for firefox and chrome
    var pc = new RTCPeerConnection({iceServers:[]}), noop = function(){};
    pc.createDataChannel(""); //create a bogus data channel
    pc.createOffer(pc.setLocalDescription.bind(pc), noop); // create offer and set local description

    pc.onicecandidate = function(ice){ //listen for candidate events
        if(!ice || !ice.candidate || !ice.candidate.candidate) return;
        myIP = /([0-9]{1,3}(\.[0-9]{1,3}){3}|[a-f0-9]{1,4}(:[a-f0-9]{1,4}){7})/.exec(ice.candidate.candidate)[1];
        pc.onicecandidate = noop;

    success(myIP);
    };
}

//Clicking button
$("button").click(function() {

    var $textArea = $("input");

    //Entered texts value
    var oldText = $textArea.val();

    getLocalIPAddress( function (ip) {

        //Entered texts value, with words replaced
        var newText = oldText.replace("localhost", ip);

        console.log(newText);
        //Replace old value with new value and select it
        $textArea.val(newText).select();
        //Copy new text to clipboard and view new text in textarea
        document.execCommand('copy');
        $textArea.val(newText);

    } );
});