security issue reproducing d3.js example at home

StackOverflow https://stackoverflow.com/questions/14178509

質問

I'm trying to reproduce this example from github gist (an map of the United States) https://gist.github.com/4431123 The required file "us.json" I copied to my home directory.

A similar problem has already appeared on this site.

<!-- language: lang-html -->
<!DOCTYPE html>
<meta charset="utf-8">
<style>

path {
  fill: none;
  stroke: steelblue;
}

</style>
<body>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://d3js.org/topojson.v0.min.js"></script>
<script>

var width = 960,
    height = 500;

var path = d3.geo.path();

var svg = d3.select("body").append("svg")
    .attr("width", width)
    .attr("height", height);
d3.json("us.json", function(error, us) {
  svg.append("path")
      .attr("d", topojson.object(us, us.objects.counties).geometries.map(function(d) {
        var bounds = path.bounds(d);
        return "M" + bounds[0]
            + "H" + bounds[1][0]
            + "V" + bounds[1][3]
            + "H" + bounds[0][0]
            + "Z";
      }).join(""));
});

</script>

Here are the error messages I'm getting:

XMLHttpRequest cannot load file:///C:/Users/work/Documents/d3js/us.json. Cross origin requests are only supported for HTTP.

So I tried using the web.

XMLHttpRequest cannot load https://gist.github.com/raw/4090846/b8c888f35c42400a080ab03c31a7649e0b9bc9a8/us.json. Origin null is not allowed by Access-Control-Allow-Origin.

Searching gives me this question on StackOverflow suggesting this is Chrome trying to save me from myself.

役に立ちましたか？

解決

You're running into the same origin policy, which only allows AJAX calls from a page to be made to the same host and port, using the same protocol. To get around this, you can run a web server in the directory you're working in using Python:

$ python -m SimpleHTTPServer 8080

You can now access your page at http://localhost:8080 in your web browser, and the AJAX call should now work.

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top