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

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

ただいまの
回答率

87.59%

Herokuでうまく機能が動かない

解決済

回答 1

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 833
退会済みユーザー

退会済みユーザー

前提・実現したいこと

Laravelのinterventionというライブラリを使用してオリジナルの元号を発表するコラ画像を作るアプリを練習で作っています。
ローカルでのコーディングは終わり、herokuにデプロイしたのですが、うまく合成画像が生成されず下記のようなエラーが返されています。
拙く見にくいコードになっているとは思いますが、よろしくお願いいたします。

実際に動かしているページはこちら(画像作成時にエラーが出ます)↓
http://mygengo.herokuapp.com/myGengoImages

発生している問題・エラーメッセージ

Failed to load resource: the server responded with a status of 500 (Internal Server Error)

該当のソースコード

MyGengoImagesController.php

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

use Intervention\Image\ImageManagerStatic as Image;
use App\myGengoImage;
use Carbon\Carbon;
use App\Http\Requests\CreateMyGengoImageRequest;

class MyGengoImagesController extends Controller
{
    public function index()
    {
        $myGengoImages = myGengoImage::latest()->paginate(10);

        return view('mygengo.index',[
            'myGengoImages' => $myGengoImages,
            ]);
    }

    public function create()
    {
        $myGengoImage = new myGengoImage;

        return view('mygengo.create',[
            'myGengoImage' => $myGengoImage,
            ]);
    }

    public function store(CreateMyGengoImageRequest $request)
    {
        $myGengoImage = new myGengoImage;

        $inToImg = $request->text;
        $createdImg = $this->change_per_strlen($inToImg);

        $filename = \Illuminate\Support\Str::random(40);
        $createdImg->save(public_path() . '/' . $filename . '.jpg');

        $myGengoImage->createdImg = '/' . $filename . '.jpg';
        $myGengoImage->save();

        return view('mygengo.complete',[
            'myGengoImage' => $myGengoImage,
            ]);
    }

    // 文字数を判定し、改行する
    // 文字数ごとにフォントの大きさを変える
    // 最大は四文字
    public function change_per_strlen($inToImg){
        $strlen = mb_strlen($inToImg);
        $backImg = public_path() . '/backimg.jpg';

        switch($strlen){
            case 1:
                $createdImg = Image::make($backImg)->text($inToImg, 355, 340, function($font) {
                    $font->file(public_path() . '/fonts/hkgokukaikk.ttf');
                    $font->size(200);
                    $font->align('center');
                    $font->color('#000000');
                    $font->angle(7);
                    });
                return $createdImg;
                break;
            case 2:
                $strarray = $this->vertical_writing(2,$inToImg);
                $createdImg = Image::make($backImg)->text($strarray, 360, 400, function($font) {
                    $font->file(public_path() . '/fonts/hkgokukaikk.ttf');
                    $font->size(130);
                    $font->align('center');
                    $font->color('#000000');
                    $font->angle(7);
                    });
                break;
            case 3:
                $strarray = $this->vertical_writing(3,$inToImg);
                $createdImg = Image::make($backImg)->text($strarray, 360, 385, function($font) {
                    $font->file(public_path() . '/fonts/hkgokukaikk.ttf');
                    $font->size(80);
                    $font->align('center');
                    $font->color('#000000');
                    $font->angle(7);
                    });
                break;
            case 4:
                $strarray = $this->vertical_writing(4,$inToImg);
                $createdImg = Image::make($backImg)->text($strarray, 355, 390, function($font) {
                    $font->file(public_path() . '/fonts/hkgokukaikk.ttf');
                    $font->size(60);
                    $font->align('center');
                    $font->color('#000000');
                    $font->angle(7);
                    });
                break;
        }
        return $createdImg;
    }

    public function vertical_writing($strlen,$inToImg,$break=PHP_EOL){
        $strarray = [];
        for($i=0; $i<$strlen; $i++){
            $strarray[] = mb_substr($inToImg,$i,1);
        }
        return implode($break,$strarray);
    }
}


index.blade.php

@extends('mygengo.layout')

@section('content')

    <div class="generator">
        <h2>新元号を作ってみよう!</h2>
        <p>フォントの都合で文字が出なかったらごめんね💛</p>

        <div class="img">
            <img src="/backimg.jpg" alt="">
        </div>

        <h3>〈元号を作成〉ボタンを押して作成してみよう!</h3>

        {!! link_to_route('myGengoImages.create','元号を作成') !!}
    </div>

    <div class="contents">
        <h3>最新の10件</h3>

            @if(count($myGengoImages) > 0)
                <ul>
                    @foreach($myGengoImages as $myGengoImage)
                        <li><img src="{{ $myGengoImage->createdImg }}" alt=""></li>
                    @endforeach
                </ul>
            @endif

        <h3>更新すると最新の元号をみることができるよ!</h3>
    </div>

@endsection


create.blade.php

@extends('mygengo.layout')

@section('content')

    <div class="generator-form">

        <h2>新元号を作ってみよう!</h2>
        <p>フォントの都合で文字が出なかったらごめんね💛</p>

        <div class="img">
            <img src="/backimg.jpg" alt="">
        </div>

        {!! Form::model($myGengoImage, ['route' => 'myGengoImages.store']) !!}

            {!! Form::label('text','新しい元号を入力') !!}
            {!! Form::text('text',null,['placeholder' => '4文字まで記入が可能です(全角のみ)','size' => '22','class' => 'form-input']) !!}

            @if (count($errors) > 0)
                <div>
                    @foreach ($errors->all() as $error)
                        {{ $error }}<br>
                    @endforeach
                </div>
            @endif

            {!! Form::submit('作成',['class' => 'form-button']) !!}

        {!! Form::close() !!}

    </div>

@endsection('content')


complete.blade.php

@extends('mygengo.layout')

@section('content')

    <div class="complete">
        <h2>新元号を作ってみよう!</h2>
        <p>フォントの都合で文字が出なかったらごめんね💛</p>

        <div class="img">
            <img src="{{ $myGengoImage->createdImg }}" alt="">
        </div>
        <p>オリジナルの元号ができました!</p>

        {!! link_to_route('myGengoImages.index','トップに戻る') !!}

    </div>

@endsection


web.php

Route::get('/', 'MyGengoImagesController@index');
Route::resource('myGengoImages', 'MyGengoImagesController');

試したこと

最初にトップページの画像が表示されなかったので、いろいろな方に聞いた結果、public直下で画像を表示するようにアドバイスをいただいたので(作った画像はだれでも見れるような仕様です)、同じように生成された画像はpublic直下で保存されるようにしています。

データベースの保存にもpublicの直下にパスが通るようにcontroller内で書いています。なお、ローカルではうまく動きました。

githubに最新のものを載せてます。
https://github.com/orangefarmar/mygengo

実際に動いた時の動き方を載せてる動画がありますのでこちらをご覧ください。
https://twitter.com/jdkfx/status/1114191349501194240

補足情報(FW/ツールのバージョンなど)

Laravel Framework 5.5.45
AWS cloud9を使用

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

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

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

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 1

check解決した方法

0

メンターさんに教えていただきながらS3を使って画像を保存するやり方に切り替えました。
参考:
https://qiita.com/fakefurcoronet/items/fe2861ca2846b7347418
https://qiita.com/nobu0717/items/51dfcecda90d3c5958b8
https://blog.hiroyuki90.com/articles/laravel-s3-image-upload-show-delete/

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

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

  • ただいまの回答率 87.59%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る