chrome 扩展解决 前台跨域问题

后台可以修改网络请求，使用 chrome.webRequest.onHeadersReceived API，给每个请求的 response headers 都添加 Access-Control-Allow-Origin : *，那么前台发出的所有请求都可以跨域。（如果此请求本来就有这个标头，就先删掉然后添加）

先在 manifest.json 里申请权限：

permissions": ["webRequest", "webRequestBlocking", "*://*/*" ]

然后在后台代码（background.js）里修改网络请求：

function removeMatchingHeaders(headers: any, regex: any) {
  for (var i = 0, header; (header = headers[i]); i++) {
    if (header.name.match(regex)) {
      headers.splice(i, 1);
      console.log('Removing header "' + header.name + '":"' + header.value + '"');
      return;
    }
  }
}

function responseListener(details: any) {

  removeMatchingHeaders(details.responseHeaders, /access-control-allow-origin/i);
  details.responseHeaders.push({ name: 'Access-Control-Allow-Origin', value: '*' });

  return { responseHeaders: details.responseHeaders };
}

chrome.webRequest.onHeadersReceived.addListener(responseListener, {
  urls: ['*://*/*']
}, [
  'blocking',
  'responseHeaders',
  'extraHeaders'
]);

可以根据自己需要把网址范围 😕//* 修改一下，避免影响所有网络请求。