New TwitchTV API call - javascript

I am a beginner to programming and for a challenge I need to get the status (Streaming live/Off-line) for a given number of channels.
I wrote an ajax request but I am still getting 401 as a response. Below my code and a screen shot of the response.
I have even made the token request as async: falseto make sure the token is back before triggering the API call
$("document").ready(function() {
var aoathToken = $.ajax({
type: "POST",
url: "https://id.twitch.tv/oauth2/token?client_id=MYCLIENTID&client_secret=MYSECRET&grant_type=client_credentials",
error: function() {
console.log("Check your request!!")
},
success: function(token) {
console.log(token);
}
})
$.ajax({
type: "GET",
url: "https://api.twitch.tv/helix/streams?user_id=freecodecamp",
contentType: ('application/x-www-form-urlencoded; charset=UTF-8'),
crossDomain: true,
header: {
"Access-Control-Allow-Origin": "*",
"Client-ID": "MY CLIENT ID",
"Authorization": "Bearer " + aoathToken,
},
data: {"user_login": "myUserID"},
dataType: "json",
success: function(json) {
console.log(JSON.stringify(json, null, 2));
},
error: function(json) {
window.alert(json.status + " " + json.message);
},
})

Related

How to get oauth access_token with jQuery (localhost)?

I am trying to get access_token utilizing jQuery. Problem is, that I cannot get that token (server is running on localhost). Server works fine (I tried that with postman), but I cannot get it with jQuery.
Browser writes after clicking on the button.
The resource from “http://localhost:8080/oauth/token?callback=jQuery34105901959820360243_1562175129954&grant_type=password&client_id=my-client&client_secret=my-secret&username=test%40seznam.cz&password=Peter&_=1562175129955” was blocked due to MIME type (“application/json”) mismatch (X-Content-Type-Options: nosniff).
jQuery function to get access_token
function authenticateUser(email, password) {
var body = {
grant_type: 'password',
client_id: 'my-client',
client_secret: 'my-secret',
username: "test#seznam.cz",
password: "Peter"
};
$.ajax({
url: 'http://localhost:8080/oauth/token',
crossDomain: true,
type: 'POST',
dataType: 'jsonp',
contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
header: {"Access-Control-Allow-Origin": "*"},
data: body,
complete: function(result) {
alert(result);
},
success: function(result) {
alert(result + " OK!");
},
error: function(result) {
alert(result + " CHYBA");
},
});
return true;
}

If the javascript file is served by the same server that gives out the tokens then there's no need to use the full url in your jquery ajax code (and there's no need to indicate crossDomain=true). It also seems that your server is expecting json content type instead of url-encoded
use
url: '/oauth/token',
crossDomain: false,
...
contentType: 'application/json; charset=UTF-8',
To make the request
Edit
Trye this way:
$.post("/oauth/token",body,
function(data, status) {
alert("Data: " + data + "\nStatus: " + status);
});
Hope this helps

How to pass Authorization header in reactjs API call?

module.exports ={
_callAPI: function(url,method,data,target){
let token = "santhi" + ":" + "santhi";
let hash = btoa(token);
console.log(hash);
$.ajax({
url: BASEURL + url,
method: method,
data: data,
processData: true,
dataType: 'json',
headers: {
"Authorization" :"Basic " + hash,
"Content-Type" :"application/json"
},
success: (data,textStatus, jqXHR) => {
target('success', data);
},
error: (jqXhr,textStatus,error) => {
target('error',jqXhr,textStatus,error);
}
});
},
}
I am adding authorization as headers like thing. but i am not getting anything. Is there any other way to authorize base64 encoding.
Thanks in advance

How to do a service call for 'POST' method?

How to do a service call for 'POST' method for the payload with the headers described below?
Payload for the service:
{
"SupplierPOPrint": {
"ErrorFlag": "Status Code: 20, Message ID: 505",
"ResultMessage": "Integration Service: Unable to find a routing corresponding to the incoming request message."
}
}
headers: { "Accept": "application/json", "Content-Type": "text/xml", },
function poPrint() {
$.ajax({
url: '/wps/proxy/http/10.249.114.31:8009/soa-infra/resources/Supp‌​lierPortal/CreateSup‌​plierPOPrintService!‌​1.0/CreateSupplierPO‌​PrintService/Create'‌​,
type: 'POST',
dataType: 'json',
data: new XMLSerializer().serializeToString(updatedTemplate),
crossDomain: true,
success: function(poPrintData) {
console.log("poPrintData", poPrintData);
poPrintDetails = poPrintData.SupplierPOPrint;
console.log("poPrintDetails", poPrintDetails);
poPrintTemplate = generatepoPrint(poPrintData);
$("#poPrintOutput").html(poPrintTemplate);
},
error: function(data) {
console.log("Update Content Failed", data);
}
});
}

how to send api_key and api_secret arguments in jquery post request

$.ajax({
type: 'POST',
url: 'http://apius.faceplusplus.com/detection/detect',
crossDomain: true,
cache: false,
async: true,
data: '{ "comment" }',
dataType: 'jsonp',
success: function(responseData) {
alert(JSON.stringify(responseData));
},
error: function (responseData, textStatus, errorThrown) {
alert(JSON.stringify(responseData));
}
});
I am sending a post request to above which requires api_key and api_secret parameters for authentication. I tried sending value of this 2 paramenters like this in above request:
headers:
{
"Authorization": "Basic " + Base64.encode('value of api key here' + ":" + 'value of api secret here')
},
But when I execute the request it says 400 BAD REQUEST and when I hit the url in browser it shows
{
"error": "MISSING_ARGUMENTS: api_key",
"error_code": 1004
}
Please suggest me a solution. I am stuck for long time.

Pass the key/value pairs in the data object of the ajax request, like this:
data: '{ "api_key": "thekeyhere", "api_secret": "thesecrethere" }'

Paypal Java script integration

Want to integrate Paypal with my mobile web application. I tried to get the access token using client id and secret id but unable to get the access token.
Below is the sample Ajax call with I am making to retrieve the access token.
function getAccessToken(){
$.ajax({
url:"https://api.sandbox.paypal.com/v1/oauth2/token/",
type:"POST",
data : {"grant_type":"client_credentials"},
beforeSend: function (request)
{
request.setRequestHeader("Accept", "application/json");
request.setRequestHeader("Accept-Language", "en_US");
request.setRequestHeader("Authorization", "abc XXXXX:XXXXXXXXXXXXX");
},
success: function(data) {
alert(data);
},
error: function(e, messgae,type){
alert("Error" + e +" "+messgae+" type "+type);
}
});
I am unable to retrive the access token from the server.
Can anyone please tell me how can I integrate Paypal with my mobile web application using java script?

after a series of try and fail I found the correct AJAX call:
$.ajax({
headers: {
"Accept": "application/json",
"Accept-Language": "en_US",
"Authorization": "Basic "+btoa("**<Client ID>:<Secret>**")
},
url: "https://api.sandbox.paypal.com/v1/oauth2/token",
type: "POST",
data: "grant_type=client_credentials",
complete: function(result) {
alert(JSON.stringify(result));
},
});
You need to replace Client ID:Secret with the one that you find on your Developer Dashboard, for example AxxhGDh:hudh-X-h8qi

Above example doesn't works, below works for me:
var parameter = {
"grant_type": "client_credentials",
"username": "<username>",
"password": "<password>"
}
$.ajax({
headers: {
"Accept": "application/json",
"Accept-Language": "en_US",
"Authorization": "Basic <your auth key>"
},
url: "https://api.sandbox.paypal.com/v1/oauth2/token",
type: "POST",
data: parameter,
complete: function (result) {
alert(JSON.stringify(result));
},
})

Categories