0

拡張機能ページ内のiframe内にWebサービスからのUIを独自のものとして表示するChrome拡張機能があります。以下を使用して、いくつかのコンテンツスクリプトをリモートUIに挿入しています。

"content_scripts": [
  {
    "matches" : [ "https://mywebservice.com/frontend/*" ] ,
    "js" : [ "frontend-page-contentscript.js" ],
    "all_frames" : true
  }
]

これは（manifest.jsonでも）次の理由で許可されています：[編集：これは、iframeでコンテンツスクリプトを実行するために必要ではないことがわかりました-しかし、それを削除しても、AJAXは期待どおりに機能しません]。

"sandbox" : {
  "pages" : [
    "cocoon_page_proxy.html"
  ]
}

ただし、（コンテンツスクリプトからではなく、iframeから）簡単なajax呼び出しを行うと：

$.get('asdf',function success(data) { console.log("Success"); },
             function error(xhr) { console.log("Error: "+xhr.responseText); });

応答がありません。ストールしてステータスが「0」になります。これは（私の経験では）通常、クロスオリジンパーミッションの問題が原因ですが、そうではないはずです-メインページが由来する同じサーバーから別のリソースを要求しています。

提案？

4

3 に答える 3

0

私が正しく理解していて、フレームにURLをロードし、そこからリモートページのコンテンツをXHRしようとしていると仮定すると、そのドメインのクロスオリジン権限chrome-extension://をリクエストする必要があります。

于 2012-10-04T10:56:49.967 に答える
0

ため息-それは私の拡張機能の他の場所、webrequestリダイレクトコードに起因するバグであることが判明しました。

于 2012-10-04T16:43:20.490 に答える
0

そのため、ChromeのwebRequestAPIを使用してクロスドメインajaxを実際に強制することができます。httpヘッダーをAccess-Control-Allow-OriginHeadersReceivedに追加するだけです。

chrome.webRequest.onHeadersReceived.addListener(function onHeadersReceived(resp) {
  resp.responseHeaders.forEach(function forEachHeader(header, index) {
    if(header.name.toLowerCase() === "access-control-allow-origin") {
      resp.responseHeaders[index].value = "*";
    }
  });
  resp.responseHeaders[resp.responseHeaders.length] = {
    "name":"Access-Control-Allow-Origin",
    "value":"*"
  };
  return {responseHeaders: resp.responseHeaders};
}, {
  urls: [
  //chrome-extension://jkafskjifsf/cocoon_page_proxy.html
    chrome.extension.getURL('') + 'cocoon_page_proxy.html',
   '*://your.api.endpoint.domain.com/*'
  ] ,
  types: [
    'sub_frame'
  ]
}, ['blocking', 'responseHeaders']);

それをバックグラウンドページに追加してみてください。バックグラウンドページがない場合は、これをmanifest.jsonに追加して、関連するファイルを作成します。

"background": {
  "scripts": [ "background.js" ]
}

permissionsまた、manifest.jsonファイルの既存のリストにこれらのアイテムを追加する必要があります。

//"permissions": [
    "chrome-extension://<put_your_extension_id_here>/cocoon_page_proxy.html",
    "*://your.api.endpoint.domain.com/*",
    "webRequest",
    "webRequestBlocking"
//],

のようなURLについては、*://your.api.endpoint.domain.com/*ajaxリクエストを行うために必要なURLも追加します。

これがどのように機能するか、問題が発生した場合はコメントしてください。

于 2012-10-05T04:33:27.657 に答える