Recommended dev stack

[squatto]

@osiset As you well know, I've been pounding my head against the wall with the non-SPA/cookie-free implementation. I'm thankfully early enough in my app build that I can pivot to a SPA. Given your experience with developing and releasing Shopify apps using this package, is there a dev stack that you would recommend? I'm leaning toward React with Inertia.

In fact, I'll pose the same question to everybody that uses this package: what dev stack did you use this with this package, and would you do it again if you could start over?

[restyler]

I am currently working on Shopify App with Inertia + Vue stack and I really like it so far. Planning my release on this week.

[restyler]

If anyone uses Inertia with cookieless: I've encountered the issue related to middleware order execution if verify.shopify middleware is used as route middleware and Inertia::share middleware (which was attaching auth()->user() prop for my Inertia pages) is used as web group middleware. Inertia sees null instead of auth()->user() because user object is resolved later via verify.shopify middleware. My solution was to move VerifyShopify mw into $middlewareGroups['web']' in Kernel.php above Inertia sharing mw, and remove it from web.php (let me know if you think this approach is suboptimal for some reason)

[squatto]

@restyler Thanks for the additional info! That's great to know about the middleware issues. I'll be refactoring things into react + inertia sooner than later, so this is going to save me some time for sure.

To handle losing flash data due to not having a session, I did something that worked quite well. All of my notices/errors are saved in a lang file and I pass the lang reference in the redirect query param as either notice or error:

/resources/lang/en/app.php

return [
    'errors' => [
        'select_valid_product_type' => 'Please select a valid product type',
    ],
];

Controller

return redirect()->appTokenRoute('app.products.create.index', [
    'error' => 'app.errors.select_valid_product_type',
]);

Then, in a service provider's boot() method I expand the lang reference into the full string and inject it into the current request's session:

/app/Providers/ShopifyAppServiceProvider.php

class ShopifyAppServiceProvider extends ServiceProvider
{
    public function boot(): void
    {
        // expand lang keys passed in the "notice" or "error" query params
        if (request()->has('notice')) {
            session()->now('notice', __(request('notice')));
        }

        if (request()->has('error')) {
            session()->now('error', __(request('error')));
        }
    }
}

I would think that you'd be able to adjust that process however necessary to shape the data in the session into what Inertia is expecting for errors/notices. That of course doesn't give you the data that you'd need for the form validations, which is why I think that your solution is likely a better approach, since it effectively leverages the built-in processes. I like your approach in that it creates a way to still leverage sessions without having cookies. Very clever!

[squatto]

On that topic, would you mind (and if it wouldn't be a pain) sharing your hacked StartSession middleware and axios interceptor? That would be a huge help and save my forehead from some wall bashing 😂 Thanks!

[restyler]

Hi @squatto !
Sorry for late response.

here is the mw file.
please note how I do setId() after $next() - this is something I didn't have time to investigate yet.

<?php

namespace App\Http\Middleware;

use Closure;
use Illuminate\Contracts\Session\Session;
use Illuminate\Http\Request;
use Illuminate\Routing\Route;
use Illuminate\Session\SessionManager;
use Illuminate\Support\Carbon;
use Illuminate\Support\Facades\Date;
use Symfony\Component\HttpFoundation\Response;

class StartHeaderSession
{
    /**
     * The session manager.
     *
     * @var \Illuminate\Session\SessionManager
     */
    protected $manager;

    /**
     * The callback that can resolve an instance of the cache factory.
     *
     * @var callable|null
     */
    protected $cacheFactoryResolver;

    /**
     * Create a new session middleware.
     *
     * @param  \Illuminate\Session\SessionManager  $manager
     * @param  callable|null  $cacheFactoryResolver
     * @return void
     */
    public function __construct(SessionManager $manager, callable $cacheFactoryResolver = null)
    {
        $this->manager = $manager;
        $this->cacheFactoryResolver = $cacheFactoryResolver;
    }

    /**
     * Handle an incoming request.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \Closure  $next
     * @return mixed
     */
    public function handle($request, Closure $next)
    {
        if (! $this->sessionConfigured()) {
            return $next($request);
        }

        $session = $this->getSession($request);

        if ($this->manager->shouldBlock() ||
            ($request->route() instanceof Route && $request->route()->locksFor())) {
            return $this->handleRequestWhileBlocking($request, $session, $next);
        }

        return $this->handleStatefulRequest($request, $session, $next);
    }

    /**
     * Handle the given request within session state.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \Illuminate\Contracts\Session\Session  $session
     * @param  \Closure  $next
     * @return mixed
     */
    protected function handleRequestWhileBlocking(Request $request, $session, Closure $next)
    {
        if (! $request->route() instanceof Route) {
            return;
        }

        $lockFor = $request->route() && $request->route()->locksFor()
                        ? $request->route()->locksFor()
                        : 10;

        $lock = $this->cache($this->manager->blockDriver())
                    ->lock('session:'.$session->getId(), $lockFor)
                    ->betweenBlockedAttemptsSleepFor(50);

        try {
            $lock->block(
                ! is_null($request->route()->waitsFor())
                        ? $request->route()->waitsFor()
                        : 10
            );

            return $this->handleStatefulRequest($request, $session, $next);
        } finally {
            optional($lock)->release();
        }
    }

    /**
     * Handle the given request within session state.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \Illuminate\Contracts\Session\Session  $session
     * @param  \Closure  $next
     * @return mixed
     */
    protected function handleStatefulRequest(Request $request, $session, Closure $next)
    {
        // If a session driver has been configured, we will need to start the session here
        // so that the data is ready for an application. Note that the Laravel sessions
        // do not make use of PHP "native" sessions in any way since they are crappy.
        //dump('s1', $session->getId());
        $request->setLaravelSession(
            $this->startSession($request, $session)
        );

        //dump('in handleStatefulRequest', $session->getId());
        //dump('in handleStatefulRequest2', $session->getId());
        $this->collectGarbage($session);

        //$request->session()->flash('success', 'Task was successful!');

        //dump('flash test', $request->session()->getId());
        //dump('flash test2', $request->session()->get('status'));
        $oldId = $request->session()->getId();

        // session id is regenerated in $next.. @TODO: investigate
        $response = $next($request);

        $session->setId($oldId);
        //dump('in handleStatefulRequest3', $session->getId());
        $this->storeCurrentUrl($request, $session);
        
        $this->addCookieToResponse($response, $session);

        // Again, if the session has been configured we will need to close out the session
        // so that the attributes may be persisted to some storage medium. We will also
        // add the session identifier cookie to the application response headers now.
        $this->saveSession($request);

        return $response;
    }

    /**
     * Start the session for the given request.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \Illuminate\Contracts\Session\Session  $session
     * @return \Illuminate\Contracts\Session\Session
     */
    protected function startSession(Request $request, $session)
    {
        return tap($session, function ($session) use ($request) {
            $session->setRequestOnHandler($request);

            $session->start();
        });
    }

    /**
     * Get the session implementation from the manager.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return \Illuminate\Contracts\Session\Session
     */
    public function getSession(Request $request)
    {
        
        return tap($this->manager->driver(), function ($session) use ($request) {
            if ($request->ajax()){
                //dump('in getSession', $session->getId());
                //dump($request->headers->all());
                //dd($request->headers->get($session->getName()));
            }
            
            $session->setId($request->headers->get($session->getName()));
        });
        /*return tap($this->manager->driver(), function ($session) use ($request) {
            $session->setId($request->cookies->get($session->getName()));
        });*/
    }

    /**
     * Remove the garbage from the session if necessary.
     *
     * @param  \Illuminate\Contracts\Session\Session  $session
     * @return void
     */
    protected function collectGarbage(Session $session)
    {
        $config = $this->manager->getSessionConfig();

        // Here we will see if this request hits the garbage collection lottery by hitting
        // the odds needed to perform garbage collection on any given request. If we do
        // hit it, we'll call this handler to let it delete all the expired sessions.
        if ($this->configHitsLottery($config)) {
            $session->getHandler()->gc($this->getSessionLifetimeInSeconds());
        }
    }

    /**
     * Determine if the configuration odds hit the lottery.
     *
     * @param  array  $config
     * @return bool
     */
    protected function configHitsLottery(array $config)
    {
        return random_int(1, $config['lottery'][1]) <= $config['lottery'][0];
    }

    /**
     * Store the current URL for the request if necessary.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \Illuminate\Contracts\Session\Session  $session
     * @return void
     */
    protected function storeCurrentUrl(Request $request, $session)
    {
        if ($request->method() === 'GET' &&
            $request->route() instanceof Route &&
            ! $request->ajax() &&
            ! $request->prefetch()) {
            $session->setPreviousUrl($request->fullUrl());
        }
    }

    /**
     * Add the session cookie to the application response.
     *
     * @param  \Symfony\Component\HttpFoundation\Response  $response
     * @param  \Illuminate\Contracts\Session\Session  $session
     * @return void
     */
    protected function addCookieToResponse(Response $response, Session $session)
    {
        //dump('in addCookieToResponse', $session->getId());
        //dump('in addCookieToResponse2', $session->getId());
        $response->headers->set($session->getName(), $session->getId());
        /*if ($this->sessionIsPersistent($config = $this->manager->getSessionConfig())) {
            $response->headers->setCookie(new Cookie(
                $session->getName(), $session->getId(), $this->getCookieExpirationDate(),
                $config['path'], $config['domain'], $config['secure'] ?? false,
                $config['http_only'] ?? true, false, $config['same_site'] ?? null
            ));
        }*/
    }

    /**
     * Save the session data to storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return void
     */
    protected function saveSession($request)
    {
        $this->manager->driver()->save();
    }

    /**
     * Get the session lifetime in seconds.
     *
     * @return int
     */
    protected function getSessionLifetimeInSeconds()
    {
        return ($this->manager->getSessionConfig()['lifetime'] ?? null) * 60;
    }

    /**
     * Get the cookie lifetime in seconds.
     *
     * @return \DateTimeInterface|int
     */
    protected function getCookieExpirationDate()
    {
        $config = $this->manager->getSessionConfig();

        return $config['expire_on_close'] ? 0 : Date::instance(
            Carbon::now()->addRealMinutes($config['lifetime'])
        );
    }

    /**
     * Determine if a session driver has been configured.
     *
     * @return bool
     */
    protected function sessionConfigured()
    {
        return ! is_null($this->manager->getSessionConfig()['driver'] ?? null);
    }

    /**
     * Determine if the configured session driver is persistent.
     *
     * @param  array|null  $config
     * @return bool
     */
    protected function sessionIsPersistent(array $config = null)
    {
        $config = $config ?: $this->manager->getSessionConfig();

        return ! is_null($config['driver'] ?? null);
    }

    /**
     * Resolve the given cache driver.
     *
     * @param  string  $driver
     * @return \Illuminate\Cache\Store
     */
    protected function cache($driver)
    {
        return call_user_func($this->cacheFactoryResolver)->driver($driver);
    }
}

[grahamsutton]

@restyler How do you perform testing using this package with Inertia? I was giving it a shot but it seems virtually impossible to use \Inertia\Testing\AssertableInertia in any feature tests.

Do you have an example of what your feature tests look like?