Cross Origin error on ajax OAuth authentication - ajax

I'm working on a web project using microservices. When I try to access the OAuth access token from the Authentication server through an ajax call, I get an error in the browser console like this:
Access to XMLHttpRequest at 'localhost:8080/oauth/token' from origin 'http://localhost:8090' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
My Ajax
$.ajax({
url: 'localhost:8080/oauth/token',
method: "POST",
headers: {
"Content-Type": "application/x-www-form-urlencoded",
"Authorization": "Basic " + auth_token
},
data: {
"username": "user",
"password": "123",
"grant_type": "password"
},
success: function(data) {
console.log(data)
},
error: function(jqXHR, textStatus, errorThrown) {
console.log(textStatus);
}
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
I tried looking up in previous stackoverflow questions and found this similar question. But the answer doesn't work for me as I'm not loading a local file. I'm loading the model from Tomcat.
I'm just a beginner in microservices and rest api in general. Any help is appreciated.

Related

ajax post API 403 (Forbidden)

I'm trying to make a login form using ajax post with laravel and the url must pont to the api that provided to me.
but keeps on saying 403 for bidden api.
they also provides basic Auth username and password.
here's my codes bellow. thanks
$("#login_page").submit(function(e){
$.ajax({
type:"POST",
url:"https://api.samplesample.ph/frontend/login/",
headers: {
'Authorization':"Basic **************=",
"Content-Type": "application/json",
"cache-control": "no-cache"
},
data:$("#login_page").serialize(),//only input
success: function(response){
console.log(response);
}
});
e.preventDefault();
});

Ajax request django rest framework

I've got a problem. Every time I have to clear caches and cookies first and then the AJAX request can be requested successfully. Otherwise I will get 403 response from the server, which is Django RESTful framework.
This is what I request
$.ajax({
url: url_add,
type : 'PATCH',
dataType: 'json',
data: {
'followup_customer': note,
},
statusCode: {
200: function() {
window.location.reload();
}
},
});
You should add a correct HTTP header, containing CSRF token as described in django docs.

trying to build http adapter from ajax request

i'm trying to build http adapter with token authorization form ajax request but get 401 error
Status Code:strong text
401 Unauthorized
missing_authorization
$.ajax({
type: "POST",
url: "https://abcd",
data: JSON.stringify({ "template": 1 }),
headers: { "Authorization": "xxxx", "Accept": "application/json",
"Content-Type": "application/json" }
});
function My_adapter() {
path = '/xxx';
var input = {
method : 'post',
path : path,
returnedContentType : 'json',
headers: {'Content-type':'application/json',
'Accept':'application/json', 'Authorization':'Token XXXXX'},
parameters: JSON.stringify({ "template": 1 }),
};
var result=WL.Server.invokeHttp(input);
return result;
}
tnx for your help,
sahar
The error message you see is expected. The client side code you posted shows that you are attempting to invoke MFP server outside of MFP client SDK ( jQuery ajax call). This call does not carry all the required information to the server and server sends the "missing_authorization" message as a result.
If you wish to invoke an adapter, use WLResourceRequest API provided by MFP client SDK. This takes care of handling the authentication handshake with MFP server. More details on the API usage here.

Google OAuth 2 authorization: got Error redirect_uri_mismatch using ajax p

I already set the Authorized redirect URI on Google API Concole as below show.
Google console API Setting
I used localhost:64420/index to get the code, and send the code to localhost:64420/Auth to used ajax post parameter try to get the access token.
Sadly, I got the error message:
{error: "redirect_uri_mismatch", error_description: "Bad Request"}
Here is the script:
<script>
var code = code;
var clientID = client_ID;
var clientSecret = client_Secret;
var redirect_uri = "http://localhost:64420/Report.aspx";
var searchurl = "https://www.googleapis.com/oauth2/v4/token";
$.ajax({
dataType: "json",
url: searchurl,
data: { code: code, client_id: clientID, client_secret: clientSecret, redirect_uri: redirect_uri, grant_type: 'authorization_code' },
type: "POST",
contentType: "application/x-www-form-urlencoded; charset=utf-8",
crossDomain: true,
cache: true,
success: function (data) {
alert(data);
},
error: function (jqXHR, exception, errorstr) {
console.log(jqXHR);
alert(errorstr);
}
});
</script>
The redirect URL in your app and the redirect URL you configure in the API console must be an exact character-for-character match. Remember you can configure multiple redirect URLs in the APi Console, so don't be shy and add all possible variants, eg with both http and https. You should really be using https for a redirect URL and I wouldn't be surprised if a future change disallowed plaintext URLs.

Ajax get Request returns "Unauthorized" for Azure Ad Graph API

I'm trying to call the Azure Ad Graph API from my typescript code, but I keep getting the error: Unauthorized
lavaNET.SharePointREST.getJsonWithoutSite(this, "https://graph.windows.net/lavanet.dk/users?api-version=1.6", (tmplData: any, tmplTextStatus: string, tmplXHR: JQueryXHR) => {
console.log(tmplData)
});
export function getJsonWithoutSite(context: any, url: string, success: SuccessCallback, failure?: ErrorCallback) {
$.ajax({
method: 'GET',
context: context,
headers: {
'Authorization': 'Bearer zc21eb27-760b-4b46-828e-xxxxxxxxxxxxx',
'Content-Type': 'application/x-www-form-urlencoded'
},
url: url,
dataType: 'json',
accepts: { json: 'application/json; odata=verbose' },
success: success,
error: failure || function (jqXHR, textStatus, errorThrown) { alert('Error: ' + errorThrown); }
});
}
Can someone Point out why I can't get the data from the Ad?
Update Is this what i need or am i totally wrong:
Update In reply to Gary Liu - MSFT, I get these keys from hes code:
Is my Ajax correct and what key should i use?
You have generate an access token, and set it in Authorization header.
We need to manually follow the OAuth 2.0 authorization flow to implement the functionality to acquire access token from Azure AD in our application.
Also you can leverage ADAL SDK to implement this functionality in your app with an ease. However, currently there is no such ADAL for ts existed. You can try to leverage ADAL for js to grand access token, store it in session Storage or local Storage in client browsers. And use the token in your ts scripts.
Here is a sample for how to use ADAL for js in plain javascript.

Resources