在域 URL 中使用多个部分在 iFrame 中设置基本标记

Question

我正在开发 Angular 应用程序。我有一个 iFrame 并设置其包含相关链接的 innerHTML，所以我决定在 head 标签中附加 base 标签我的iFrame，我在script/controller中写的代码如下：

$scope.content = $scope.selectedSitePage.html.value; 
var baseTag = document.createElement('base');
var prependURL = "http://232.17.43.22/sharepoint.xyz.net/";
baseTag.href = prependURL ;
$('#frameContent').contents().find('head').append(baseTag);

在HTML:

<iframe id="frameContent" frame-content="content"></iframe>

frameContent 是我做的指令：

.directive('frameContent', function () {
return { scope: { "content":"=content" },
link: function link(scope, element) { 
element.get(0).contentWindow.document.body.innerHTML = scope.content; } } 
});

ISSUE: 是这样的，如果我在 img src 中有一个亲戚 URL '/_layout/abc.png'，它没有出现，因为请求是'http://232.17.43.22/_layout/abc.png' but it has to be 'http://232.17.43.22/sharepoint.xyz.net/_layout/abc.png'

那么我的问题，我怎样才能避免在第一个斜线之后对 base href 进行切片？

Answer 1

删除相对路径中的初始正斜杠即可解决问题

<img src='_layout/abc.png' alt='an image text' />

阅读更多：Starting with a forward slash in html for "href"

使用 link/href 的简单示例虽然工作相同。

如果将鼠标悬停在链接上并检查 url 地址，您会发现不同之处。

<html>
 <head>
  <base href='http://232.17.43.22/sharepoint.xyz.net/' />
 </head>
<body>
  
<a href='_layout/abc.png'>Relative path with no "/"</a><br /><br />
  
<a href='/_layout/abc.png'>Absolute path with "/"</a>
  
</body>  
</html>

在域 URL 中使用多个部分在 iFrame 中设置基本标记

Set base tag in iFrame with several parts in domain URL

javascript

jquery

html

iframe

base