2017-10-23 16 views
0

これは奇妙なシナリオですが、WebBrowser WinFormアプリケーションのコントロール内に角型アプリケーションを表示したいと考えています。Webブラウザーコントロール内の角型アプリケーションを参照してください

Angularアプリケーションはローカルでnpm run startまたはng serveで実行されていますが、これは私のシステム(Chrome、FF、Edge、IE)のすべてのブラウザで非常にうまく動作します。

WebBrowserコントロールを経由してサイト(http://localhost:4200/login)にアクセスすると、私は継続的に私が問題と角度ウェブサーバのアクセス可能性に関するいくつかのドキュメントを探してみた404

状態を取得しますが、見つけることができませんでした何でも私の推測では、サイトが何らかのnode.jsプロセス内で実行されており、WinFormアプリケーションがこれにアクセスすることができないか、Angularアプリケーションへの適切なルーティングを実行できませんが、この理論のソースは見つかりません。

私はこれをうまく動作させようとしているのだろうかと疑問に思うかもしれません。なぜなら、これはそうではないように見えるので、Navigated -eventが新しいAngularアプリケーションでまだ発生しているかどうか確認したいと思います。イベントはAngularJSアプリケーションでトリガされました。だから、それは単なるテスト/ポケットアプリケーションです。

脇役:WebBrowserコントロールは私たちが持っているAngularJSアプリケーション(ローカルでも動作しています)に接続できますが、これはIIS Express経由で実行されています。だから私はそれがWebサーバー/ルーティングの問題かもしれないと思った。

私がこれまで構築してきたことの詳細。

(フィドラーを介して捕捉)ウェブサーバ

> ng serve --watch --sourcemap=false 

** NG Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200 ** 
Date: 2017-10-23T14:43:54.585Z 
Hash: 54a4c907e66e478979a5 
Time: 26736ms 

要求を開始するForm1.Designer.cs

// All of the other WinForm stuff 
private System.Windows.Forms.WebBrowser v2Browser; 

のForm1.cs

public partial class Form1 : Form 
{ 
    public Form1() 
    { 
     InitializeComponent(); 
     v2Browser.Navigate("http://localhost:4200/login"); 
    } 

    private void V2BrowserNavigated(object sender, WebBrowserNavigatedEventArgs e) 
    { 
     System.Diagnostics.Trace.Write($"v2 has navigated to `{e.Url}`." + Environment.NewLine); 
    } 
} 

NGコマンド (フィドラー経由)

GET http://localhost:4200/login HTTP/1.1 
Accept: image/gif, image/jpeg, image/pjpeg, application/x-ms-application, application/xaml+xml, application/x-ms-xbap, */* 
Accept-Language: en-US,en;q=0.5 
Accept-Encoding: gzip, deflate 
User-Agent: Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.2; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729) 
If-None-Match: W/"654-dUFWfqPxZMcM1Ej8ZbZ0A8+KsiA" 
Host: localhost:4200 
Connection: Keep-Alive 

応答

HTTP/1.1 404 Not Found 
X-Powered-By: Express 
Access-Control-Allow-Origin: * 
Content-Security-Policy: default-src 'self' 
X-Content-Type-Options: nosniff 
Content-Type: text/html; charset=utf-8 
Content-Length: 144 
Date: Mon, 23 Oct 2017 14:44:51 GMT 
Connection: keep-alive 

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 
<title>Error</title> 
</head> 
<body> 
<pre>Cannot GET /login</pre> 
</body> 
</html> 

だから、それだけで404応答、私が受けてるエラーの多くはありません。

+0

通常、この種の状況では、iframeまたはweb broswerコントロールのブートストラップ角度アプリは苦痛です。自動的にブートストラップできない場合は、手動で実行するか、webpackビルドが動作していない場合はsystemjsビルドとconfugurationを使用できます。あなたが実際のエラーを投稿することができ、私が詳細に何かを提案することができるアプリをブートストラップしようとしている場合 –

答えて

0

私はng serve経由でホストされたアプリケーションにアクセスできなかったと考えて、ng buildでアプリケーションを構築し、新しいIIS Webサイトを出力フォルダに指定することにしました。

これは魔法のように機能するので、私の問題を解決しますが、私が探していたものではありません。

IISサイトで作業した後、私の問題の解決策はCLIの--hostパラメータを使用していることがわかりました。

ng serve --port 8080 --host 0.0.0.0 --disable-host-check 

は、ローカルサイトを実行し、あなたはlocalhostを使用しないことによってそれに接続できるようになります。私の問題を解決!

関連する問題