一、今晚遇到一个问题，就是不能直接在 html 直接调用 js 代码的问题

二、会出现如下错误：

    Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval'". Either the 'unsafe-inline' keyword, a hash ('sha256-    vKuX0yKlIAX3ZzZ9/PIUq7x1z425uZLu4glsP+4fqXM='), or a nonce ('nonce-...') is required to enable inline execution.

三、解决方法，就是将 js 代码写成单独的文件，然后包含进去即可。

    # index.html

    <!DOCTYPE html>

    <html>

      <head>

        <script src="js/vue.min.js"> </script>

      </head>

      <body>

        <div id="chen_test_id1">

          <p>{{ message }}</p>

        </div>

        <script src="js/test.js"> </script>

      </body>

    </html>


    // js/test.js

    src="js/vue.min.js">

    new Vue({

      el: '#chen_test_id1',

      data: {

        message: 'Hello Vue.js!'

      }

    })

Chrome 调用vue.js 记录的更多相关文章

  1. iOS 或者Android调用vue.js 里面的方法

    1.原生调用vue.js 某个vue组件下的方法. 比如**.vue里面有个这样的方法: 如果这样的话,在iOS或者Android里面是调用不了这个ajax方法的. 需要在**.vue (我的版本是v ...

  2. chrome调试vue.js的插件：vue.js devtools

    1.什么是vue.js devtools? vue.js devtools是chrome的一款插件,用来调试vue的一款神器. 2.为什么下载vue.js devtools? 由于vue是数据驱动的, ...

  3. Chrome安装Vue.js devtool F12无效

    要安装 vue-devtools-4.1.4_0 链接: https://pan.baidu.com/s/1aeUxKJEUDW0U_i6uuAZFvQ 提取码: 4btc vue-devtools- ...

  4. vue-axios当只调用vue.js又需要axios请求多时

    可以将axios方法封装一个函数 (function () { ASK = { get:function (url,data,succFun,errFun) { axios.get(url,{ par ...

  5. oc 与 js交互之vue.js

    - .vue.js 调用oc的方法并传值 vue.js 组件中调用方法: methods: {     gotoDetail(item){         //此方法需要在移动端实现,这里可以加入判断 ...

  6. Vue.js模板语法

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. 每天记录一点：NetCore获得配置文件 appsettings.json vue-router页面传值及接收值 详解webpack + vue + node 打造单页面(入门篇) 30分钟手把手教你学webpack实战 vue.js+webpack模块管理及组件开发

    每天记录一点:NetCore获得配置文件 appsettings.json   用NetCore做项目如果用EF  ORM在网上有很多的配置连接字符串,读取以及使用方法 由于很多朋友用的其他ORM如S ...

  8. Vue.js中，如何自己维护路由跳转记录？

    在Vue的项目中,如果我们想要做返回.回退操作时,一般会调用router.go(n)这个api,但是实际操作中,使用这个api有风险,就是会让用户跳出当前应用,因为它记录的是浏览器的访问记录,而不是你 ...

  9. vue.js学习记录

    vue.js学习记录 文章已同步我的github笔记https://github.com/ymblog/blog,欢迎大家加star~~ vue实例 生命周期 beforeCreate:不能访问thi ...

随机推荐

  1. Selenium2自动化测试实战序言

    记得很久之前接触自动化的时候看了一本关于某早期自动化测试工具的书,书名已经记不得了,内容却一直印象深刻.因为那本书根本就是把官方文档有选择性的翻译一遍,对于实际应用来说其作用几乎是零.因此从那时候起我 ...

  2. 【转】Oracle回收站(recyclebin)

    我们都比较熟悉windows中的回收站,文件删除后放到回收站里还可以再复原.Oracle回收站的原理完全一样,只是实现的细节方面有些差异.另外回收站中只能回收表和相关的对象包括索引.约束.触发器.嵌套 ...

  3. Android_Bitmap_图片的二次采样并生成缩略图

    1.Bitmap概述 Android系统支持几种图片(.png (preferred), .jpg (acceptable), .gif (discouraged)), 其中Bitmap位图#ffff ...

  4. sublime 技巧与快捷键篇

    技巧大全:https://www.zhihu.com/question/24896283   项目排除文件夹,更便于ctrl + p的搜索,比如可恶的node_modules "folder ...

  5. 转 redis 锁

    原文链接: http://www.promptness.cn/article/34 前言 分布式锁一般有三种实现方式:1. 数据库乐观锁:2. 基于Redis的分布式锁:3. 基于ZooKeeper的 ...

  6. jmeter压测前清理内存

    jmeter 压测时设置了内存为sed -i 's/HEAP="-Xms512m -Xmx512m"/HEAP="-Xms36096m -Xmx360096m" ...

  7. ios支付宝问题整合

           1. 报错:rsa_private read error : private key is NULL     原因:私钥没有转成PKCS8   解决方法: 1)在RSADataSigne ...

  8. 【Unity】10.2 通用动画的导入和设置

    分类:Unity.C#.VS2015 创建日期:2016-05-02 一.简介 使用类人动画时,Mecanim 的强大之处最明显.但是,尽管没有 Avatar 系统和其他功能,非类人动画也仍然受Mec ...

  9. Git 工具 - 凭证存储

    凭证存储 如果你使用的是 SSH 方式连接远端,并且设置了一个没有口令的密钥,这样就可以在不输入用户名和密码的情况下安全地传输数据. 然而,这对 HTTP 协议来说是不可能的 —— 每一个连接都是需要 ...

  10. maven正式版本和快照版本的区别

    Maven中建立的依赖管理方式基本已成为Java语言依赖管理的事实标准,Maven的替代者Gradle也基本沿用了Maven的依赖管理机制.在Maven依赖管理中,唯一标识一个依赖项是由该依赖项的三个 ...