怎么配置谷歌浏览器支持file协议的AJAX请求

这次给大家带来怎么配置谷歌浏览器支持file协议的AJAX请求,配置谷歌浏览器支持file协议AJAX请求的注意事项有哪些,下面就是实战案例,一起来看一下。

什么问题 

WEB开发过程中,很多时候我们都是写一些简单的Demo,并不是开发一个完整项目,此时我们常见的操作是:

 •新建文件夹
 •新建需要的文件
 •在Sublime(或其他注意事项)中完成DEMO的编码
 •双击HTML文件,直接在浏览器中运行演示 

如果此时Demo中有AJAX操作,浏览器就会报一个错: 

XMLHttpRequest cannot load 注意事项/Users/iceStone/注意事项s/Learning/angular/demo/angular-moviecat/movie/view.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-注意事项. 

原因很简单,浏览器(Webkit内核)的安全策略决定了file协议访问的应用无法使用XMLHttpRequest对象,错误消息中也很清楚的说明了:

Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource. 

跨域请求仅支持协议:http, data, chrome, chrome-extension, https, chrome-extension-resource 

在某些浏览器中是允许这种操作的,比如Firefox浏览器,也就是说Filefox支持file协议下的AJAX请求。 

解决办法 

作为我个人最喜欢的Chrome,强大,没什么好说的,只有想不到,几乎没有做不到,所以必须也得支持:

 Windows:

•设置Chrome的快捷方式属性,在“目标”后面加上–allow-file-access-from-files,注意前面有个空格,重新打开Chrome即可。

 Mac:

•只能通过终端打开浏览器:打开终端,输入下面命令:open -a “Google Chrome” –args –disable-web-security然后就可以屏蔽安全访问了[ –args:此参数可有可无] 

补充说明 

长久来看,你肯定是需要通过HTTP的方式访问你的应用,那就需要配置HTTP服务器软件。但是对于一些刚入门的同学,配一个HTTP服务器(比如Apache、IIS等)比较繁琐,望而却步。

 •对于使用IDE的同学没什么好说的,每个用于Web开发的IDE都内置http服务器,不用单独配置。
 •对于喜欢轻量级编辑器的同学,比如Sublime Text,它默认是没有内置HTTP服务器的 

接下来推荐一款Sublime的插件Sublime Server,这个插件可以提供一个静态文件HTTP服务器,具体使用方式如下:

 •安装Package Control(Sublime的插件管理工具),不会安装自行Google
 •Command+Shift+P或Ctrl+Shift+P打开命令面板,输入Package Control: Install Package
 •稍等片刻(此时会连接到插件提供商的服务器,比较慢,有可能背墙),搜索SublimeServer
 •安装完成过后通过Tool → SublimeServer → Start SublimeServer
 •一定要用打开文件夹的方式使用Sublime,否则没有办法正常使用SublimeServer。
 •打开HTML文件,在右键菜单中选择View in SublimeServer,此时就可以以HTTP方式在浏览器中访问该文件了,
 •如果该选项是灰色的,那就说明没有启动SublimeServer,Tool → SublimeServer → Start SublimeServer 

到此为止,你已经可以在Sublime中使用HTTP服务器了。 

可能遇到的问题 

如果Start SublimeServer不能点,可能是当前8080端口被占用了(SublimeServer默认使用8080端口) 

解决方法就是打开注意事项将端口修改为其他端口:

以下是我的配置: 

{  "attempts": 5,  "autorun": false, // 是否在启动Sublime时自动启动SublimeServer  "defaultExtension": ".html",  "interval": 500,  "mimetypes":  {    "": "application/octet-stream",    ".c": "text/plain",    ".h": "text/plain",    ".py": "text/plain"  },  "port": 2016 // 端口号}

登录后复制

当然其他编辑器也有类似的插件。 

相信看了本文案例你已经掌握了方法,更多精彩请关注【创想鸟】其它相关文章!

推荐阅读:

注意事项

注意事项

以上就是怎么配置谷歌浏览器支持file协议的AJAX请求的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2776906.html

(0)
上一篇 2025年3月8日 14:58:00
下一篇 2025年3月1日 23:03:53

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • Ajax与浏览器缓存的使用详解

    这次给大家带来Ajax与浏览器缓存的使用详解,Ajax与浏览器缓存使用的注意事项有哪些,下面就是实战案例,一起来看一下。 在现代Web应用程序中,前端代码充斥着大量的Ajax请求,如果对于Ajax请求可以使用浏览器缓存,那么可以显著地减少网…

    编程技术 2025年3月8日
    200
  • js清除浏览器缓存

    本篇文章的内容是js清除浏览器缓存,在这里分享给大家,也可以给有需要的朋友做一下参考,大家一起来看一看吧 一、meta方式                            登录后复制 一开始百度后的做法,但是在360中并不适应 二、动…

    编程技术 2025年3月8日
    200
  • ajax文件上传+处理浏览器兼容

    这次给大家带来ajax文件上传+处理浏览器兼容,ajax文件上传+处理浏览器兼容的注意事项有哪些,下面就是实战案例,一起来看一下。 ajaxfileupload控制很好用,不过发现上传文件后的结果为被浏览器处理,IE不会,谷哥和火狐都会进行…

    编程技术 2025年3月8日
    200
  • ajax回调打开新窗体时怎样不被浏览器拦截

    这次给大家带来ajax回调打开新窗体时怎样不被浏览器拦截,ajax回调打开新窗体时不被浏览器拦截的注意事项有哪些,下面就是实战案例,一起来看一下。 ajax回调打开新窗体防止浏览器拦截,就这么做! 问题剖析: function click_…

    编程技术 2025年3月8日
    200
  • ajax怎么实现服务器与浏览器长连接

    这次给大家带来ajax怎么实现服务器与浏览器长连接,ajax实现服务器与浏览器长连接的注意事项有哪些,下面就是实战案例,一起来看一下。 有时候,需要服务器主动给浏览器推送数据,这里用ajax来实现这种功能,具体请看这里: var uid =…

    编程技术 2025年3月8日
    200
  • 低版本的浏览器不支持es6的import的处理方式

    这次给大家带来低版本的浏览器不支持es6的import的处理方式,低版本的浏览器不支持es6的import处理的注意事项有哪些,下面就是实战案例,一起来看一下。 解决方法: 1. 2. 下载最新版本的chrome浏览器 相信看了本文案例你已…

    编程技术 2025年3月8日
    200
  • Angular的浏览器插件Batarang使用详解

    这次给大家带来Angular的浏览器插件Batarang使用详解,Angular浏览器插件Batarang使用的注意事项有哪些,下面就是实战案例,一起来看一下。 Angular浏览器插件Batarang介绍 对于Angular新手来说,刚接…

    编程技术 2025年3月8日
    200
  • JS怎样检测浏览器内的脚本

    这次给大家带来JS怎样检测浏览器内的脚本,JS检测浏览器内脚本的注意事项有哪些,下面就是实战案例,一起来看一下。 以下是完整的用户代理字符串检测脚本,包括检测呈现引擎、平台、Windows操作系统、移动设备和游戏系统。 var client…

    编程技术 2025年3月8日
    200
  • Date()函数在浏览器内的兼容问题处理

    这次给大家带来Date()函数在浏览器内的兼容问题处理,Date()函数在浏览器内兼容问题处理的注意事项有哪些,下面就是实战案例,一起来看一下。 一般 直接new Date() 是不会出现兼容性问题的,而 new Date(datetime…

    编程技术 2025年3月8日
    200
  • JS操作浏览器打开关闭

    这次给大家带来JS操作浏览器打开关闭,JS操作浏览器打开关闭的注意事项有哪些,下面就是实战案例,一起来看一下。 JS监控关闭浏览器操作的实例详解 需求如下: 用户关闭浏览器通知后台。 方案如下: 1.采用js监控关闭浏览器操作。 2.用户关…

    编程技术 2025年3月8日
    200

发表回复

登录后才能评论