问题描述

RequireJS跨域加载HTML模版失败,例如:
在a.com域名下请求CDN域名下的模版,text.js插件会把html文件转成html.js文件去加载,由于并没有生成html.js文件,所以会404

问题原因

  • 打包后部分HTML模版无法内联,原因是同一模块引入的路径不一致
  • 通过XHR请求HTML模版,浏览器同源策略,无法跨域

解决方案

  • 打包后内联HTML模版,无需异步加载HTML文件,需要正确配置模版引用否则无法打包成内联模版,打包配置默认是内联模版
  • 打包后生产模版的JS文件,即会生成一个模版的html.js文件,里面定义的是一个模块,返回html模版字符串,通过设置打包配置参数即可optimizeAllPluginResources: true。可以跨域解析,但产生大量冗余文件,可以单独上传,不好维护。

官方文档详细说明

https://github.com/requirejs/text

RequireJS跨域加载html模版后被转成JS问题分析及解决的更多相关文章

  1. jquery mobile 和phonegap开发总结之三跨域加载页面

    跨域加载 一要进行一定的配置见下面 $( document ).bind( "mobileinit", function() { // Make your jQuery Mobil ...

  2. jquery中ajax跨域加载

    今天学习ajax跨域加载,先来一段代码,异步加载的链接是爱奇艺的开源,我直接拿来用作测试 <!DOCTYPE html> <html lang="en"> ...

  3. chrome浏览器下用jQuery的load函数来跨域加载页面,响应状态status为(canceled)是什么情况? JSON和JSONP,也许你会豁然开朗,含jQuery用例

    http://www.cnblogs.com/dowinning/archive/2012/04/19/json-jsonp-jquery.html 问题来源:http://q.cnblogs.com ...

  4. pdf.js跨域加载文件

    pdf.js一个基于Html的工具类,熟悉pdf.js的朋友们很清楚,pdf.js帮助我们做了很多事.尤其金融类网站会产生很多的报表.需要在线预览.pdf.js绝对是我们的首选 本地预览 在pdf.j ...

  5. JQuery和原生JS跨域加载JSON数据或HTML。

    前提:有时候需要在网页上,加载另一个网站上的数据.或者加载另一个网站上的一个页面.Js的Ajax请求不具备跨域功能,可以使用JQuery来实现. 网页端JS代码: $(function () { $. ...

  6. script通过script标签跨域加载数据

    /********************************************************** 说明:跨域请求数据Javascript组件 ------------------ ...

  7. flash 跨域加载 二次加载

    var url2:String = "http://thirdapp0.qlogo.cn/qzopenapp/fa5d80ebf9fc89aaa1d7ddb0e1b861e58d77b409 ...

  8. requirejs:模块加载(require)及定义(define)时的路径小结

    原文地址:http://www.tuicool.com/articles/7JBnmy 接触过requirejs的童鞋可能都知道,无论是通过define来定义模块,还是通过require来加载模块,模 ...

  9. RequireJS 主入口加载模块经常会加载失败的问题

    在接入requirejs时,在main入口遇到了这样的问题,使用jquery,刷新10次页面会有3-4次加载失败,找不到$符号等等 require.config({ 'baseUrl': './mod ...

随机推荐

  1. codeforces 462div.2

    A A Compatible Pair standard input/output 1 s, 256 MB    x1916 B A Prosperous Lot standard input/out ...

  2. liunx 安装jdk1.8

    采用解压压缩文件形式安装 第一步:将jdk压缩文件上传至home目录下面 第二步:目录切换至/usr目录下   cd /usr 创建java目录   mkdir   java 第三步:将jdk 压缩文 ...

  3. springboot第一个项目【创建】

    1.new project,不勾选create from archetype,直接选择 2.next下一步 在Maven依赖管理中,唯一标识一个依赖项是由该依赖项的三个属性构成的,分别是groupId ...

  4. Android:四大架构的优缺点,你真的了解吗?

    声明|转载于作者:KunMinX原文链接:https://www.jianshu.com/p/9ef813d5c1af 前言 前不久刚结束对 20 模块项目的第 3 轮重构,一路见证 MVC.MVP. ...

  5. Mybatis调用PostgreSQL存储过程实现数组入参传递

    注:本文来源于 < Mybatis调用PostgreSQL存储过程实现数组入参传递  > 前言 项目中用到了Mybatis调用PostgreSQL存储过程(自定义函数)相关操作,由于Pos ...

  6. Confluence 6 配置 Windows 服务

    当你使用 Start Confluence Automatically on Windows as a Service 的方式启动的时候,你有下面 2 种方式来配置你的系统属性:通过 command ...

  7. Confluence 6 数据库表-集群(Clustering)

    下面的表格包含了 Confluence 站点使用集群的信息. clustersafety 在通常的情况下,这个表格只有一条记录. safetynumber 的值是 Confluence 被用来如何找到 ...

  8. Confluence 6 手动备份

    Confluence 的 Attachment Storage Configuration 可以配置 Confluence 将附件存储在  home directory,或者是存储在数据库中. Dat ...

  9. caffe2安装

    参考http://blog.csdn.net/Andy965/article/details/70808909?locationNum=5&fps=1 建议将make 和make instal ...

  10. day10 函数

    函数基础 函数概念 为什么用函数 什么是函数 定义函数 调用函数 返回值详解上节回顾 文件处理 修改文件 1.读取要修改文件内容 read可能导致内存溢出 赋值给变量 修改 将修改后的内容重新写入文件 ...