Question

我需要帮助来通过jwt从chrome扩展身份验证用户登录

这是我的清单文件

    {
  "manifest_version": 2,
  "name": "Time tracker",
  "description": "use this extension to send url and time to server",
  "author": "Ashkan Ganj",
  "version": "1.0",
  "browser_action": {
    "default_icon": "/icons/16.png",
    "default_title": "Time Tracker",
    "default_popup":"popup.html"
  },
  "permissions": [
    "tabs",
    "activeTab",
    "http://127.0.0.1:8000/*",
    "https://jsonplaceholder.typicode.com/posts",
    "storage",
    "http://*/", 
    "https://*/"

  ],
  "content_scripts": 
  [
      {
          "matches": ["http://127.0.0.1:8000/*","https://jsonplaceholder.typicode.com/posts"],  
          "js": ["packages/jquery-3.5.0.min.js","popup.js"]
      }
  ],

  "background": {
    "scripts": [
      "background.js","packages/jquery-3.5.0.min.js"
    ],
    "persistent": false
  }
}

和我的弹出式js发送登录信息，我的问题是：如何发送请求以及获取访问权限和刷新令牌并将其存储在会话存储中以便登录用户

$("#submitbtn").click(function (sendReq) {
  var email = $("#email").val();
  var password = $("#password").val();
  sessionStorage.setItem("userToken", "");
});
function sendReq() {
  let sendReq = (ev) => {
    let url = "/api/token";
    let h = new Headers();
    let req = new Request(url, {
      method: "POST",
      mode: "cors",
    });
    fetch(req)
      .then((resp) => resp.json())
      .then((data) => {
        console.log(data[0]);
      })
      .catch((err) => {
        console.error(err.message);
      });
  };
}

我获取令牌和刷新令牌的路径 api /令牌和 api /令牌/刷新 my rest framework get token pic

感谢您的帮助。

Answer 1

首先，使用background.js进行API调用，并将200响应作为消息在弹出窗口和背景之间传递，然后将popup发送给弹出窗口，然后将browserAction设置为成功登录后要显示的任何其他html。

chrome扩展名的登录用户

1 个答案: