Question

我想在我的Chrome扩展程序中使用swal作为漂亮的警报框。 swal必须在后台脚本中使用。我已经在manifest.json中的后台脚本属性以及web_accessible_resources中注入了swal代码，但是没有显示swal的警告框。为什么会这样？我在content_scripts中使用了css。

<p>
   <?php if ($product['model']) { ?>
      <?php echo $text_model; ?> <?php echo $product['model']; ?>
   <?php } ?>
</p>

我在background.js中使用swal而不是内容和弹出窗口。

更新

以下是在后台脚本中使用swal但不在内容脚本中的代码

"content_scripts": [
  {
    "matches": ["https://mail.google.com/*", "http://mail.google.com/*"],
    "js": ["extension/js/content.js"],
    "css": ["extension/css/main.css", "extension/css/swal.css"]
  }
],
"web_accessible_resources": ["extension/js/swal.js"],
"background": {
  "scripts": ["extension/js/swal.js", "extension/js/eventPage.js", "extension/js/background.js"],
  "persistent": true
},

内容脚本的代码。在这里，我修剪了代码，不显示用于显示工具提示的位置计算

var selectedTopic = null;
var token = null;
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
    switch (request.message) {
        case 'setTopic':
            window.selectedTopic = request.data;
            break;
        case 'topicCrm':
            savetopic(request.data, sendResponse);
            break;
        default:
            sendResponse({ data: 'Invalid' });
            break;
    }
});

function savetopic(topic) {
    const apiUrl = `${API_BASE}/check_topic/${selectedTopic}`;
    const headers = new Headers();
    headers.append('Content-Type', 'application/json');
    headers.append('Authorization', `Token: ${token}`);
    fetch(apiUrl, {
        method: 'GET',
        headers: headers
    })
        .then(function(response) {
            if (response.status === 401 || response.statusText === 'Unauthorized') {
                sendResponse({ response: 'error' });
            }
            return response.json();
        })
}

swal不会以chrome扩展名呈现

0 个答案: