Javascript AJAX detecting different POST errors - javascript

My program prompts the user to enter an IP address of an API, and then makes a call to that IP address. 2 of the error cases are
1: An invalid IP Address is entered. The POST call returns "net::ERR_ADDRESS_UNREACHABLE"
2: The certificate of the site at the given address is not trusted. The POST call returns "net::ERR_CERT_AUTHORITY_INVALID".
These two different scenarios should be addressed differently, but I can't find a way to tell which error is returned. Is there a way to distinguish between these returned errors with code?
Code:
function pingBridge(ip) {
var username = 'username';
var url = 'https://' + ip + '/api'
const result = new Promise(function(resolve, reject) {
fetch(url, {
method: 'POST',
body: JSON.stringify({'devicetype': username})
}).then(function(data) {
console.log('success')
console.log(data)
resolve(data.json())
}).catch(function(error) {
console.log('error')
console.log(error)
reject(error)
})
})
return result
}

Related

Are there any public API (s) that I could use to verify an activation code?

I am trying to create a product verification system, and I have the login part down. My question is how are there any API (s) that can verify something like an activation code and return if it succeeded or not.
Btw, you might have to scroll horizontally to see all of the code
//How would I add a verification system
document.getElementById('redeemButton').addEventListener('click', () => {
var code = document.getElementById('redeemCodeBox').value;
var product = document.getElementById('productCode').value;
const fetchPromise = fetch(`https://www.mywebsite.com/api/redeem?product=${product}&code=${code}`);
fetchPromise.then( response => {
if (!response.ok) {
throw new Error(`HTTP error: ${response.status}`);
}
return response.json();
})
.then( json => {
console.log(json[0].name);
})
.catch( error => {
console.error(`Could not get products: ${error}`);
throw `Please Enter a Valid Activation Code`;
});
});
I don't think you should be dependent on a third party to verify an Activation Code.
You should use a combination of JWT token + activation code that you store in the database.
Generate an activation code.
Generate JWT token.
const token = await this.jwtService.sign(
{
usetId: userId
},
{ expiresIn: "1d" }
);
Save the activation code and the JWT token to the database.
Send an E-mail or SMS with an activation code to the user. + include URL where user can insert the activation code.
URL can look something like this:
https://www.mywebsite.com/api/activation?token=eyJhbGciOiJIfasdfas
(use query parameter for JWT token =>> ?token=JWT_token
Verify JWT token from URL (value from query parameter "token") and validate if Token is not expired.
Control if user input matches an Activation code stored in your database.
Activated

Getting 401 error when using redmine API for a POST request even though I have included the api key

I am trying to make a post request to create a new wiki page using the redmine-api. I am using JavaScript and Axios. However I a getting a 401 error(UnAuthorize).
My goal is to be able to send a word document to my redmine and create a wiki page.
I am using the Api key provided and I did enable the rest api feature in my redmine setting
I have included the api key in the header however it is not working.
var wordDocument = "./Redmine.docx"
axios.post('<website url>/uploads.json', {
headers: {
'Content-Type': 'application/octet-stream',
'Cache-Control': 'no-store',
'key': '<api-key>'
},
data:wordDocument
})
.then(function (response) {
console.log("succeeed---> ");
console.log (response)
})
.catch(function (error) {
console.log("failed-----> ");
console.log(error.response.headers)
console.log(error.message)
console.log("failed-----> ");
})
I am getting a status: '401 Unauthorized',
Try using the other authentication methods mentioned in the docs:
x passed in as a "key" parameter
- passed in as a username with a random password via HTTP Basic authentication
- passed in as a "X-Redmine-API-Key" HTTP header (added in Redmine 1.1.0)
https://www.redmine.org/projects/redmine/wiki/Rest_api#Authentication
Also ensure that you're using the correct API key.
You can find your API key on your account page ( /my/account ) when logged in, on the right-hand pane of the default layout.
Alright I got it working.
I did "axios({})" instead of "axios.post". I do not know what the different is? I thought it was the same.
Here is my code for anyone who run into this.\
var wordDocument = "./Redmine.docx"
axios({
method: 'post',
url: '<redmind_url>/uploads.json',
headers: { 'Content-Type': 'application/octet-stream'},
params: { 'key': '<api key>'},
data: wordDocument
})
.then(function (response) {
console.log("succeeed---> ");
console.log(response.data)
})
.catch(function (error) {
console.log("failed-----> ");
console.log(error.response.statusText, "-->", error.response.status);
console.log(error.response.headers)
console.log(error.message)
console.log("failed-----> ");
})

Angular2: PUT request to Node-Server doesn't work - authentication lost

I'm using Angular2 on the client side and a node-express server as my backend. The node-server works as an API-middleware and also as my authentication service. The user-requests must contain a valid JWT token to perform requests on the node-server.
All of my GET functions and other PUT functions are working properly. I wrote a new one, which just should delete an ID on a third-party API, doesn't.
Furthermore, my node-express server sends custom error messages at some points to the client. This comes to my problem, whenever I run my latest PUT-function, my server responds with "No token provided". This happens when the user isn't logged in on the client side.
As I said, all my other functions working. this.createAuthenticationHeaders(); is necessary to perform valid request on the server side. But it's implemented.
In other words, the authentication gets lost between client and server and I get my own error message: "No token provided".
Appointment-Detail.Component.ts
cancelAppointment() {
this.authService.getProfile().subscribe(profile => {
this.username = profile.user.username; // Set username
this.email = profile.user.email; // Set e-mail
if (profile.user.email) {
this.apiService.cancelUserAppointment(this.id).subscribe(data => {
console.log(this.id);
if (!data.success) {
this.messageClass = 'alert alert-danger'; // Set error bootstrap class
this.message = data.message; // Set error message
} else {
this.messageClass = 'alert alert-success'; // Set success bootstrap class
this.message = data.message; // Set success message
// After two seconds, navigate back to blog page
}
});
}
});
}
API Service
cancelUserAppointment(id) {
this.createAuthenticationHeaders();
console.log('API SERVICE ' + id);
return this.http
.put(this.domain + 'api/appointments/' + id + '/cancel', this.options)
.map(res => res.json());
}
An API Service functions that works
getCertificatesByUser(email) {
this.createAuthenticationHeaders();
return this.http
.get(this.domain + 'api/user/' + email + '/certificates', this.options)
.map(res => res.json());
}
Server route to the third party API
router.put('/appointments/:id/cancel', (req, res) => {
console.log('hi');
var id = req.params.id;
const url = process.env.acuityUri + '/appointments/' + id + '/cancel';
console.log(id);
});
Authentication middleware
router.use((req, res, next) => {
const token = req.headers['authorization']; // Create token found in headers
// Check if token was found in headers
if (!token) {
res.json({
success: false,
message: 'No token provided'
}); // Return error
} else {
// Verify the token is valid
jwt.verify(token, config.secret, (err, decoded) => {
// Check if error is expired or invalid
if (err) {
res.json({
success: false,
message: 'Token invalid: ' + err
}); // Return error for token validation
} else {
req.decoded = decoded; // Create global variable to use in any request beyond
next(); // Exit middleware
}
});
}
});
Without doing too much of a deep dive into your auth headers, I see a pretty glaring issue that I think may be the cause of your troubles.
HTTP REST verbs carry different "intents", the intent we specifically care about in this case is wether or not your request should have a body.
GET requests do not carry a body with them.
PUT requests do carry a body.
Because of this, angular's HttpClient request methods (http.get, http.post, etc.) have different method signatures.
To cut to the chase, http.put's method signature accepts 3 parameters: url, body, and options, whereas http.get's method signature only accepts 2: url and options.
If you look at your example, for http.put you are providing this.httpOptions as the second parameter instead of the third, so Angular is packaging up your options object as the PUT request body. This is why you have a working example and a non-working example; the working example is a GET!
The solution? Simply put something else as the request body in the second parameter and shift this.options down to the third parameter slot. If you don't care what it is, just use the empty object: {}.
So your request should look like this:
return this.http
.put(this.domain + 'api/appointments/' + id + '/cancel', {}, this.options)
At the very least, this should send whatever is in this.options to the server correctly. Now wether what's in this.options is correct or not is another story.
Example PUT call from Angular's docs: https://angular.io/guide/http#making-a-put-request

How to properly return a response and a error from a meteor method

I am trying to return a response or a error on the client side from a meteor method that exists on the server side. The method itself is for submitting a post request to a API when a form is submitted, I would like to on the client side be able to return the API's response so I can send info to the user like, this email address already exists. Here is what I have so far.
I receive a 201 response on the client side in the console.log(result); when I call the method when it is successful but I would like to also console log the error when the POST submissions gives a 400 or any error.
server/main.js
Meteor.methods({
addSub(email) {
var emailAddress = {
"lists": [
{
"id": "1395617465"
}
],
"email_addresses": [
{
"email_address": email
}
]
}
HTTP.post('https://api.constantcontact.com/v2/contacts?api_key=<api-key>', {
headers: {
'Authorization': 'Bearer <token>',
'Content-Type': 'application/json'
},
data: emailAddress
}, function (error, response) {
if ( error ) {
console.log( error );
throwError = error;
} else {
console.log(response);
returnResponse = response;
}
});
return returnResponse;
}
});
client/main.js
Template.info.events({
'submit #cm-subscribe'(event){
event.preventDefault();
var form = event.target;
var email = form.email.value;
Meteor.call('addSub', email, (error, result) => {
console.log(result);
});
}
});
client/main.html
<template name="info">
<h2>Signup For Our Newsletter</h2>
<form id="cm-subscribe">
<input field name="email" type="email" value="email">
<input type="submit">
</form>
</template>
1) Your code currently contains a race condition. The value of returnResponse may or may not be set depending on the order of execution between the callback and the return statement. Instead, you should use Promises, which allow you to wrap asynchronous code in a synchronous way. There is a good post on the Meteor blog about how to do this. Note that this does not affect the client behavior- it would still use callbacks like you have.
2) The reason that you do not see errors on the client is that Meteor intentionally converts all normal Javascript errors (like those returned by HTTP.post) into internal server errors to protect data and source code. What you should do is handle all of the errors on the server side, and return new Meteor.Error objects for expected invalid responses. These can then be handled by the client. A thorough explanation of this can be found in the Meteor Guide.
Something like this:
Meteor.methods({
addSub(email) {
return new Promise((resolve, reject) => {
HTTP.post('<URL>', ..., function(error, response){
if(!error){
resolve(response);
} else if (error == <Some Error Comparison>){
reject(new Meteor.Error("Email.subscription.invalidEmail", "You put in an invalid email"));
}
});
});
}
}

Angular's $http.post not working in MS Edge

I'm attempting to make a Web 2.0 API call via AngularJS using $http.post that returns JSON and as weird as this may sound, it worked an hour ago, now it doesn't and I haven't changed a thing. The application continues to work in all other browsers, it just fails in Edge.
var _login = function (loginData) {
var data = "";
var grant = [insert data to authorise user on server];
var deferred = $q.defer();
$http.post(serviceBase + 'token', data, { headers: { 'Content-Type': 'application/x-www-form-urlencoded' } }).success(function (response) {
_userlogin(response);
deferred.resolve(response);
}).error(function (err, status) {
console.log(err + " " + status);
_logOut();
deferred.reject(err);
});
return deferred.promise;
};
I've had to take some info out there because it's security info, but the functionality should be the same, so, from debugging I know that this is where the application stumbles. I also know that the logindata passed in is valid and I've tried the same call with the same grant on a REST client and that works fine also like I mentioned before the same call with no alterations runs in any other major browser (including IE weirdly).
When that call is run, the front end angular does the following:
$scope.authUser = function (username, password) {
var loginData = { userName: username, password: password, useRefreshTokens: login.useRefreshTokens}
authService.login(loginData).then(function (response) {
console.log(response);
sessionStorage.setItem("status", "User Logged In As: ");
sessionStorage.setItem("username", username);
global.template = "templates/dashboard.html";
login.password = "";
},
function (err) {
console.log(err);
login.message = err.error_description;
$("#passwordError").modal();
});
};
The application stops at login.message = err.error_description;, because it's not returned from the API call. The error is: Network Error 0x2efd, Could not complete the operation due to error 00002efd. and Unable to get property 'error_description' of undefined or null reference.
Edit: Forgot to mention - the application works when Fiddler is open and capturing traffic. That's the strangest part.
Take a look at this post which used the solution mentioned here. They're saying the issue was with interacting between localhost to localhost.
I'm glad I was able to help.

Categories

Resources