在本地做个小demo,很简单,一个html文件,一个js文件,在html文件中通过<script>标签引入js,但是出现了一个意想不到的问题:浏览器报错——

  一番折腾后,终于弄明白了:加载js文件时使用了file协议,该协议会导致跨域,而使用htpp、https等协议时则没有跨域问题。而使用file协议则是因为在浏览器中查看html文件时没有起服务!平时使用webstorm时会自动起服务,所以没有注意到这个问题。

  解决方法是安装anywhere npm包,在命令行中执行命令 $ anywhere即可启动服务,然后可以在浏览器中使用http协议来访问html和js,就不会再报跨域错误。

$ npm i anywhere
//进入html文件所在文件夹
$ anywhere

  Anywhere —— 随启随用的静态文件服务器

  Running static file server anywhere. 随时随地将你的当前目录变成一个静态文件服务器的根目录。

html文件引用本地js文件出现跨域问题的解决方案的更多相关文章

  1. Python+Django+js+echarts引入本地js文件的操作方法

    1. 选择正确的echarts.js,开发版选择echarts.baidu.com上的源码版,避免出现问题 2. 在项目主目录中新建static文件夹,里面建立js.css.images文件夹 3. ...

  2. Jquery的load加载本地文件出现跨域错误的解决方案"Access to XMLHttpRequest at 'file:///android_asset/web/graph.json' from(Day_46)

    博主是通过JS调用本地的一个json文件赋值给变量出现的跨域错误, 网上有大量文章,五花八门的,但总归,一般性此问题基本可通过这三种方法解决: https://blog.csdn.net/qq_418 ...

  3. chrome调试本地项目, 引用本地javascript文件

    chrome调试本地项目, 引用本地javascript文件 本地文件可以访问本地文件 修改快捷方式属性 C:\Users\xxx\AppData\Local\Google\Chrome\Applic ...

  4. JS引用另外JS文件的顺序问题。

    1.在a.js中可以引用b.js文件,这样就可以在网页中只引用a.js文件,从而可以使用a.js和b.js文件中的所有方法. 引用格式如下:document.write('<script typ ...

  5. node.js如何引用其它js文件

    以Java来说,比如要实现第三方存储,我可能需要导入对应的库,以maven为例,使用腾讯云或者七牛云.阿里云,我需要导入对应的maven依赖.再比如,有些时候我们封装某个类,而那个类不在该包下,我们需 ...

  6. OSS阿里云上传文件 前端js下载url跨域问题

    场景: 1.后端上传文件至阿里云OSS,返回得到一个URL. 2.前端用这个URL下载文件,ajax请求异常:No 'Access-Control-Allow-Origin' header is pr ...

  7. 小程序-引用其他js文件

    我也是小白菜,之所以有这个记录是因为我做项目时遇到了这个问题 流程: 1.需要建立一个js文件   content.js function myContent() { console.log(&quo ...

  8. vscode编写python,引用本地py文件出现红色波浪线

    前言 引用本地py文件出现红色波浪线,如下图: 原因 经过查询得知,vscode中的python插件默认使用的是pylint来做代码检查,因此需要对pylint做一些配置 解决方案 在setting. ...

  9. FineUIPro中如何支持多语言(全局资源文件和本地资源文件)

    一个客户在邮件中问到了FineUIPro的多语言实现问题,其实 FineUIPro 并没有对此做特殊处理,因此直接使用 ASP.NET 原生支持的资源文件就能实现. 下面我们就以FineUIPro的空 ...

随机推荐

  1. git vim 编辑器基本操作

      用 git 命令行提交文件时,默认使用 vim 编辑器,基本操作: 按 a, i 或 o 进入编辑模式 按 ESC 进入操作模式 在操作模式下,:wq 为写入退出,:q! 不保存退出

  2. 关于找不到类org/apache/commons/lang/xwork/StringUtils的问题

    在替换最新版的 struts2包的解决过程中.遇到 找不到这两个包org/apache/commons/lang/xwork/StringUtils.org/apache/commons/lang/x ...

  3. 【剑指offer】斐波那契数列

    一.题目: 大家都知道斐波那契数列,现在要求输入一个整数n,请你输出斐波那契数列的第n项.n<=39 二.思路: 式子: n=0时,f=0:n=1或者n=2时f=1:否则f=f(n-1)+f(n ...

  4. PHPExcel使用-使用PHPExcel导入文件

    导入步骤: 1. 实例化excel读取对象 2. 加载excel文件 ----------------> ( 1>. 全部加载. 2>. 选择加载. ) 3. 读取excel文件 - ...

  5. vue学习之webpack

    本质上,Webpack是一个现代 JavaScript应用程序的静态模块打包器(module bundler).当 Webpack处理应用程序时,它会递归地构建一个依赖关系图(dependency g ...

  6. PHP生成zip压缩包

    /* * $res = new MakeZip($dir,$zipName); *@ $dir是被压缩的文件夹名称,可使用路径,例 'a'或者'a/test.txt'或者'test.txt' *@ $ ...

  7. 5分钟带你入门vuex(vue状态管理)

    如果你之前使用过vue.js,你一定知道在vue中各个组件之间传值的痛苦,在vue中我们可以使用vuex来保存我们需要管理的状态值,值一旦被修改,所有引用该值的地方就会自动更新,那么接下来我们就来学习 ...

  8. unity3d-小案例之角色简单漫游

    准备资源 我这里从网上下载一个角色模型,里面有一组动画.有站立.奔跑.杀怪等 我们来实现角色的前后左后移动,即键盘上的WSDA键,这里因为没有行走的动画.索性就用奔跑代替了!! 暂时先不计较代码冗余的 ...

  9. background 背景图片 在IE8中不显示解决方法

    我给ul加了一个背景图片 background 火狐 ie9 ch都显示.唯独在IE8中不显示 之前的样式代码 background: url( rgba(, , , ); 在ie8中改成 backg ...

  10. 安装PHP及Memcache扩展

    安装PHP及Memcache扩展 地址:http://blog.csdn.net/poechant/article/details/6802312   1. 下载 (1)libevent 官方网页:h ...