RequireJSテキストプラグイン：他のドメインからHTMLを読み込むことができません。

Question

require.jsで別のドメインからhtmlを取得したいと思います。私はCORSの方針でこれを簡単に認めていないことを知っています。注：Webサーバー（Access-Control-Allow-Origin "*"と他のディレクティブ）とrequire.jsを設定して、JSとCSSファイル（CSSはrequire-cssプラグイン）を他のドメインから期待どおりに読み込むように設定しました。しかし、ブラウザのネットワークプロトコルでは、HTMLコンテンツが読み込まれることさえわかります。しかし、このコンテンツはrequire関数に渡されません！ブラウザがコンテンツを取得しますが、require.jsは...、それをパラメータとして提供していません

マイ設定：

requirejs.config({ 
    baseUrl: "http://some.other.domain/", 
    paths: { 
     jquery:  'ext/jquery/jquery.min', 
     htmlTemplate: 'test.html?', 
     siteCss:  '../css/site' 
    }, 
    shim: { 
     htmlTemplate: [ 
      'css!siteCss' 
     ] 
    }, 

    config: { 
     text: {     
      useXhr: function (url, protocol, hostname, port) { 
       return true; 
      } 
     } 
    }, 
    map: { 
     '*': { 
      text: 'ext/require/text', 
      css: 'ext/require/css.min' 
     } 
    } 
}); 


require(['text!htmlTemplate'], function (htmlTemplate) { 
    console.log(htmlTemplate); // prints 'undefined' into the console 
}); 

2つのノート：useXhr設定がrequire.js text plugin adds “.js” to the file nameから取られているが、それは違いはありませんそれが存在するかどうか。 htmlTemplateパスに?を追加しました。これにより、.jsはURLに追加されず、ブラウザはhtmlコンテンツを読み込みます。残念ながら、残念ながらrequire.jsはパラメータhtmlTemplateに渡しています。

どうすればよいですか？私がrequire.js optimizerを使用すると、生成されたファイルにこの問題はもうなくなります（しかし、それはうまくいきます...）。しかし、すべての編集で最適化をせずにJSを開発する必要があります。

更新：1つの解決策が見つかりましたが、誰かが「正しい」解決策を提供できれば嬉しいです。

Answer 1

私は実際の問題を発見しました！この部分：

config: { 
    text: {     
     useXhr: function (url, protocol, hostname, port) { 
      return true; 
     } 
    } 
}, 

実際に行う必要があります。しかし、私はそれが全く呼ばれていないことを知りました。代わりに、デフォルトの実装が呼び出されました。そして、これは虚偽を返しました。

マッピングを評価していないように見えるので、設定セクションに正しいキーが必要です。

だから、これは他のドメインからHTMLを取得し、右の設定です：

requirejs.config({ 
    baseUrl: "http://some.other.domain/", 
    paths: { 
     jquery:  'ext/jquery/jquery.min', 
     htmlTemplate: 'test.html', //      // ---> removed the '?' 
     siteCss:  '../css/site' 
    }, 
    shim: { 
     htmlTemplate: [ 
      'css!siteCss' 
     ] 
    }, 

    config: { 
     'ext/require/text': {        // ---> full path is required!!!    
      useXhr: function (url, protocol, hostname, port) { 
       return true; 
      } 
     } 
    }, 
    map: { 
     '*': { 
      text: 'ext/require/text', 
      css: 'ext/require/css.min' 
     } 
    } 
}); 


require(['text!htmlTemplate'], function (htmlTemplate) { 
    console.log(htmlTemplate); // now prints HTML into the console!!! 
}); 

ハレルヤ！

正しいヒントを見つけたhereもう1つの選択肢は、テキストのパスを設定することです。関数が呼び出されるように、少なくとも設定を何らかの方法で設定する必要があります。

Answer 2

私は解決策を見つけたと思います。 Doc of requirejs/text：

テキストプラグインはリソースの要求が別のドメイン上にあると判断したのであれば、それはスクリプトタグを使用してリソースの「の.js」バージョンにアクセスしようとします。スクリプトタグGET要求はドメイン間で許可されています。 .jsバージョンのリソースは、モジュールの値の文字列を返すdefine（）呼び出しを含むスクリプトでなければなりません。そのための

私はこれに設定を変更し、そのテキストはもはや使用されていません。

requirejs.config({ 
    baseUrl: "http://some.other.domain/", 
    paths: { 
     jquery:  'ext/jquery/jquery.min', 
     htmlTemplate: 'test.html', // removed the '?' 
     siteCss:  '../css/site' 
    }, 
    shim: { 
     htmlTemplate: [ 
      'css!siteCss' 
     ] 
    }, 
    map:  { 
     '*': { 
      // removed the text plugin 
      css: 'ext/require/css.min' 
     } 
    } 
    // removed the useXhr configuration for the text plugin 
}); 


require(['htmlTemplate'], function (htmlTemplate) { 
    console.log(htmlTemplate); // prints '<div>Here I am!</div>' into the console 
}); 

今http://some.other.domain/test.html.jsがロードされます。 test.htmlの内容は次のとおりです。

define(function() { 
    return '<div>Here I am!</div>'; 
}); 

私は少しJSでHTMLを囲みました。問題はありません。そして今度はhtmlTemplateが予想される文字列に設定されます。これはもはや純粋なHTMLではありませんが、固定テンプレート（つまり、生成されていない）なので、受け入れられるかもしれません。

Answer 3

「Access-Control-Allow-Origin」ヘッダーが要求されたリソースに存在しません。コードを追加した後

config: { 
     'ext/re`enter code here`quire/text': {        required!!!    
      useXhr: function (url, protocol, hostname, port) { 
       return true; 
      } 
     } 
    },