Base标签小记:更改当前页面的地址
一般来说,H5游戏的部署,index.html和代码资源都会放在同一个地址下然后使用iFrame导入到需要加载游戏的页面即可。
但是今天游戏项目部署遇到了一个问题,游戏自己的访问页面(index.html)的地址(a.com)和游戏代码资源的地址(b.com)不在一个地方,这就导致在index中加载了游戏代码后,游戏代码中引用的所有相对路径的资源都报404,(比如实际地址是b.com/res/1.png,但是由于加载到index中,使用a.com的路径,所以请求地址变成了a.com/res/1.png,当然会404了。)
解决方法就是修改当前页面的默认地址,即Base标签。
地址不变时
游戏资源地址不会变化时可以这么写:
<html>
<head>
<base href="http://www.b.com/res/" />
</head>
<body>
</body>
</html>
此时,当前页面下的所有相对路径都相对于b.com/res/这个路径来寻找。
地址会变动时
地址会变动时,可以采用js动态添加base标签或动态修改base标签来改变默认地址,如下:
var basePath = ""; // 各种方式获取要更改的默认路径 var base = document.createElement("base");
base.setAttribute("href", basePath);
document.getElementsByTagName('head')[0].appendChild(base);
效果一致。
注意事项
默认地址一旦改变,就会影响当前页面上的所有相对路径。
Base标签小记:更改当前页面的地址的更多相关文章
- JavaScript Window Location 当前页面的地址
window.location 对象用于获得当前页面的地址 (URL),并把浏览器重定向到新的页面. Window Location window.location 对象在编写时可不使用 window ...
- vue监听当前页面的地址变化/路由变化
转载自: Heap Stack(Pingbook) https://pingbook.top/vue-watch-current-url-route-change/
- base标签的作用
base标签可以自定义当前页面的相对路径,不受浏览器当前地址栏的影响,以base标签定义的地址为准 (只对相对路径起作用) <head> <meta charset="UT ...
- base标签的作用是什么
转自:https://www.cnblogs.com/chenqiBlog/p/9517905.html base标签是HTML语言中的基准网址标记,它是一个单标签,位于网页头部文件的head标签内, ...
- HTML <base> 标签 为页面上的所有链接规定默认地址或默认目标
定义和用法 <base> 标签为页面上的所有链接规定默认地址或默认目标. 通常情况下,浏览器会从当前文档的 URL 中提取相应的元素来填写相对 URL 中的空白. 使用 <base& ...
- PHP中$_SERVER获取当前页面的完整URL地址
PHP中$_SERVER获取当前页面的完整URL地址,其实很简单,主要是通过$_SERVER超全局变量来实现的. 具体PHP中$_SERVER获取当前页面的完整URL地址如下. #测试网址: ...
- 【转】asp.net获取当前页面的url地址
设当前页完整地址是:http://www.jb51.net/aaa/bbb.aspx?id=5&name=kelli "http://"是协议名 "www.jb5 ...
- asp.net获取当前页面的url地址
设当前页完整地址是:http://www.jb51.net/aaa/bbb.aspx?id=5&name=kelli "http://"是协议名 "www.jb5 ...
- html base标签 target=_parent使用介绍
<base>标签为页面上的所有链接规定默认地址或默认目标. 通常情况下,浏览器会从当前文档的URL中提取相应的元素来填写相对URL中的空白. 使用<base> 标签可以改变这一 ...
随机推荐
- JVM之对象分配:栈上分配 & TLAB分配
1. Java对象分配流程 2. 栈上分配 2.1 本质:Java虚拟机提供的一项优化技术 2.2 基本思想: 将线程私有的对象打散分配在栈上 2.3 优点: 2.3.1 可以在函数调用结束后自行销毁 ...
- RESTful restful api Representational State Transfer
通俗直白讲:REST是一种编写风格,一种API接口规范.它的风格就是将对象(如学生)的状态(如增删改查,API接口版本号等等)通过其他方式传递,API的接口地址突显出描述的对象. -- == REST ...
- Codeforces.GYM100548G.The Problem to Slow Down You(回文树)
题目链接 \(Description\) 给定两个串\(S,T\),求两个串有多少对相同回文子串. \(|S|,|T|\leq 2\times 10^5\). \(Solution\) 好菜啊QAQ ...
- [CC-MCO16306]Fluffy and Alternating Subsequence
[CC-MCO16306]Fluffy and Alternating Subsequence 题目大意: 给定一个\(1\sim n(n\le3\times10^5)\)的排列\(a\). 对于一个 ...
- git 命令的使用
hello git 穿越时空 修改一条数据 git status 查看是否修改 git diff file1 如何修改的 git add file1 git commit -m "提交的信息 ...
- jenkins部署node项目
docker run -d --name jenkins -p 8081:8080 -v /home/jenkins_home:/home/jenkins_home jenkins
- Ural2110 : Remove or Maximize
设最大的数为$w$,若$n>k+\log w$,那么显然所有$1$都可以保留,否则现在$n\leq k+\log w$. 如果$w\leq 100000$,那么可以DP,设$f[i][j]$表示 ...
- 修改Chrome启动参数解决跨域问题
这个做法仅仅是针对自己本机,只是一个权宜方案 --disable-web-security --user-data-dir=本地用户信息目录 之后启动Chrome浏览器即可
- mongodb 索引,全文索引与唯一索引
唯一索引创建: db.createIndex({name: 1}, {unique: true})
- NodeJS 连接接MySQL
NodeJS 连接接MySQL MySQL是常用数据库,作为后端模块,nodejs可以提供了mysql接口 安装 $ npm install mysql 测试代码 var mysql = requir ...