从React WebExtension访问Cookies API

Question

摘要

我正在尝试从使用React的WebExtension中访问Cookies API，但我不知道为什么，它抛出TypeException，就像browser.cookies不存在一样。

我已经检查了权限，并从MDN docs复制/粘贴了代码...但是仍然无法正常工作。

例外：

TypeError: browser.cookies is undefined 

代码

这是主要组成部分：

import React from 'react';
import ReactDOM from 'react-dom';

class Popup extends React.Component {
    constructor(props) {
        super(props);
        this.state = { sessionId: null };
    }

    componentDidMount() {
        var getting = browser.cookies.getAllCookieStores(); // This throws "TypeError: browser.cookies is undefined"
        getting.then(logStores);
    }

    render() {
        return (
            <div>
                <h1>My App</h1>
            </div>
        );
    }

    logStores(cookieStores) {
        for (let store of cookieStores) {
            console.log(`Cookie store: ${store.id}\n Tab IDs: ${store.tabIds}`);
        }
    }
}

ReactDOM.render(<Popup />, document.getElementById('app'));

这是manifest.json，具有相应的权限：

{
    "manifest_version": 2,
    "name": "MyApp",
    "version": "1.0",

    "browser_action": {
      "browser_style": true,
      "default_icon": {
        "48": "images/Watermelon-48.png",
        "96": "images/Watermelon-96.png"
      },
      "default_title": "MyApp",
      "default_popup": "popup.html"
    },

    "permissions": ["browser", "cookies","<all_urls>","tabs"]
  }

Answer 1

您可以替换

"permissions": ["browser", "cookies","<all_urls>","tabs"]

通过

"permissions": ["browserSettings", "cookies","<all_urls>","tabs"]