backbone.js - Why values send in OPTIONS method? - backbone.js

I create a backbone app and a form to submit text value.
When I submit form, in "Net" tab in firebug I see:
How I can send form with Post method?
What need to do on server or something?

The options request you see is not send INSTEAD of your post request, it is called before the post request is triggered if you are in a cross-domain situation.
If you want to allow this on server side you could make your server respond with an additional HTTP header:
Access-Control-Allow-Origin: http://your.requesting.site.url

Related

AXIOS post request - missing url param

I set a react webpage that has is structured as follow:
MAIN PAGE www.localhost:3000.com,
OTHER PAGES www.localhost:3000.com/services, www.localhost:3000.com/about, www.localhost:3000.com/contactMe.
I'm using axios from www.localhost:3000.com/contactMe to perform a post for a contact form that will send data thru my backend/nodemailer.
Using Postman to verify the post status, the post method is NOT working from www.localhost:3000.com/contactMe/api/contact and it works correctly for localhost:3000/api/contact and localhost:5000/api/contact.
How could I fix this Request failed with status code 404 from www.localhost:3000.com/contactMe/api/contact?
HOST: localhost:3000
SERVER: app.use('/api,...)
CONTROLLER: pouter.post('/contact',...)
One solution could be to just use the base URL and send the POST request to www.localhost:3000.com/api/contact from any page.
So even if the user is on www.localhost:3000.com/contactMe, it still sends the request to www.localhost:3000.com/api/contact.
A quick way to get it is using window.location.hostname.
Another way is just putting a / in the beginning of the URL you're putting in your POST request axios.post('/api/contact', ...) and it should send it directly to ${baseURL}/api/contact from any page

How to intercept requests from external handlers using Cypress?

Does anyone know how a request that launches an external handler (such as an email app) can be intercepted to obtain the Request URL?
The in-browser request that launches the external app looks like this:
Request URL: mailto:example#example.com?Subject=Test&Body=test
Referrer Policy: strict-origin-when-cross-origin
I'm trying to do as follows and it doesn't work:
cy.intercept('mailto:**').as('mailto')
cy.get('#submitButton').click()
cy.wait('#mailto').its('request.url').should('contain.text', 'Subject')
It fails on cy.wait('#mailto') and the Routes from Cypress's interface presents the following (that it doesn't catch the request):
Method
Route Matcher
Stubbed
Alias
#
*
mailto:**
No
mailto
-
Also, already tried to use different Cypress versions: 6.4.0, 6.9.1 and 8.2.0.
Hope someone can help. Thanks in advance.
It turns out that mailto: doesn't seem to be a request, it's more like a link inside an <a> of your HTML...
A request usually has a method (GET, POST, DELETE) and a URL, and then you can intercept using cy.intercept.
It turns out that when you click on the link that contains Mailto a request is not created, this link serves to open your email client, so you need to create an assertion for this link in another way.
cy.intercept('POST', '/createuser*').as('createUser')
cy.wait('#createUser')
This is the way I use to intercept a request, making the test wait for the response before proceeding, it is for requests that your frontend makes to your backend server or third party services.

Re-Captcha Angular CORS Issue

I am using Angular 1.x to POST a verification request to Google's re-captcha as follows:
var post_data = { //prepare payload for request
'secret':'xxxxx',
'response':fields.myRecaptchaResponse
};
$http.post('https://www.google.com/recaptcha/api/siteverify', post_data)
In my console I can see the following error:
XMLHttpRequest cannot load https://www.google.com/recaptcha/api/siteverify. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://igs.dev' is therefore not allowed access. The response had HTTP status code 405.
I have read multiple answers on Stackoverflow, most seem to suggest adding a plugin to Chrome but that is not a solution for my users who will be using the re-captcha to validate a contact form.
Is this a misconfiguration of my server or is my Angular script missing something? I have already ensured that my domain is configured in my re-captcha account.
ReCaptcha is validated on the server-side, not the client side. The CORS error is due to the fact that the ReCaptcha API is not meant to be used by a browser.
You need to send your recaptcha data to your API/server which then verifies it is correct by sending a request to the ReCaptcha API. There are no CORS restrictions when servers make HTTP requests to each other.
See this Tuts tutorial on how the implementation and flow of data works
The end point https://www.google.com/recaptcha/api/siteverify is part of server side validation and not the client side. You should hit this endpoint from your server, not from your client (Angular 1.X).
So the flow may look like this:
At your client side (Angular 1.X) you will be loading the re-captcha widget in your html which will perform the validation and store a hash value in a hidden input field which will be sent to your server along with the other form details when user submits the form. Now at your server side you will hit that endpoint to verify if the validation was successful.
Also, in no case you should be storing your secret at the client side. It should always be maintained at your server side for server-to-server communication purposes.
Read the docs here.

duplicate ajax calls in angularjs

I am using express-jwt to build a restful api. Now the client is making duplicate ajax calls, for the first one the initiator is angularjs and for the second one the initiator is other. The first one gets 204 as the response code and the second one gets 200 as the response code. I tried to debug to get to the source of this duplicate requests, but I am not able to.
Below is the header details for the one with 204 status code
Below is the header details for the one with 204 status code
Can any one suggest what could be the issue?
The first call is OPTIONS type. That's a pre-flight call which a browser sends if the page and api are not on same domain.
The purpose of this call is to deal with CORS. Backend usually needs to send the allowed request method types (GET, POST etc.). The browser will then send the real call if the desired request type is among those returned.
Here's a sample of the response headers.
You can ignore it for all intents and purposes. It does not contain any normally useful payload or return data.
Take a look at AJAX in Chrome sending OPTIONS instead of GET/POST/PUT/DELETE? for more info.
Those two requests are different one is OPTIONS and other is GET.
For cross-domain requests, setting the content type to anything other than application/x-www-form-urlencoded, multipart/form-data, or text/plain will trigger the browser to send a preflight OPTIONS request to the server.
You need to handle in the server when the request method OPTIONS , then you need to exit with out processing.

A request by user by browser and why more requests made

when i open a site and submit a form, the browser show the response content.
but after i sniff by fiddler, i found more get/post requests sent by browser or js and they are not sent by ajax because no XMLHttpRequest in header. the response content-type are text/html.
so browser should show the new response content,right? but NOT. it still show the first.
1, how browser send more request? i guess they are made by javascript.
2, why browser did not show new content?
Yes it does sound like a client-side scripting language, most likely JavaScript;
It can be an AJAX load. AJAX does not have to be XMLHttpRequest, although most ajax implementations use XMLHttpRequest.

Resources