更新 1: サーバー側でクロス ドメイン アクセスを許可します。
更新 2: セキュリティを無効にして chrome を使用してアップロードしてみてください。
target
同じドメインの URL に設定されている場合、ngFlow を正常に使用しました。問題は、ファイアウォールのセットアップがあり、アップロードをブロックするファイアウォールによって画像が特定のパターンに一致するためにアップロードがランダムに失敗し、画像がサーバーに送信されないことです。奇妙なことは、エラーがクライアントに報告されないことです。アップロードが停止します。
ネットワーク管理者によると、ファイアウォールをバイパスするには、別のドメインである別の URL にアップロードを送信する必要があります。別のドメインの絶対 URLを設定するtarget
と、アップロード プロセスの実行時に Chrome で次のエラーが発生します。
XMLHttpRequest はhttps://blabla/PhotoUploadCmd?imageOperation=u …tjpg&flowFilename=Desert.jpg&flowRelativePath=Desert.jpg&flowTotalChunks=1 を読み込めません。プリフライト要求への応答がアクセス制御チェックに合格しません: 要求されたリソースに 'Access-Control-Allow-Origin' ヘッダーが存在しません。したがって、オリジン「http://10.100.22.111:8282」へのアクセスは許可されていません。
これは、ng-flow を構成するコード部分です。
app.config(['flowFactoryProvider', function (flowFactoryProvider) {
flowFactoryProvider.defaults = {
target : "/blabla/PhotoUploadCmd?imageOperation=upload",
//permanentErrors: [404, 500, 501],
permanentErrors : [ 500, 501 ],
maxChunkRetries: 1,
chunkRetryInterval: 5000,
simultaneousUploads: 4,
singleFile: true,
progressCallbacksInterval : 1,
withCredentials : true,
method : "octet",
forceChunkSize : true,
testChunks: false
};
flowFactoryProvider.on('catchAll', function (event) {
//console.log('catchAll', arguments);
});
}]);
ファイアウォールの問題は UAT マシンでのみ発生していることに注意してください。ローカルの Tomcat サーバーでアップロードをテストすると、問題なく動作します。
私も次のことを試しました:
- JSP に次のコード行を追加しましたが (これは内部フレームの一部として読み込まれます)、それでも同じエラーが発生します
No 'Access-Control-Allow-Origin' header is present on the requested resource
。
コード:
response.setHeader("Access-Control-Allow-Origin", request.getHeader("Origin"));
response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
response.setHeader("Access-Control-Max-Age", "3600");
response.setHeader("Access-Control-Allow-Headers", "x-requested-with");
- セキュリティを無効にしてクロムを開こうとしました:
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --disable-web-security --user-data-dir="C:\path-to-data-folder\Chrome"
上記の方法を使用すると、別のドメインにアップロードできましたが、Chrome で警告が表示されましたYou are using unsupported command-line flag...
。言うまでもなく、この方法は本番環境での使用には適していません。
ファイアウォールの問題を解決する方法、または ng-flow がアップロードを実行してクロスドメイン アクセスを許可する方法を知っている場合は、お知らせください。
タレク