今天代码中,引入了一个本地的json文件,使用了getJSON函数来获取它的数据并打印,具体代码如下:
获取数据的代码
但是在谷歌浏览器中打开运行的时候报错,具体报错如下:
报错信息
网上查了一下,说是因为同源策略导致的本地文件无法直接获取。浏览了一大圈,大致的解决办法分为两类,
一类是通过修改浏览器的一些配置,找了几个方法试了一下,没有效果。第二类方法,将整个文件夹都放到本地服务器中,这样访问的时候文件就都在同一个域中,从而解决问题。于是第二类方法走起:
首先,下载了WAMPServer的软件并安装后打开,任务栏的右下角出现绿色的小图标就是正确启动了
正确启动的时候是绿色的
第二步:在绿色图标上左键单击(注意是左键),然后单击www directory选项,会自动到一个目录
跳转过来的目录
这个目录就是用来存放你的项目文件的地方,将你写好的整个项目文件放到这里,例如我上面的final2文件夹
第三步:打开浏览器,输入http://localhost/final2之后回车,就可以打开final2文件夹下面的index.html文件。这是默认的,如果你想打开其他的html文件,可以继续输入文件名即可,例如http://localhost/final2/mutao/test/dropdown.html 就可以打开dropdown.html 文件
这个时候再打开控制台,你就会发现之前的报错没有了,想要打印的数据正确的打印出来了
数据正确的获取到了
OK,大功告成!