I need to to call an API with basic auth implemented. I have a form on the frontend where a user selects some options and then the values are transmitted to an API endpoint to fetch some results.
I am planning to call the API something like this ...
$.ajax({
url: WEBSERVICE_URL,
type: "GET",
dataType: "application/json; charset=utf-8",
username: "admin", // How do I HIDE this ?
password: "mypwd", // How do I HIDE this ?
processData: false,
contentType: "application/json",
success: function() {
alert("success");
},
error: function() {
alert("ERROR");
},
});
My problem is how to mask/hide the login and pwd in AJAX calls ? Is it even possible ? If not, then what are the alternate solutions ? Use a PROXY ?
Related
I'm trying to display Wordpress blog posts on a different domain. It displays on all browsers except for IE.
Here's my code:
$.ajax({
url: 'www.whatevermywordpresswebsiteis.com/wp-json/wp/v2/posts?_embed&per_page=100',
crossDomain: true,
cache: false,
dataType: "json",
contentType: "application/json; charset=utf-8",
type: 'GET',
async: false,
data: { action : 'get_ajax_posts' },
success: function(data) {
$.each(data, function(i, _post) {
console.log(data);
});
}
});
I've tried to implement XDomainRequest as well but it still fails to work (Jquery $.ajax fails in IE on cross domain calls). I'm not sure what to do at this point.
I have developed an app using cordova(version 6.3.1). I have checked it on nexus 5 and nexus 6P and everything looks fine, but i tested it on genymotion emulator and galaxy S6, but they didn't send any request(I checked server logs).
Does it anything to do with security problems? Or there is another problem?
The ajax POST method is the code below.
$("#login").click(function() {
$.ajax(serverUrl + "/login", {
data: {
email: userEmail,
password: userPassword
},
dataType: "json",
method: "POST",
statusCode: {
200: function(data) {
//OK, Welcome!
$("body").pagecontainer("change", "#welcomePage");
},
}
});
});
Can you show us your part of source code where you have this problem ?
Did you check you have this plugin in your project ?
cordova-plugin-whitelist
Also, can you throw us your HTTP response when you're sending your AJAX request to your server
It may be, something like this :
$.ajax
({
contentType: "application/json; charset=utf-8",
dataType: "json",
data: ...,
url: ...,
type: 'POST',
timeout: 5000,
success: function (data)
{
},
error: function(msg)
{
alert("Error:"+msg.status + msg.responseText);
}
});
Hello guys i have the next ajax call for login. I serialize the form and send the data to server and return redirect url link. My problem is that my url after post is like
http://localhost:50802/?username=&password= and not http://localhost:50802/Home
$.ajax({
type: "POST",
url: "Login/Login",
dataType: 'json',
contentType: "application/json; charset=utf-8",
data: loginJson,
cache: true,
async: false,
complete: function (result) {
alert(result.link);
window.location.replace = "/Home/Index";
},
error: function () {
$("#username").val("");
$("#password").val("");
alert("Wrong Username or Password!");
}
}); //end ajax call
It looks like you wrote this $.ajax call in the .click event of a submit button or in the .submit event of a form without canceling the default action by returning false from the callback or by calling preventDefault on the argument. Here's how your code should look like:
$('#id_of_your_form').submit(function(e) {
e.preventdefault(); // <-- That's what I am talking about and what you forgot
$.ajax({
type: "POST",
url: "Login/Login",
dataType: 'json',
contentType: "application/json; charset=utf-8",
data: loginJson,
cache: true,
async: false,
complete: function (result) {
window.location.replace = "/Home/Index";
},
error: function () {
$("#username").val("");
$("#password").val("");
alert("Wrong Username or Password!");
}
}); //end ajax call
});
Also async: false,????? You know what this does, do you? That's not AJAX. That's a blocking synchronous call to your webserver during which the client browser would be frozen like during the Ice Age 2 ruining all user experience.
Try returning false at the end of your submit function
$('#id_of_your_form').submit(function(e) {
$.ajax({
type: "POST",
url: "Login/Login",
dataType: 'json',
contentType: "application/json; charset=utf-8",
data: loginJson,
cache: true,
async: false,
complete: function (result) {
window.location = "/Home/Index";
},
error: function () {
$("#username").val("");
$("#password").val("");
alert("Wrong Username or Password!");
}
}); //end ajax call
return false; });
Another option would of course be to return the correct redirectlink from the controller instead of overriding it in the java script.
In my .net framework with MVC calling webmethod like. webservice1.asmx/helloWorld
with Ajax give error 404 not found..In my another server same code working. Is there
anything missing to call ?? and physical path give me same webserive and webmthod in my .net project.. please help me ..
EDIT
code to call the web service
$.ajax({
type: "POST",
url: "/WebServices/WebService1.asmx/HelloWorld",
data:"{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
async: false,
success: function(msg) {
var data = msg.d;
},
error: function(msg) {
alert(msg);
}
});
I suspect that you have hardcoded the url to the web service in your javascript call instead of using an url helper to generate it. So try like this:
<script type="text/javascript">
$.ajax({
type: "POST",
url: "#Url.Content("~/WebServices/WebService1.asmx/HelloWorld")",
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
async: false,
success: function(msg) {
var data = msg.d;
},
error: function(msg) {
alert(msg);
}
});
</script>
Notice how the url to the web service is no longer /WebServices/... but it is generated with an url helper. So if for example you deploy your application in a virtual directory in IIS the helper will take into account this virtual directory.
I am trying to perform an AJAX request from a Chrome Extension to Basecamp to authenticate in so I can pull tasks. I have added https://site.basecamphq.com to the permissions in manifest.json. However, when this function is executed, I get this in my console:
XMLHttpRequest cannot load https://site.basecamphq.com. Origin chrome-extension://0123456789 is not allowed by Access-Control-Allow-Origin
$("#login").click(function()
{
$.ajax({
type: "GET",
dataType: 'html',
url: "https://site.basecamphq.com",
username: "username",
password: "X",
success: function(data){
$("#example").append(data);
}
});
});
I have added https://*/ to my manifest.json permissions as well, but no luck.
You need to use background page for doing AJAX requests from a content script.
Background page code:
chrome.extension.onRequest.addListener(function(request, sender, callback) {
$.ajax({
type: "GET",
dataType: 'html',
url: request.url,
username: "username",
password: "X",
success: callback
});
});
Content script code:
chrome.extension.sendRequest({'url': 'https://site.basecamphq.com'}, function(data) {
$("#example").append(data);
});