passport-facebook ajax error - node.js

I am trying with passport-facebook ajax
client
$('#fb').click(function(){
$.ajax({
url:'/auth/facebook',
type: 'post',
success:function(data){
if(data.result == true){
...
}else{
...
}
},
error:function(request,status,error){
console.log("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
}
})
});
error message
XMLHttpRequest cannot load https://www.facebook.com/dialog/oauth?~~~
...
Response for preflight is invalid (redirect)
i don't know this error..
help me please

Facebook does not allow scripts to load the login dialog, i guess to prevent phishing. You need to do the GET request via the browser URL by an anchor tag. Or you can get around it in your AJAX by doing:
window.location.replace('http://yourdomain/auth/facebook')

Related

Node, Express, Ajax, Form Submission

Help, I'm Stuck! I am playing with a CRUD setup with Node Express but with AJAX post request. I have the read form working fine.
The form has one input filed which is a lookup email. AJAX post the form data with the following code
if ($("#rsvp-search-form").length) {
$("#rsvp-search-form").validate({
rules: {
...
},
messages: {
...
},
submitHandler: function (form) {
$("#loader").css("display", "inline-block");
$.ajax({
type: "POST",
url: "/",
data: $(form).serialize(),
success: function (data, textStatus, jqXHR){
if (typeof data.redirect == 'string')
window.location = data.redirect;
}
,
error: function() {
$( "#loader").hide();
$( "#error").slideDown( "slow" );
setTimeout(function() {
$( "#error").slideUp( "slow" );
}, 5000);
}
});
return false; // required to block normal submit since you used ajax
}
});
}
I have a express post route to '/' that returns a status with res.status(#).send() and the proper success/error block is executed based on the whether status # is 400 or 200.
Now on the update form I have the same basic setup with many more form inputs, but the AJAX code does not process the res.status(#).send() response by executing the proper success or error block, instead it is just loading a new page with the same url as the request was processed from.
The AJAX code request is similar to the top with difference of url:
submitHandler: function (form) {
$("#loader").css("display", "inline-block");
$.ajax({
type: "POST",
//The website when loaded has an invitation
//object that is passed by express
url: "/rsvp/" +invitation._id,
data: $(form).serialize(),
dataType: 'application/json'
I verified that the proper post route is running and receiving the invitation._id. It returns res.staus(#).send() but the ajax does not process the success or error block it just redirects to the requesting url but does not actually render the url.
I don't know if it is just that the form is still processing the default action, if the response from express is not correct, etc etc
I hope I have been clear on my issue and someone knows what I am doing wrong here.
Regards!
Update!
I got it working. Though the url with variable was correct and express was receiving the proper id, JS was throwing an error causing everything to crash. I never caught the error because the page would reload to the blank page and clear the console. I fixed it by saving the id in a hidden field when rendering the form and used that instead. Seems to have fixed the problem.
Thanks for looking!

NetSuite: How to make http request sending cookies?

I need to call an external API to get some data from a SuiteScript file and I'm getting an issue. The GET call needs to go with credentials (basically, it has to go with the cookies in the Request Header).
If I make the API call from the chrome console setting withCredentials = true, but when I make that API call with NetSuite N/https module -through https.get()- the cookies don't go on the request header.
So in summary, I'm looking for a way to set withCredentials = true on the http.get() call or to be able to somehow get the cookies from my SuiteScript so that I can manually set it in the header option of the call.
Thanks in advance for your time!
Within the get, pass the headers option and populate your header values. I believe these are KVP.
If your external app is expecting information about the logged in user then what you probably want to do is an XHR request (jQuery's $.getJSON would be your best bet). If you need to pass information to a server side script then you'd call your Suitelet with the returned data.
A post example would be as follows. Note the withCredentials :
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: url,
dataType: "json",
data: jsonData,
xhrFields: {
withCredentials: true
},
success: function(response){
console.log(response);
},
error: function(response){
console.log('error: ' + JSON.stringify(response));
}
});

submitting form data without leaving page. Express, Node.js, Pug

I read through a similiar post but the individual was using perl and something elss so it didn't help me. My question is how can i submit a form with node js/pug but remain on the same page.
In the pug form the method is set to POST and action set to /profile
in my nodejs i'm using
router.post("/profile", req, res, next){
return res.redirect("back")
}
The problem is that all this does is reload the page. I want to stay on the page and simple show a message saying "profile update".
Then don't return a redirect. Simply take the post data and process it, you can return the state of the operation, for example. Then however you should use an AJAX query instead of stock form, which will always redirect you to the action URL.
router.post("/profile", req, res, next){
return updateProfile(req.body); // true or false
}
And in jQuery, for example, you can perform an AJAX request
$.ajax({
type: "POST",
url: "/profile",
data: profile_form_data_object,
success: function(data) {
alert("Result of the profile update was: " + data);
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Ajax POST to Node.js through Nginx not getting correct response

I'm trying to send an ajax post request to a node.js microservice through nginx. The requuest is as follows:
$.post('http://localhost:80/api/signup', formData, function( data, status) {
console.log(JSON.stringify(data));
console.log(JSON.stringify(status));
}).done(function(data, status) {
alert( "second success" );
console.log(JSON.stringify(data));
console.log(JSON.stringify(status));
})
.fail(function(data, status) {
console.log('error');
console.log(JSON.stringify(data));
console.log(JSON.stringify(status));
})
.always(function(data, status) {
console.log(JSON.stringify(data));
console.log(JSON.stringify(status));
console.log('fiished');
});
The request reaches the microservice. But the response is as follows (which is always the error function):
"data" is always:
{"readyState":0,"status":0,"statusText":"error"}
And the "status" is always:
error
which is not the expected response at success nor failure.
How can I fix this?
Moreover, "formData" parameters appear as queries on the url once submitted. How can I stop that?
Update*
I have also tried adding event.preventDefault(); but now it gives me the following:
XMLHttpRequest cannot load http://localhost:3000/api/signup. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.
{"readyState":0,"status":0,"statusText":"error"}
I have also tried:
$.ajax({
type: "POST",
url: "http://localhost:3000/api/signup",
data: JSON.stringify(formData),
success: function(dataString) {
console.log(JSON.stringify(dataString));
}, error: function(error) {
console.log(JSON.stringify(error));
}
});
But got the same No 'Access-Control-Allow-Origin' header is present on the requested resource as above.
Update
There is a valid and possibly more detailed answer on "No 'Access-Control-Allow-Origin' header is present on the requested resource". However, I find the answer I accepted here more direct and clear.
Are you executing the ajax request from the browser or localhost? If you are executing it from your browser it may be CORS issue. If you want to be able to execute that ajax request from your browser you should modify your server configuration/code to allow cross-origin HTTP requests.
This looks similar to your issue. CORS issue in Jquery Ajax Post

How to show error message on same page in node js?

I am using post method to submit form in node js. Now when I submit the form, I want to show the error message from node server if login fails. I am setting the message as res.send("") but it is showing message on another window. So please help me to solve this?
You could make an Ajax call from your form to your node server API, then depending on the result from your server, show a message.
Jquery example:
$.ajax({
method: "POST",
url: "/api"
data: {login_data_here}
})
.success(function(msg) {
// redirect to admin area etc
})
.error(function(msg) {
// show login for with a failure message
});
Node API server would return something like this:
res.writeHead(200, { 'Content-Type': 'application/text' });
res.end('Login Success');
Or this on fail:
res.writeHead(400, { 'Content-Type': 'application/text' });
res.end('Login Fail');
You can use this module for persisted flash messages between page redirects - https://www.npmjs.com/package/connect-flash

Resources