ColdFusion CFC CORS and AJAX posts

Question

I'm trying to get a form posted to a remote server. The general idea, for now, is that the HTML will run locally and will post to a remote server via AJAX.

So there's a form, the JS and the CFC it's posting to.

Below is the JS

$(document).ready(function () {
$("#submit").click(function(){
    var setName = $("input[name='setName']").val();
    var setNumber = $("input[name='setNumber']").val();
    var setTheme = $("input[name='setTheme']").val();

    var retailPrice = $("input[name='retailPrice']").val();
    var purchaseStore = $("input[name='purchaseStore']").val();
    var purchaseDate = $("input[name='purchaseDate']").val();
    var purchasePrice = $("input[name='purchasePrice']").val();

    var condition = $("input[name='condition']").val();

    var sellPrice = $("input[name='sellPrice']").val();
    var sellStore = $("input[name='sellStore']").val();
    var selldate = $("input[name='selldate']").val();

$.ajax({
    type: 'get',
    url: 'http://www.chesteraustin.us/cfc/entry.cfc?ReturnFormat=json',  
    data: {
        method: 'setEntry',
        Set_Name: setName, //CFARGUMENT: JS_VARIABLE
        Set_Number: setNumber,
        Set_Theme: setTheme,
        Retail_Price: retailPrice,
        Purchase_From: purchaseStore,
        Purchase_Price: purchasePrice,
        Purchase_Date: purchaseDate,
        Status: condition,
        Sell_Date: sellPrice,
        Sell_from: sellStore,
        Sell_date: selldate
        },
    contentType: 'json',
    dataType: 'json',
    success: function(response) {
        console.log("you da man");
        }
    });    
}); 
});

Below is the CFC that it is being posted to (I've cut out a lot of it for brevity):

<cfcomponent>
<cfheader name="Access-Control-Allow-Origin" value="*" />
<cfheader name="Access-Control-Allow-Methods" value="GET,PUT,POST,DELETE" />
<cfheader name="Access-Control-Allow-Headers" value="Content-Type" />

<cffunction name="setEntry" access="remote">
    <cfreturn 1>
</cffunction>

</cfcomponent>

EDIT: Cleaned up CFC, removed extraneous comments.

Doing research, I've come across that CFHEADER was supposed to go on top, to allow cross origin, however, Chrome still presents a No 'Access-Control-Allow-Origin' header is present on the requested resource. error.

A couple background things: I'm on a shared host. I have a blank Application.CFC in the folder that the CFC resides in.

Answer 1

So after much research, I've figured out the solution. The ColdFusion code works as intended. However, there was something else controlling the headers (in this case, it was Apache).

Using http://enable-cors.org/server_apache.html as a guide, I modified my .htaccess file in my public_html directory with the following: Header set Access-Control-Allow-Origin "*". Chrome came up with another error, stating that Access-Control-Allow-Headers didn't have Content-Type, so I added that in as well: Header set Access-Control-Allow-Headers Content-Type. Lo and behold, that got it working.

In summary, if CORS on ColdFusion isn't working: <cfheader name="Access-Control-Allow-Origin" value="*" />, check the web server configuration. My .htaccess file now has two lines, and CORS is working now.

Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Headers Content-Type