拒绝帧＆＃x27;＆＃x27;因为它违反了以下内容安全策略指令：“ frame-src *＆quot”试图为电话设置：在此处阐明

发布于 2025-02-07 00:24:27 字数 2461 浏览 1 评论 0原文

我目前正在尝试在浏览器中以Outlook Addin的形式构建单击以拨号链接。我会遇到错误：

拒绝框架''，因为它违反了以下内容安全策略指令：“ frame-src *”。请注意，“*”仅与网络方案（'http'，'https'，'ws'，'wss'）或该方案匹配`felcs self seff'的方案的URL匹配URL。电话：必须明确添加。 [https：// localhost：44371/]

我已经设置了元标记，试图明确说明他们提到的TEL方案的不同方式。例如：

＆lt; meta http-equiv =“ content-security-policy” content =“ frame-src'self'tel：”＆gt;

我已经尝试了大约20种不同的变化。我还注意到，许多人在说一些有关更改HTTP响应标头的话题，但是我不确定如何做到这一点，甚至为什么需要它。

我正在使用自己的程序中的模板在Visual Studio上工作。因为我在自己的计算机上测试了这一点，所以我也试图将自己的本地主持人白白。仍然什么都没有。

这是HTML：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" />
    <meta http-equiv="Content-Security-Policy" content="frame-src 'self' tel:">
    <title>standard_item_properties</title>
    <script src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" media="all" href="default_entities.css" />
    <script type="text/javascript" src="MicrosoftAjax.js"></script>
    <script src="CallFunctionFile.js" type="text/javascript"></script>
    <!-- Use the CDN reference to Office.js. -->
    <script type="text/javascript" src="default_entities.js"></script>
</head>
<body>
    <!-- NOTE: The body is empty on purpose. Since this is invoked via a button, there is no UI to render. -->
    <div id="container">
        <div><a id="tel-link">Make Call from Phone</a></div>
    </div>
</body>
</html>

这是JavaScript：

// Global variables
let item;
let myEntities;

// The initialize function is required for all add-ins.
Office.initialize = function () {
    const mailbox = Office.context.mailbox;
    // Obtains the current item.
    item = mailbox.item;
    // Reads all instances of supported entities from the subject 
    // and body of the current item.
    myEntities = item.getEntities();
JSON.stringify(myEntities.phoneNumbers[0].originalPhoneString));
 
    // Checks for the DOM to load using the jQuery ready function.
    window.addEventListener('DOMContentLoaded', (event) => {
        // After the DOM is loaded, app-specific code can run.
    });
    let a = document.getElementById("tel-link");
    a.href = "tel:" + encodeURIComponent(myEntities.phoneNumbers[0].originalPhoneString);
}

原文

I'm currently trying to build a click to dial link in the browser as an Outlook Addin. I'm getting the error:

Refused to frame '' because it violates the following Content Security Policy directive: "frame-src *". Note that '*' matches only URLs with network schemes ('http', 'https', 'ws', 'wss'), or URLs whose scheme matches `self`'s scheme. tel:' must be added explicitely. [https://localhost:44371/]

I've set the meta tags a bunch of different ways trying to explicitly state the tel scheme that they mention. For instance:

<meta http-equiv="Content-Security-Policy" content="frame-src 'self' tel:">

I've tried about 20 different variations on this. I've also noticed that many people are saying something about changing the HTTP response headers, but I'm not sure exactly how to do this or even why it would be needed.

I'm working on Visual Studio using a template from their own program. Because I'm testing this out on my own computer, I've also tried to whitelist my own localhost. Still nothing.

Here is the html:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" />
    <meta http-equiv="Content-Security-Policy" content="frame-src 'self' tel:">
    <title>standard_item_properties</title>
    <script src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" media="all" href="default_entities.css" />
    <script type="text/javascript" src="MicrosoftAjax.js"></script>
    <script src="CallFunctionFile.js" type="text/javascript"></script>
    <!-- Use the CDN reference to Office.js. -->
    <script type="text/javascript" src="default_entities.js"></script>
</head>
<body>
    <!-- NOTE: The body is empty on purpose. Since this is invoked via a button, there is no UI to render. -->
    <div id="container">
        <div><a id="tel-link">Make Call from Phone</a></div>
    </div>
</body>
</html>

and here is the javascript:

// Global variables
let item;
let myEntities;

// The initialize function is required for all add-ins.
Office.initialize = function () {
    const mailbox = Office.context.mailbox;
    // Obtains the current item.
    item = mailbox.item;
    // Reads all instances of supported entities from the subject 
    // and body of the current item.
    myEntities = item.getEntities();
JSON.stringify(myEntities.phoneNumbers[0].originalPhoneString));
 
    // Checks for the DOM to load using the jQuery ready function.
    window.addEventListener('DOMContentLoaded', (event) => {
        // After the DOM is loaded, app-specific code can run.
    });
    let a = document.getElementById("tel-link");
    a.href = "tel:" + encodeURIComponent(myEntities.phoneNumbers[0].originalPhoneString);
}

分享到QQ

分享到微博