Chrome 扩展在后台发出的请求如何携带前台 cookie?

我用 Chrome 扩展程序从 https://www.pixiv.net/artworks/84085174 下载一张图片,图片是跨域的。https://i.pximg.net/img-original/img/2020/09/01/16/22/11/84085174_p0.png

前台直接请求会被跨域策略阻止,我在后台脚本 background.js 里可以请求,但是 403,因为需要携带 cookie。不知道怎么解决。

后台网址是 chrome 扩展的网址:
chrome-extension://penkncbihcdfkhngfonjppnnkhodlali/_generated_background_page.html
fetch 或 xhr,虽然它们可以发送 cookie,但因为是在后台页面执行的,无法携带前台页面的 cookie。而且它们都不支持在请求头里设置自定义 cookie,我就算获取了前台的 cookie 也发送不出去,一筹莫展,不知道该怎么办。

阅读 289
评论
    3 个回答
    • 1.3k

    这个与chrome关系不大,相信在其它浏览器比如firefox中也会发生相同的错误。根源在于浏览器的保护策咯上了。在发生CORS请求时,为了保证该请求是被跨域的地址所允许的(www.pixiv.net),所以浏览器会发起options请求(这个请求被最新版本的chrome隐藏了,firefox中可以查看到),只有接收值中的Access-Control-Allow-Origin与前台用户访问的地址相匹配时,浏览器才可能允许发起后续的跨域请求。

    这也是为什么你的控制台报:has been blocked by cors policy: No Access-Control-Allow-Origin header is .... 的原因。

    所以如果www.pixiv.net这个站点也是你负责的,那么添加允许跨域信息,当浏览器发起特定的options请求时,在header中返回Access-Control-Allow-Origin属性,并在其值中包含用户访问的当前站点(也可以使用通配符 * )。

    当然了,即使是有了Access-Control-Allow-Origin,默认情况下cookie属于敏感信息,这个值也是默认被禁止发送给跨域地址的。这个小孩没娘说起来话长,具体怎么做怕是你还得辛苦自己查一下。

    祝好运。

    参考资源:详解CORS

      相似问题
      推荐文章