CherryPy and CORS
<p>I have an nginx server set up where I would like to set up a service that receives a string and returns a result.  I plan to use Python to do the processing, with CherryPy as an interface.  I've tested the CherryPy part, and know it receives properly.  When I try to connect to the CherryPy service with a web page, I get CORS errors.  How can I get them to communicate?</p>

<p>Here's the Python Code:</p>

<pre><code>import cherrypy
import random
import urllib

class DataView(object):
    exposed = True

    @cherrypy.tools.accept(media='application/json')

    def GET(self):
        rawData = cherrypy.request.body.read(int(cherrypy.request.headers['Content-Length']))
        b = json.loads(rawData)
        return json.dumps({'x': 4, 'c': b})

    def CORS():
        cherrypy.response.headers["Access-Control-Allow-Origin"] = "*"

if __name__ == '__main__':
    conf = {
        '/': {
            'request.dispatch': cherrypy.dispatch.MethodDispatcher(),
            'tools.CORS.on': True,
        }
    }
    cherrypy.tools.CORS = cherrypy.Tool('before_handler', CORS)
    cherrypy.config.update({'server.socket_port': 3000})
    cherrypy.quickstart(DataView(), '', conf)
</code></pre>

<p>Here's my web page:</p>

<pre><code>&lt;html lang="en"&gt;
&lt;head&gt;
    &lt;script src="http://code.jquery.com/jquery-1.11.0.min.js"&gt;&lt;/script&gt;
    &lt;link href="http://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet"&gt;
    &lt;script type="text/javascript"&gt;

        $(document).on('click', "#submitButton", function(){
            $.ajax({

                type: 'GET',

                url: 'http://localhost:3000',

                contentType: 'text/plain',

                xhrFields: {
                    // The 'xhrFields' property sets additional fields on the XMLHttpRequest.
                    // This can be used to set the 'withCredentials' property.
                    // Set the value to 'true' if you'd like to pass cookies to the server.
                    // If this is enabled, your server must respond with the header
                    // 'Access-Control-Allow-Credentials: true'.
                    withCredentials: false
                },

                headers: {
                },

                success: function() {
                    console.log("Success");
                },

                error: function() {
                    console.log("Fail");
                }
            }); 
        });
&lt;/script&gt;

&lt;/head&gt;

&lt;body&gt;

    &lt;div id="header"&gt;
        &lt;h2&gt;PDE Grammar Engine&lt;/h2&gt;
        &lt;form&gt;
            Input Sentence:&lt;br&gt;
            &lt;input type="text" name="query" id="query"&gt;&lt;br&gt;

            &lt;input type="submit" id="submitButton" value="Submit"&gt;

        &lt;/form&gt;
    &lt;/div&gt;
    &lt;/div id="results"&gt;
    &lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>