質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Vue CLI

Vue CLIは、Vue.jsでアプリケーション開発を行うためのコマンドラインインタフェース(CLI)に基づいた開発ツールです。インタラクティブなプロジェクトの雛形や設定なしで使用できるプロトタイプの作成など、さまざまな機能が用意されています。

Laravel

LaravelとはTaylor Otwellによって開発された、オープンソースなPHPフレームワークです。Laravelはシンプルで表現的なシンタックスを持ち合わせており、ウェブアプリケーション開発の手助けをしてくれます。

nginx

nginixは軽量で高性能なwebサーバーの1つです。BSD-likeライセンスのもとリリースされており、あわせてHTTPサーバ、リバースプロキシ、メールプロキシの機能も備えています。MacOSX、Windows、Linux、上で動作します。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

Q&A

0回答

1343閲覧

nginx+php-fpmでlaravel+vue-cliのアプリケーションからくるHTTPリクエストを処理したい

Testhoge

総合スコア10

Vue CLI

Vue CLIは、Vue.jsでアプリケーション開発を行うためのコマンドラインインタフェース(CLI)に基づいた開発ツールです。インタラクティブなプロジェクトの雛形や設定なしで使用できるプロトタイプの作成など、さまざまな機能が用意されています。

Laravel

LaravelとはTaylor Otwellによって開発された、オープンソースなPHPフレームワークです。Laravelはシンプルで表現的なシンタックスを持ち合わせており、ウェブアプリケーション開発の手助けをしてくれます。

nginx

nginixは軽量で高性能なwebサーバーの1つです。BSD-likeライセンスのもとリリースされており、あわせてHTTPサーバ、リバースプロキシ、メールプロキシの機能も備えています。MacOSX、Windows、Linux、上で動作します。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

0グッド

0クリップ

投稿2021/04/05 13:59

編集2022/01/12 10:55

ubuntu上でnginxとphp-fpm7.4を用いてlaravelとフロントエンドにvue.jsを用いたアプリケーションを作ろうと思ってるのですが、HTTPリクエストがlaravelのコントローラーに届いてないみたいでほとほと困っております。
nginxもphp-fpmも全く初心者でしてどうすればリクエストがコントローラーに届くのか分かっておりません。

デプロイする前のlocalhostの環境では
php artisan serveで動いてる組み込みサーバ上で
"GET /api/csrf-cookie HTTP/1.1"
で、csrf-tokenが返ってきたのですが公開した環境ではただHTTP 204だけが返ってきます。

どなたかどうかご教示いただけないでしょうか。よろしくおねがいします。
下記に自分のnginxの設定を記載いたします。

#/etc/nginx/sites-available/example.confの内容です server { listen 8000; index index.php index.html; server_name example.com www.example.com; # CORS start add_header Access-Control-Allow-Origin null; add_header Access-Control-Allow-Methods "POST, GET, OPTIONS"; add_header Access-Control-Allow-Headers "Origin, Authorization, Accept"; add_header Access-Control-Allow-Credentials true; # CORS end #add_header X-Frame-Options "SAMEORIGIN"; #add_header X-XSS-Protection "1; mode=block"; #add_header X-Content-Type-Options "nosniff"; location / { try_files $uri $uri/ /index.php?$query_string; root /var/www/laravel-project/vue_front_end/dist; } location ~ .php$ { try_files $uri =404; fastcgi_split_path_info ^(.+.php)(/.+)$; fastcgi_pass unix:/var/run/php/php7.4-fpm.sock; fastcgi_index index.php; include fastcgi_params; fastcgi_intercept_errors on; add_header Access-Control-Allow-Origin '*'; add_header Access-Control-Allow-Methods 'GET, POST, PUT, DELETE'; add_header Access-Control-Allow-Headers 'Origin, Authorization, Accept, Content-Type'; add_header Access-Control-Max-Age 3600; add_header Content-Type 'text/plain charset=UTF-8'; add_header Content-Length 0; return 204; } } コード

また、curl -i 'http://www.example.com:8000/'を公開したubuntu上で打ってみたところ
vueで記述したファイルは公開できているみたいです。

php-fpmはインストール済みです。

どうかわかる方いらしましたらよろしくお願いいたします。

=追記=
すいません。fpmとnginxのログを追記します。

#/var/log/php7.4-fpm.log.1 [29-Mar-2021 00:46:57] NOTICE: fpm is running, pid 77741 [29-Mar-2021 00:46:57] NOTICE: ready to handle connections [29-Mar-2021 00:46:57] NOTICE: systemd monitor interval set to 10000ms [29-Mar-2021 00:46:57] NOTICE: Terminating ... [29-Mar-2021 00:46:57] NOTICE: exiting, bye-bye! [29-Mar-2021 00:46:57] NOTICE: fpm is running, pid 77837 [29-Mar-2021 00:46:57] NOTICE: ready to handle connections [29-Mar-2021 00:46:57] NOTICE: systemd monitor interval set to 10000ms
#/var/log/nginx/error.log.1 #修正済 2021/04/05 14:39:50 [emerg] 171536#171536: "fastcgi_pass" directive is duplicate in /etc/nginx/sites-enabled/example.conf:30
#/var/log/nginx/access.log.1 127.0.0.1 - - [05/Apr/2021:08:47:04 +0000] "GET /api/csrf-cookie HTTP/1.1" 204 0 "-" "curl/7.68.0" my_remote_address - - [05/Apr/2021:08:47:26 +0000] "GET /api/csrf-cookie HTTP/1.1" 204 0 "-" "curl/7.68.0" my_remote_address - - [05/Apr/2021:08:47:36 +0000] "GET /api/csrf-cookie HTTP/1.1" 204 0 "-" "curl/7.68.0" my_remote_address - - [05/Apr/2021:08:47:50 +0000] "GET /api/csrf-cookie HTTP/1.1" 204 0 "-" "curl/7.68.0" my_remote_address - - [05/Apr/2021:08:50:31 +0000] "GET /api/csrf-cookie HTTP/1.1" 204 0 "-" "curl/7.68.0" my_address - - [05/Apr/2021:08:50:44 +0000] "GET /api/csrf-cookie HTTP/1.1" 204 0 "-" "curl/7.68.0"

ローカルの組み込みサーバでの状況とnginx環境の比較を追記します。
色々抜けていてすいません。

#ローカル環境(上手くいった)でのリクエスト penguin@ubuntu ~> curl -i 'localhost:8000/api/csrf-cookie' HTTP/1.1 204 No Content Host: localhost:8000 Date: Tue, 06 Apr 2021 05:38:57 GMT Connection: close X-Powered-By: PHP/7.4.3 Cache-Control: no-cache, private Date: Tue, 06 Apr 2021 05:38:57 GMT Set-Cookie: XSRF-TOKEN=eyJpdiI6IjFiWEt2SHkxUWpQMC9pZVU2MzA2WWc9PSIsInZhbHVlIjoib2J3WFZuSHBUUjA1Nkc3YTZ2czRKYnlnTmFrKzJUa2NxYU9zcmZ5dStzMm5VYk5zZnFGaGJnbnRTTFBZRHhLNHJDQlJXdG5hMEF0T3g1RmMybjVGWHAwZVdQcno5RDJMUVJaYU1vTHV1a1lXS2p6WlhLTk82UW9aVFlhUWNoUE4iLCJtYWMiOiI3MDUzYTI0YTJjNDJiNTUyZTQxZTRhMmRhMzg2NTQwNDFiYjk2ZDk5MDU0YWNlMWQ4YzU0OTQ1NTI4NWYyYzU5In0%3D; expires=Tue, 06-Apr-2021 07:38:57 GMT; Max-Age=7200; path=/; domain=localhost; samesite=lax Set-Cookie: laravel_session=eyJpdiI6ImpCOUhxa2N1bFZYcnZ0Rnc2bXk0SVE9PSIsInZhbHVlIjoiczRoWmMyS3pYM1VnS05hL3NMdnFjMmY1b2V0UE12cGZDUUhmMzhxRG9uK095SkM5amJOaTJrVlJoWCs4cHVWM051VmNxSFdRZHBoT3JzelNlb1EvTVBBZXlsVHdES1VhSWsyZmlnVGgvQUhBNFZHNFlMQmZqeDF1MVVQWk5abHEiLCJtYWMiOiIxZDMzN2EwNDEzMjY2ZGJjODQ0MDllYTFiMTFiMTNkNGU2ZWEzOTljZTUwMDFkMjY3OWVlMDNjYWFhMDQ0MThkIn0%3D; expires=Tue, 06-Apr-2021 07:38:57 GMT; Max-Age=7200; path=/; domain=localhost; httponly; samesite=lax Set-Cookie: 5cg4jvkegDs0XvO9qFOHLa4jrPfnZoLZs9imh1uV=eyJpdiI6ImVTeUQ2bFRuUXJSbEF0cHQxLzFVVGc9PSIsInZhbHVlIjoidDVxK1UzT2ttVTB6d1R4MVZFTGlta3dRZ0tIdC8vc1BvWms5cDBGQThPaWxJK2VhSFovTTV4RXlqcTVDZ2Q4YlptNzl0SGU2bExybmlPUzk5dlJ3dTJWOHpJb1NvNzlGbG5idVJTMGRDWVhOdTVkRlJGeXB6Rnh2NDVMOWlqRXNLU09nVGd0VWkvYjNmM0Z5QnBXWWpEVVJBanJTNzlQMWJoTnpMbHVzcnBPNmFLTFlrRFNXMUdJb0dicm00Y2g5ODY3TlZmYlIrRXJXek4xbyt6aDcwWEM4L2ErSVIxQVpuUnFrZXhLKzRFYTFJRlZpYWRxa2dTWEtISmRMTVJCcUc2SzlNazkyMmcyT0lLVHQxd2ZYdGoxZ2ZSZTNZU09pSGZNa3dZZlRObVU5azRPcHRYcHlFL2xBbkxKK1dPeVNvaGVxdGYzZXRPSGhmdXFJYnJzbDV6WjZpS0xkajRmQlhmTGkwTUdIblZwazdNb3Y0Z1RNOFhjNjNqZ1haS0JLaXBSQ2k4UHI1Ty9qZG9Ga1NmRWRVUT09IiwibWFjIjoiNTMzYzg4ODA1ZDJjYWJjZTJhMzhhMzIwNmViNDljM2YwMDdhNmRjYmZiZDgyNWI3NGUzMThmNTYyNjcxMzcwZSJ9; expires=Tue, 06-Apr-2021 07:38:57 GMT; Max-Age=7200; path=/; domain=localhost; httponly; samesite=lax #nginx環境でのリクエスト penguin@ubuntu-s-testapp /e/n/sites-available> curl -i 'http://example.com:8000/api/csrf-cookie' HTTP/1.1 204 No Content Server: nginx/1.18.0 (Ubuntu) Date: Tue, 06 Apr 2021 05:45:37 GMT Connection: keep-alive Access-Control-Allow-Origin: * Access-Control-Allow-Methods: GET, POST, PUT, DELETE Access-Control-Allow-Headers: Origin, Authorization, Accept, Content-Type Access-Control-Max-Age: 3600 Content-Type: text/plain charset=UTF-8 Content-Length: 0

ご指摘頂いた情報を追記いたします。
portの状況とufw(ubuntu fire wall)の状態です。
firewallは現在のところ稼働させておりません(セキュリティ的には良くないのですが)

#ufwの確認 sudo ufw status [sudo] password for penguin: Status: inactive #portの状況 sudo lsof | grep "8000" nginx 179409 root 6u IPv4 1121029 0t0 TCP *:8000 (LISTEN) nginx 179410 www-data 6u IPv4 1121029 0t0 TCP *:8000 (LISTEN)

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

CHERRY

2021/04/05 21:17

まずは、nginx のログを確認しましょう。 その次は、php-fpm のログを確認しましょう。
Testhoge

2021/04/06 02:46

すいません。ありがとうございます。 nginxのログとphp-fpmのログを確認したのですがあまりエラーが出ていない?みたいです。 やはりphpの処理系に届いていないのでしょうか。
AbeTakashi

2021/04/06 06:05

8000番のポートは開いてますか? ubuntuならデフォルトでufw(Uncomplicated FireWall)が起動していた気もします。sudo ufw statusしたら確認できますがどうでしょう。開いていたとしてもその情報は記載しておいた方が良いと思います。
Testhoge

2021/04/06 06:23

ご指摘ありがとうございます! 色々抜けた所があり申し訳ないです。 firewallとportの状況を追記いたします。
AbeTakashi

2021/04/07 02:15

たしかにhttpで204を返しているからポートは開いてましたね。気づけず申し訳ありませんでした。nginxは問題なさそうですし、そうなるとphp-fpmが怪しいですね。nginxの設定の return 204; ってありますが、こちらはどういう意味なんでしょう。あまり見たことないのですが、削除したらどうなりますかね?
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問