使iframe可编辑

Question

我正在使用angularjs作为我的应用程序。因为我将一个文本文件从url(ng-src)加载到iframe，并在iframe中显示内容。但是我想在加载到iframe的文本文件中做一些修改。这是我的HTML代码。

<div style="padding-left: 0px;" class="col-sm-5 text-center">
    <iframe id="content" ng-src="{{$scope.files.url}}" width="100%" height="400" align="middle"></iframe>
</div>

这是我的angularjs部分，文件来源。

    $scope.files = {

    1 : {
        "id" : 1,
        "name" : "0066030.txt",
        "url" : "http://demo/textFiles/0066030.txt"
    },

    2 : {
        "id" : 2,
        "name" : "0101907.txt",
        "url" : "http://demo/textFiles/0101907.txt"
    },
    3 : {
        "id" : 3,
        "name" : "0124757.txt",
        "url" : "http://demo/textFiles/0124757.txt"
    }
};

我正在成功地加载文本文件内容。谁能帮我把它编辑好吗。如果有其他HTML标记(例如: textarea，.)使用ng-src属性加载文本文件，也可以。

Answer 1

<iframe>元素的编辑受同一原产地政策限制。这是为了防止邪恶的网站用跨源内容欺骗用户。

对于可以不受限制地编辑的<iframe>元素：

<iframe src='about:blank'>
</iframe>

这意味着需要下载内容并使用DOM操作技术构建<iframe>元素。

同源政策 相同来源策略限制从一个来源加载的文档或脚本如何与另一个来源的资源交互。它是隔离潜在恶意文档的关键安全机制。 - MDN开发人员参考-相同的原产地政策 <iframe>属性

• src要嵌入的页面的URL。对符合同一-原产地策略的空页使用“关于:空白”。

</code></a></div><div></div>