一つのドメインでwordpressとnode.jsの両立

Question

###前提・実現したいこと
azureにVM１とVM２を立てています。
VM２ティザーサイト(wordpress)にhttps://example.com
VM１にあるアプリケーションサイト(node.js)にhttps://exmaple.com/app/*
といったことをしたいです。
VM１にパブリックIPがあり、nginxにhttps://example.comドメインが割り当ててある。
VM１とVM２はローカルネットで繋がっている。

https://example.com → 10.0.0.4
https://example.com/app → public IP :8080 (http用ポート)

###発生している問題・エラーメッセージ
nginxを使って、振り分けたい
そのために下記２点の方法を考えているがやり方が見つからない。
①node.jsのapp分の階層は入れて開発してこなかったため、なるべくコードの各箇所を修正せずにhttps://exmaple.com/app/*で接続できるようにしたいが、app分の階層を入れる方法がわからない。（node.jsはExpress,socket.io,ejsなどを使っている）
②etc/nginx.confをいじるものの、入り口だけWordPress側とnode.jsアプリに振り分けられるが、そこから奥になると、node.jsの/app/部分がないURLになってしまうため、ページエラーになってしまう。

エラーメッセージ
②ででてくるエラーは(ログインボタンを押すと)
The requested URL /login/ was not found on this server.

###補足情報(言語/FW/ツール等のバージョンなど)
より詳細な情報
簡単に言うと下記URLのようなことをWordpressとnodejsでやりたくて、
/の方はいいが、/appの方うまくいかないです。入り口のみでその先が続かない。
http://d.hatena.ne.jp/sasaplus1/20130207/1360246070

とても困っています。なんでもいいのでヒントをください。

Comments

[kei344]

例示用ドメインはご自身で所有されていない限りexample.comを利用してください。

Answer 1

入り口が表示されているということは、 proxy_pass はうまくいってると思われます。ただし、 node.js が生成する HTML で自サーバ内のコンテンツを絶対パスで参照している部分があると、うまく動きません。/login/ はページの中に絶対パスで書かれているではないでしょうか。<a href="/login/"> などと書かれていると not found になってしまいます。 css や ｊｓ の参照も全て同様です。

絶対パスの参照があるものが洗い出せれば、 HTML 内の文字列を正規表現マッチングして書き換えることで対応できそうです。ググってみると、以下の2つの方法が見つかりました。

参考１：nginx_luaでhtmlを書き換えたい！のまき
参考２：nginxでhtmlの中身書き換えるプロキシサーバー立てる(OSXの上に)

この方法のいずれかで /login/ を ./login/ とかに書き換えます。書き換えなければ行けないパスの洗い出しと意図しない書き換えをしてしまわないかのチェックが大変だと思います。単純に /login/ とかでマッチすると、動的コンテンツ内に /login/ があると書き換わってしまいます。

node.js の修正ができるなら、 node.js 側を相対パスで参照するように修正するほうが早いと思います。