DZone
Web Dev Zone
Thanks for visiting DZone today,
Edit Profile
  • Manage Email Subscriptions
  • How to Post to DZone
  • Article Submission Guidelines
Sign Out View Profile
  • Post an Article
  • Manage My Drafts
Over 2 million developers have joined DZone.
Log In / Join
  • Refcardz
  • Trend Reports
  • Webinars
  • Zones
  • |
    • Agile
    • AI
    • Big Data
    • Cloud
    • Database
    • DevOps
    • Integration
    • IoT
    • Java
    • Microservices
    • Open Source
    • Performance
    • Security
    • Web Dev
DZone > Web Dev Zone > HTML5 XmlHttpRequest 2 - Cross origin request

HTML5 XmlHttpRequest 2 - Cross origin request

Sagar Ganatra user avatar by
Sagar Ganatra
·
Apr. 28, 11 · Web Dev Zone · News
Like (0)
Save
Tweet
20.86K Views

Join the DZone community and get the full member experience.

Join For Free
HTML5 specification has introduced a few enhancements for XmlHttpRequest object and one of them is the ability to make cross-origin request. That is, a host can send a XmlHttpRequest request to another host and receive a response in return. On the server-side, a check can be made to see whether the request can be accepted from the given origin. In this post I'll try to explain how this can be done using ColdFusion.

Client side:

On the client side, a XmlHttpRequest object is created and then a GET request is made to the remote server.
 var client = new XMLHttpRequest();  
 client.onreadystatechange = readyStateChangeHandler;  
 client.open("GET","http://{remote-address}/{path-to-file}.cfm",true);  
 client.send(); 

For example, say example.com wants to get a response from another domain say abc.com, then as observed from the above code the request would look like:
 client.open("GET","http://abc.com/dir1/foo.cfm",true);  

Server side:

When a request is sent to the server, the request header would contain a key ORIGIN whose value will be the domain name from which the request was made. In this case the value would be example.com. The server side code can then perform a check to see whether the request origin belongs to the list of origins from which the request can be accepted.
 <cfif structKeyExists(getHTTPRequestData().headers,"origin") >  
      <cfset origin = getHTTPRequestData().headers.origin />  
      <cfif origin eq "http://example.com">  
           <cfheader name="Access-Control-Allow-Origin"  
                value="http://example.com">  
           <cfoutput>#timeFormat(now(),"medium")#</cfoutput>  
      </cfif>  
 </cfif>  

As seen from the above code, the response header ACCESS-CONTROL-ALLOW-ORIGIN is set to allow cross-origin requests from example.com. This now enables requests from example.com to be served from abc.com. 


Requests HTML

Published at DZone with permission of Sagar Ganatra, DZone MVB. See the original article here.

Opinions expressed by DZone contributors are their own.

Popular on DZone

  • An Overview of Key Components of a Data Pipeline
  • Why Performance Projects Fail
  • Privacy and the 7 Laws of Identity
  • 6 Quick Tips for Building an App

Comments

Web Dev Partner Resources

X

ABOUT US

  • About DZone
  • Send feedback
  • Careers
  • Sitemap

ADVERTISE

  • Advertise with DZone

CONTRIBUTE ON DZONE

  • Article Submission Guidelines
  • MVB Program
  • Become a Contributor
  • Visit the Writers' Zone

LEGAL

  • Terms of Service
  • Privacy Policy

CONTACT US

  • 600 Park Offices Drive
  • Suite 300
  • Durham, NC 27709
  • support@dzone.com
  • +1 (919) 678-0300

Let's be friends:

DZone.com is powered by 

AnswerHub logo