Hi, I am trying very hard to embed Splunk in an external webpage using Splunk JavaScript stack but no luck so far.
I am trying a very simple example from here http://dev.splunk.com/view/SP-CAAAEWS
Anyone had luck connecting to splunk from external webpages using SplunkJS?
The difference from the example and my environment are Proxy and Scheme My environment is not https and there is no proxy.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Login Tests</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="static/splunkjs/css/bootstrap.css"/>
<style type="text/css">
.fail{
color: red;
}
.main-area {
padding: 30px;
}
</style>
</head>
<body>
<div class="main-area">
<h2>Login Form</h2>
<p>This page tests login and authentication. When you enter a
name and password, these credentials are used to log in
to Splunk.</p>
<p>If login is successful, a session key is returned and stored
in a cookie, along with the username. Then, you are redirected
to another page that uses the same session key.</p>
<br/>
<p><b>Username:</b></p>
<input id="usernamebox" type="text" value="admin">
<p><b>Password:</b></p>
<input id="pwbox" type="password" value="mypassword">
<br/>
<button class="btn" onclick="onLogin()">Log in</button>
<br/>
<div id="errorText"></div>
</div>
<script src="static/splunkjs/config.js"></script>
<script>
// Set the web site's base URL
require.config({
baseUrl: "/static"
});
// Log In button function
function onLogin() {
alert("Inside OnLogin");
require([
"jquery",
"splunkjs/splunk",
], function($, jssdk) {
alert('Inside Login');
// Get the username and passwords
var username = $("#usernamebox").val();
var password = $("#pwbox").val();
// Use the Splunk SDK for JavaScript to log in to Splunk
// Create a Service object
var http = new jssdk.ProxyHttp("/proxy");
var service = new jssdk.Service(http, {
username: username,
password: password,
scheme: "http",
host: "splunkdev",
port: 8000
});
// Log in to Splunk
service.login(function(err) {
alert('Inside Service Login');
// The session key and username are required for logging in
if (!err) {
var key = service.sessionKey;
// Save the session key and username in cookies
$.cookie("splunk_sessionkey", key);
$.cookie("splunk_username", username);
// Redirect to another page
window.location.href = "login_verify.html";
}
else {
alert('Login Failed');
$("#errorText").empty().append("<p class='fail'><br/>Login failed! See the console for error info.</p>");
console.error("Login failed: ", err);
}
});
});
}
</script>
</body>
</html>
Did a webex and discovered that this was not working because of the browsers security policies around Same Origin Policy. We verified this by running the node.exe that comes with the SDK and connecting to a local splunk install successfully.
@friscos is now attempting http://www.thegeekstuff.com/2016/09/disable-same-origin-policy/ to allow his browser to connect to his remote Splunk instance.
Obviously the final solution must contain a proxy on the webserver to address this browser restriction in production.
Update from our webex: The javascript SDK comes with a node server that can abstract the cross domain challenge. It's actually all explained in the dev docs @ http://dev.splunk.com/view/javascript-sdk/SP-CAAAEWQ
Hi SloshBurch ,
I followed all the examples and its working fine with the node server.
How do I configure it on IIS server to work as a Proxy for connecting to Splunk Web from outside? Can you please share settings on IIS server, if i need to add proxy-pass in web.conf, if there is any snippet that you can share?
Thanks in advance.
@AshChakor - My memory is failing me now (the rest of the thread was three years ago) . I can't speak to how to set it up on IIS (not my background). When I navigate to the web.conf spec file and search for proxy
a number of settings are discovered. Although maybe your best luck will come from one of these pages: https://docs.splunk.com/Special:SplunkSearch/docs?q=proxy
Sorry I can't be of more help here. Feel free to post a new question with your specifics to get more attention to your needs. Or a support ticket of course. Lastly, your account team might be able to provide more guidance.
Sorry, I wish I was smarter 😞
FYI. Splunk SDK for JavaScript version 1.8.1 was just released. Not sure if it addresses anything here but I wanted to let you know.
Remember that the SDKs use the splunkd REST endpoints.
scheme
needs to be https
. Even though splunkweb is http, you're connecting to splunkd which is https
by default. I highly doubt you went through the effort of disabling (if even possible) the splunkd https connection.Hi Burch,
I tried with https, 8089 port but no luck. I in fact tried all the combinations before posting it in the forum. I ran out of options now..
What was the error when you used https, 8089, and no '/proxy'? Please also include the error message that appeared in $SPLUNK_HOME/var/log/splunk/splunkd.log
Hi Burch,
I do not see the request reaching the server. There is no request information logged in splunkd.log.
I am not able to attach screenshots. here are the error messages:
Code Snippet (with /proxy and https):
<script>
splunkjs.config({
proxyPath: '/proxy',
scheme: 'https',
host: 'splunkdev.com',
port: 8089,
authenticate: {username: 'admin', password: 'test123'}
});
</script>
Error message on js console:
mvc.js:8819 POST http://localhost:6080/proxy/services/auth/login?output_mode=json 404 (Not Found)send @ mvc.js:8819ajax @ mvc.js:8249makeRequest @ mvc.js:24517request @ mvc.js:20231(anonymous function) @ mvc.js:19028post @ mvc.js:20166(anonymous function) @ mvc.js:19028login @ mvc.js:19746(anonymous function) @ mvc.js:19028authFunction @ mvc.js:70615loginLoad @ mvc.js:70634(anonymous function) @ mvc.js:70429execCb @ config.js:1636check @ config.js:872enable @ config.js:1143init @ config.js:780(anonymous function) @ config.js:1413
config.js:139 Uncaught Error: Login failed. Authenticate(done) received an error(anonymous function) @ mvc.js:70636(anonymous function) @ mvc.js:70617wrappedCallback @ mvc.js:19738wrappedCallback @ mvc.js:20212error @ mvc.js:24506(anonymous function) @ mvc.js:70831fire @ mvc.js:3161fireWith @ mvc.js:3273done @ mvc.js:8350callback @ mvc.js:8891
Code Snippet (with out proxy):
<script>
splunkjs.config({
proxyPath: '/',
scheme: 'https',
host: 'splunkdev.com',
port: 8089,
authenticate: {username: 'admin', password: 'test123'}
});
</script>
Error message on js console:
config.js:164 Uncaught Error: Load timeout for modules: splunkjs/ready!_unnormalized2,splunkjs/ready!
http://requirejs.org/docs/errors.html#timeoutmakeError @ config.js:164checkLoaded @ config.js:690(anonymous function) @ config.js:711
mvc.js:8819 OPTIONS http://services/auth/login?output_mode=json net::ERR_CONNECTION_TIMED_OUTsend @ mvc.js:8819ajax @ mvc.js:8249makeRequest @ mvc.js:24517request @ mvc.js:20231(anonymous function) @ mvc.js:19028post @ mvc.js:20166(anonymous function) @ mvc.js:19028login @ mvc.js:19746(anonymous function) @ mvc.js:19028authFunction @ mvc.js:70615loginLoad @ mvc.js:70634(anonymous function) @ mvc.js:70429execCb @ config.js:1636check @ config.js:872enable @ config.js:1143init @ config.js:780(anonymous function) @ config.js:1413
config.js:139 Uncaught Error: Login failed. Authenticate(done) received an error
So the first example shows a 404 (with proxy) so you're trying to reach something that's not there.
If this is on your local, why are you using splunkdev.com? Why not localhost?
In the second, I see the url after OPTIONS shows http://services/auth/login?output_mode=json
. I'm confused why the host:port portion is missing.
The url that it should end up calling should be like:
https://localhost:8089/services/auth/login?output_mode=json
Notice the:
localhost
8089
, not 8000
and not 6080
/proxy
You can validate this is the endpoint on your system by navigating to https://localhost:8089/services/auth/login in your web browser.
Burch,
localhost and 6080 is the hostname and port number of my local tomcat server. splunkdev and 8089 are the server hostname and port number.