关于本地文件请求json文件
因为需要用到json数据格式,上网查了一下例子之后我就想本地测试一下看能不能成功。
结果,chrome下没有任何反应,打开控制台之后报错如下:
XMLHttpRequest cannot load file:///E:/project/info.json. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
查了一下资料发现,这似乎是Ajax跨域问题。
什么叫跨域?
首先我们应该知道在JavaScript的安全性上,有一条很重要的安全限制,叫“同源策略”。就是一个脚本只能读取与它同源(如由同一个主机下载,通过同一个端口下载或者下载协议相同)的窗口或者文档的属性。
这种限制是很有必要的,如果没有这种限制,窗口中的不可靠脚本就可以用DOM方法读取浏览器窗口的内容,而窗口中可能会含有私有信息。
跨域的意思,顾名思义,跨是跨越,域就是别的服务器,跨域其实就是去别服务器上取东西。 只要协议、域名、端口有任何一个不同,都被当作是不同的域
然后问题来了,我这是本地测试啊,跨什么域?继续查资料。
查出来的结果是Chrome在读取本地相对路径脚本时,禁止向第三方请求数据。chrome的安全机制限制了本地文件的xhr请求。
好吧,于是我把整个项目放上github,github page上显示正常,我的问题倒是解决了。
关于Ajax跨域的问题,有兴趣的还可以看一下这份文档:How to run things locally
接下来我顺手测试了一下别的浏览器本地文件跨域,结果:
Firefox:没有任何安全提示与确认,跨域成功。
IE11:默认会提示加载不安全activex控件,要求确认,确认之后跨域是OK的。
:(
关于本地文件请求json文件的更多相关文章
- 直接请求json文件爬取天眼查企业信息(未解决验证码问题)——python3实现
几个月前...省略一堆剧情...直接请求json文件爬取企业信息未成功,在知乎提问后,得到解决,有大佬说带上全部headers和cookie是可以的,我就又去试了下,果然可以(之前自己试的时候不行,没 ...
- vue+webpack项目中使用dev-server搭建虚拟服务器,请求json文件数据,实现前后台分离开发
在项目开发中,前后台分离,做了假数据,项目使用vue2.0重构,后台也推到重来了,为了不耽误开发进程,我做了虚拟的数据请求,使用vue-cli脚手架搭建的项目文件中dev-server搭建虚拟api请 ...
- Extjs加载本地的一个json文件
<head> <title></title> <link href="../Styles/Extjs/resources/css/ext ...
- mongodb-导出数据到csv文件或json文件
在mongodb的bin目录下, 有一个mongoexport, 可用于数据的导出 [wenbronk@localhost bin]$ ./mongoexport --help Usage: mong ...
- 解析获得的网页数据(XML文件或JSON文件)
1.解析XML:使用Pull方式. 需要导入jar包:xmlpull-xpp3-1.1.4c.jar //Pull解析XML文件 private void parseXMLWithPull(Strin ...
- node读取文件转换json文件
{ ".323":"text/h323" , ".3gp":"video/3gpp" , ".aab" ...
- 推荐一个yaml文件转json文件的在线工具
YAML的全称是YAML Ain't Markup Language,是一种简洁的非标记语言,以数据为中心,使用空白,缩进,和分行组织数据,从而使得表示更加简洁易读. YAML如今广泛应用于微服务开发 ...
- 本地json文件的编辑器,node-webkit开发的exe程序
首发:个人博客,更新&纠错&回复 在昨天的dota契合度计算器中,用到了dota英雄数据和dota玩家数据这两个数据库,为了便于网页应用使用,这两个数据库的存储格式是json,即her ...
- jquery easyui读取json文件乱码
输出的json要求用utf-8,否则因json的编码格式有问题显示不了中文.记事本默认编码是ANSI,若保存的json是由记事本改后的缀名,则json格式有问题,显示中文为乱码. 解决方法:打开.js ...
随机推荐
- C++ 函数模板&类模板详解
在 C++ 中,模板分为函数模板和类模板两种.函数模板是用于生成函数的,类模板则是用于生成类的. 函数模板&模板函数 类模板&模板类 必须区分概念 函数模板是模板,模板函数时 ...
- <input> type 属性
单行文本域 语法格式:<input type = “text” 属性 = “值” /> 常用属性 1 name:文本框的名字.命名规则是:可以包含字母.数字.下划线,只能以字母开头. ...
- 在熟练使用2B铅笔前,请不要打开Axure
在互联网产品领域,Axure已成为产品经理.产品设计师以及交互设计师的必备工具,从某种程度讲,Axure帮助我们建立低保真模型,便于与用户的需求验证,也帮助我们构思交互细节,使前端和开发人员更容易理解 ...
- Java之io nio aio 的区别
这个问题最近面试总是遇到,作为一个只会写流水代码的程序员,一脸懵逼.看了网上的解释,看的还是很模糊,说下我对这个的理解. 先引出一个话题,两个大水缸,一个空一个满,让你把一个缸里面的水弄到另一个里面. ...
- Python学习day11-函数基础(1)
figure:last-child { margin-bottom: 0.5rem; } #write ol, #write ul { position: relative; } img { max- ...
- 02_jQuery对象初识(二)筛选器1
0. HTML对象和jQuery对象的区别: 1.jQuery对象转换成DOM对象,用索引取出具体的标签 2.DOM对象转换成jQuery对象,$(DOM对象) 注意:jQuery对象保存到变量的时候 ...
- 2019-8-30-Jenkins-配置自动合并-release-分支到-master-分支
title author date CreateTime categories Jenkins 配置自动合并 release 分支到 master 分支 lindexi 2019-08-30 08:5 ...
- Gym-102141E
https://vjudge.net/problem/Gym-102141E 用set乱搞 #include<iostream> #include<cstdio> #inclu ...
- Django项目:CMDB(服务器硬件资产自动采集系统)--06--06CMDB测试Linux系统采集硬件数据的命令01
#base.py # ————————01CMDB获取服务器基本信息———————— from config import settings #配置文件 class BasePlugin(object ...
- spring基于接口的代理报错
报错: 1.在service层加上@Transactional注解.浏览器端报错(如下),eclipse控制台无信息 2.去掉@Transactional注解,无报错,但是数据库没有信息插入. 解决方 ...