Stuff I'm Up To

Technical Ramblings

Laravel Routing Returns 302 Redirect — November 20, 2018

Laravel Routing Returns 302 Redirect

That was a frustrating few hours. I added a route into my api.php route and every time I visited it it triggered a redirect. I saw nothing in the browser and it was like my controller function wasn’t even being called.

I put the usual dd() and dump() into my function and it wasn’t being called. I even changed the function name so it didn’t exist and thought I’d get an error message, but nothing – still a redirect.

What is going on? I expanded out the call from “Namespace\Class@function” to put in a function () {} and that was being called and ran ok.

Clearly there was something wrong with my class somewhere. The other functions within it worked fine, just this new one didn’t even seem to be there.

Sure enough a bit of Duck-Jitsu and I found this: https://stackoverflow.com/questions/35020477/laravel-unexpected-redirects-302 – answer 3 is where I got my clue.

I looked at my class constructor and I was using the auth middleware to ensure the functions were not used unless authenticated.

public function __construct() {
  $this->middleware(['auth:api']);
}

For my function I wasn’t using any authentication, so of course I was getting a redirect. But because it’s an api call and the expected return in JSON under an XHttpResponse I wasn’t able to properly debug it. I was getting back a HTML page instead.

As a work around all I needed to do was add in an exception for my function:

public function __construct() {
  $this->middleware(['auth:api'], ['except' => [ 'myFunction' ]]);
}

Now all I have to do is go back and sort out the authentication for the function so I don’t need to bypass it.

Advertisements
When is a Question Mark not a ? — August 29, 2018

When is a Question Mark not a ?

That’s a morning of smashing my face on the desk again. I deployed my dev program onto a production system and then started crying as it stopped working as it should.

It seemed that none of my query string parameters were making it through to the controller. I called up some debugging and dumped out my $request and $request->all() etc. and discovered that the parameters although shown in the browser dev window went AWOL between server and controller. On my dev environment it all acted as it should.

So there must be something different. PHP v7.2 on dev and v7.0 or production maybe? No, much simpler than that. None of the Laracasts and Laravel related Googling pulled up any particular clues. It wasn’t until I looked at Nginx and parameters not being passed to PHP that I got a hit.

https://serverfault.com/questions/685525/nginx-php-fpm-query-parameters-wont-be-passed-to-php

The answer was as simple as adding in the $is_args into my Nginx virtual server config.

location / {
  try_files %uri $uri/ /index.php$is_args$query_string;
}

Up until now I guess I’ve been using routing with the parameters as part of the URI. Now I’m using some query string parameters I need to put in the ?, which is the $is_args variable.

So why not a problem in dev? Because I’m not using Nginx, I just use artisan serve to debug my development program.

Laravel and Lagan Web Services – SOAP API — August 17, 2018

Laravel and Lagan Web Services – SOAP API

SOAP is a dirty word to me. But I have a need to interact with our CRM system to import / extract data. My go to platform for most of my PHP work is Laravel. So I looked at interacting with Lagan CRM using SOAP calls from PHP.

I started off accessing the Lagan WSDL pages to see what the capabilities of the API are.

http://[laganserver:8080]/lagan/services/FL?WSDL
http://[laganserver:8080]/lagan/services/FLAuth?WSDL
http://[laganserver:8080]/lagan/schema/FLService.wsdl

Now I can see the self documenting API calls I can make. I just need to create the SOAP envelope to pass data to the service with the call I want to make.

Continue reading

Laravel Debug Bar — August 6, 2018

Laravel Debug Bar

It’s a good job my job title doesn’t include development. Some things I find out seem a long time after I need then and would be useful in the world of development.

My latest discovery is the Laravel debug bar. https://github.com/barryvdh/laravel-debugbar

Using it means not so many dd() or dump() in my code to find out what Laravel sees. It even allows me to see the actual SQL queries being used.

Selection_073
Laravel Debug Bar

In many ways I wish I’d discovered this sooner.

Installation is very simple, just a composer require and then ensure your .env has the debug option enabled and/or debug bar enabled.

APP_DEBUG=true
DEBUGBAR_ENABLED=true

 

Laravel Vue.js and API Routes — July 23, 2018

Laravel Vue.js and API Routes

I ran into a problem where I’ve started to deploy Vue components using the Vue Router from within Laravel. As soon as I enabled the Vue route for /{any} I lost access to the api routes.

routes/web.php

Route::get('/{any}', function () {
  return view('home');
})->name('home')->where('any', '.*');

Auth::routes();

app.js

const routes = [
  {
    path: '/',
    name: 'home',
    component: home
  }, {
  ...
  }, {
    path: '*',
    name: 'notFound',
    component: notFound
  }
]

I took a look at the Laravel RouteServiceProvider.php and noticed that the order of the web and api providers put the web first, so I swapped them around and now my api’s are back in business.

/**
* Define the routes for the application.
*
* @return void
*/
public function map()
{
  $this->mapApiRoutes(); // Needs to be first

  $this->mapWebRoutes();

}

 

 

Building a Debian Development Server — July 13, 2018

Building a Debian Development Server

When I setup a development system there are a few steps I follow to get everything working together.

The aim is to get everything installed to provide php and composer, node, nginx, mysql and Laravel as a base to build on.

Install Debian

I take the latest amd64 version using a network installable iso. This way if I use an older 9.1, 9.2, 9.3 version iso, being a netinst version I’ll end up with the latest in that series as it downloads from the net.

Mostly making a 50GB disk is more than enough, as it’s thin provisioned on a virtual, space isn’t really a concern. When it comes to partitioning I’ve learned to take the easy option and create one partition to mount all filesystems into it.

Capture1

As it’s a development platform I never install a desktop environment. I never need to use any GUI programs on the server. The only options I choose to install are the standard system utilities and the ssh server.

Capture2

Out of personal preference, once up and running I install sudo, zsh, curl and git.

# apt-get install sudo zsh curl git

Then I add my non-root user to the sudo group so I can stop using root and use my regular user account to ssh onto the dev server..

# usermod -aG sudo [user]

Setup OhMyZsh

I like using zsh and the OhMyZsh which is why I installed curl and git. So logon as your non-root user.

$ sh -c "$(curl -fsSL https://raw.githubusercontent.com/robbyrussell/oh-my-zsh/master/tools/install.sh)"

Then I edit the ~/.zshrc file and change the theme to “bureau”.

Network Config

If I’m building a Virtual Box guest that runs on my local PC I’ll setup two interfaces. If it’s a virtual on VMWare I’ll just use the one production interface.

On a local Virtual Box I use one interface as NAT, so it gets a DHCP address like 10.0.2.15 which all outgoing traffic is routed by default. Makes life easier on a corporate network where network authentication is required. Using NAT like this means I don’t need to authenticate my guest as it NAT via my physical hosts authenticated interface.

I then setup second interface so I can connect to what is being served from the guest. This is a “host only” interface and means only my local system can connect to it, but because of the NAT the guest will still have access to the corporate network resources/servers.

This means I end up with two devices usually named enp0s3 (NAT) and enp0s8 (Host Only) on Debian.

Using a Static IP (optional)

I choose to make my system with a static IP. Using the Virtual Box DHCP server on a “host only” interface gives out a 192.168.56.101 address to the first guest, 102 to the second and so on. But you can end up with inconsistent IP’s for your hosts. So making them static is a better option IMO.

Edit /etc/network/interfaces and set you host only adapter to static:

# This file describes the network interfaces available on your system
# and how to activate them. For more information, see interfaces(5).

source /etc/network/interfaces.d/*

# The loopback network interface
auto lo

iface lo inet loopback

# The primary network interface
allow-hotplug enp0s3
iface enp0s3 inet dhcp

allow-hotplug enp0s8
iface enp0s8 inet static
  address 192.168.56.2
  netmask 255.255.255.0

This way My dev system always gets the static IP I chose for it.

$ ip a
1: lo: <LOOPBACK,UP,LOWER_UP> mtu 65536 qdisc noqueue state UNKNOWN group default qlen 1
  link/loopback 00:00:00:00:00:00 brd 00:00:00:00:00:00
  inet 127.0.0.1/8 scope host lo
    valid_lft forever preferred_lft forever
  inet6 ::1/128 scope host 
    valid_lft forever preferred_lft forever
2: enp0s3: <BROADCAST,MULTICAST,UP,LOWER_UP> mtu 1500 qdisc pfifo_fast state UP group default qlen 1000
  link/ether 08:00:27:61:a6:a8 brd ff:ff:ff:ff:ff:ff
  inet 10.0.2.15/24 brd 10.0.2.255 scope global enp0s3
    valid_lft forever preferred_lft forever
  inet6 fe80::a00:27ff:fe61:a6a8/64 scope link 
    valid_lft forever preferred_lft forever
3: enp0s8: <BROADCAST,MULTICAST,UP,LOWER_UP> mtu 1500 qdisc pfifo_fast state UP group default qlen 1000
  link/ether 08:00:27:2b:04:26 brd ff:ff:ff:ff:ff:ff
  inet 192.168.56.2/24 brd 192.168.56.255 scope global enp0s8
    valid_lft forever preferred_lft forever
  inet6 fe80::a00:27ff:fe2b:426/64 scope link 
    valid_lft forever preferred_lft forever

Install PHP

Because we don’t want Apache2 installed you need to install php-fpm which won’t force an install of Apache.

$ sudo apt-get install php-fpm

It will include a load of other php components you need, but no Apache, so you can then choose to move on to Nginx or some other php service.

Add the Laravel php requirements

$ sudo apt-get install php-mbstring php-zip php-xml libpng-dev make gcc g++

The additional module libpng-dev is required for Laravel to build using NodeJS npm. Without libpng-dev, make, gcc and g++, under your Laravel project folder the call to $ npm i fails with errors like:

> pngquant-bin@4.0.0 postinstall /home/user/myproject/node_modules/pngquant-bin
> node lib/install.js
⚠ The `/home/user/myproject/node_modules/pngquant-bin/vendor/pngquant` binary doesn't seem to work correctly
⚠ pngquant pre-build test failed
ℹ compiling from source
✔ pngquant pre-build test passed successfully
✖ Error: pngquant failed to build, make sure that libpng-dev is installed
at Promise.all.then.arr (/home/user/myproject/node_modules/pngquant-bin/node_modules/bin-build/node_modules/execa/index.js:231:11)
at <anonymous>
at process._tickCallback (internal/process/next_tick.js:188:7)

Install MySQL

As you’ll need a database you’ll want to install MySQL. These days MySQL is installed from the MySQL site by downloading a .deb file which add the Oracle repositories. The version of MySQL in the Debian repositories is MariaDB, a fork of MySQL.

If you go for the Oracle version  you’ll probably need to ensure you use legacy authentication for now.

Include the php drivers as we install the server:

$ sudo apt-get install mysql-server php-mysql

To manage MariaDB using mysql you need to use sudo:

$ sudo mysql -u root
...
MariaDB [(none)]>

Install Composer

Go to your home folder and use the command line install from here: https://getcomposer.org/download/

You’ll end up with a file composer.phar. This is ok if you’re the only one going to use it but I like to put it in /usr/bin as just composer so it is available for everyone.

$ sudo cp ~/composer.phar /usr/bin/composer
$ sudo chmod 755 /usr/bin/composer

Install NodeJS

Install it using a package manager following the steps for Debian

https://nodejs.org/en/download/package-manager/

$ curl -sL https://deb.nodesource.com/setup_8.x | sudo -E bash -
$ sudo apt-get install -y nodejs

Then the first thing I do is update npm.

$ sudo npm i npm -g

Install Samba

Because not all development takes place on a Linux host this will allow us access to shares for Windows clients.

$ sudo install samba

Edit /etc/samba/smb.conf and make some simple changes.

workgroup=[NETBIOS DOMAIN NAME]

Then find [homes] and in that section change:

read only = no
create mask = 640
directory mask = 750

Create a password entry for your non-root user:

$ sudo smbpasswd -a [user]

Then restart Samba

$ sudo systemctl restart smbd

Then when you browse to the server from windows you should see and have access to your home folder eg. \\192.168.56.2\user

Installing Laravel

I prefer to install Laravel as a project using the Create Project method:

$ composer create-project --prefer-dist laravel/laravel [myproject]

This downloads all of the PHP composer prerequisites and delivers the project.

Once the project is created you can go into the folder [myproject] and check you can compile the assets using Node.

$ cd myproject
$ npm i

This will install all of the NodeJS prerequisites used for building/compiling your assets using the Laravel asset management tools – currently Laravel Mix (Based on Webpack). So with the Node modules installed you should be able to run prod and dev builds:

$ npm run dev
$ npm run prod

These should complete successfully.

You can then run Laravel’s built in development server to serve your project:

$ php artisan serve

But in reality this will fire up a pretty useless server listening on the IP address 127.0.0.1 on port 8000. So it’s only accessible from the development server.

As we’re going to need to access it from our client development machine we need to serve on the actual IP of the server. The easiest way of doing this is to serve it on every IPv4 interface on the server (you probably only have one, so it shouldn’t matter). To do this use:

$ php artisan serve --host=0.0.0.0

and if you want to specify the port you can use:

$ php artisan serve --host=0.0.0.0 --port=8001

Now you can access it from any client pointing your browser at http://192.168.56.2:8001 and begin exploring your Laravel project.

More Laravel

Of course serving a version of your project like this isn’t the only way to go. You should continue into dynamically building your assets using npm run watch and maybe even using tools like browserify to make changes happen at the browser end so you’re not building and refreshing all the time.

I also like to move away from a development web server and setup Nginx to handle serving my Laravel Project.

Further Reading

https://warlord0blog.wordpress.com/2017/03/01/ssh-logon-with-private-key/

https://warlord0blog.wordpress.com/2018/05/16/debian-stretch-ntp-time-sync/

https://warlord0blog.wordpress.com/2017/12/12/php7-0-microsoft-sql-driver-debian-stretch/

https://warlord0blog.wordpress.com/2017/03/01/installing-updating-webmin/

 

 

Nuclide — June 10, 2018
Composer Require Specific Branch — June 4, 2018

Composer Require Specific Branch

I’m trying to test out a version of a SAML project that doesn’t include the now defunct php extension for mcrypt. Using composer require kept on grabbing the master branch, when I actually wanted the “remove_mcrypt” branch.

I found that using composer with the branch like this failed:

$ composer require "aacotroneo/laravel-saml2":"remove_mcrypt"

[UnexpectedValueException]
Could not parse version constraint remove_mcrypt: Invalid version string “remove_mcrypt”

Thanks to a stackoverflow post: https://stackoverflow.com/questions/33525885/composer-require-branch-name I was able to resolve it by correctly prefixing the branch with “dev-

$ composer require "aacotroneo/laravel-saml2":"dev-remove_mcrypt"
Application Construction — April 4, 2018

Application Construction

Frameworks

For rapid application development there’s a lot of pre-written code out there that is mature and highly capable. There’s no need to build from the ground up when you can use a framework or scaffolding to build your application.

Laravel and Composer

My first step is to use Laravel. It’s installed using composer – which is a dependency manager for PHP. This means if a PHP component you install needs and relies upon other components, they’ll get installed too.

Composer installs all the PHP dependencies under ./vendor path of your project. The files in this path do not need to be included in your distribution. They can be installed and updated automatically using composer.

Composer keeps track of what you install into your project in the file composer.json. So whenever you run $ composer update it will read this file and pull down all the dependencies and install them into ./vendor.

Node.js and NPM

Whilst I may not be developing a Node application I can certainly make use of Node for the development process. It offers some very beneficial development features. It runs webpack to monitor and compile the projects assets and browsersync to refresh my browser when an asset is updated.

NPM is the package management tool that downloads and installs the Node packages required. In the same way as composer installs dependencies for PHP, NPM does this for Node/JavaScript.

NPM uses the file package.json to monitor/manage the dependencies you install, which get installed into ./node_modules. Again this does not need to be included in your distribution as the content you require gets compiled into your JavaScript assets. So you may not even require Node installing on your production server environment.

Webpack

As part of the Laravel install you’ll get a flavour of Webpack, or mix as Laravel terms their adaption.

Webpack carries out the monitoring and compilation of assets. It takes your JavaScript and CSS/SASS files and uglifies/compresses them into smaller code only versions of your scripts. It can take a JavaScript file from 2MB of code down to less than 200kb. Simplistically it does this by stripping all of the “English” from it and shrinking your long variable and function names to what are often single character variable and function names. Removing spaces, tabs and carriage returns etc.

eg.

var my_variable_name = 1;

becomes

var a=1;

Once the code is delivered to the browser in a production environment there is no need for the code to be human readable anymore.

The primary input for webpack comes from the assets ./resources/assets/js/app.js and bootstrap.js (not to be confused with the bootstrap framework). These two files are the core of your JavaScript application.

Webpack compiles your assets into ./public/css/app.css and ./public/js/app.js. So you only have a few includes required in your projects HTML to use your assets. You can split them down further so 3rd party or vendor code is separated from your own code.

Vue.js

Laravel ships with Vue.js these days. This is very new to me and strangely different. It’s a JavaScript framework that is a totally different environment than my experience with jQuery. The main features that make it so different for me are the ability to bind data to components. This means a big change in the way you previously needed to monitor and trigger events based on changes in data. Vue.js does this for you.

Vue components live with your JavaScript assets under ./resources/assets/js/components. Once required/imported in your app.js file the .vue files get compiled into your application.

Bootstrap and Bootstrap-vue

Bootstrap is a HTML presentation framework. it provides the visual construction of the web page that the users of your application see. It’s the styling/CSS of the application. It’s a distinctive style, but very powerful in that designing for mobile, tablet through to desktop presentation is a built in function of the framework.

Bootstrap-vue is a Vue.js componentised implementation of Bootstrap. The need for writing HTML code in the manner of Bootstrap is taken over by writing vue components that build the Bootstrap HTML. So a Bootstrap button can become a vue component with data binding with actions and references like any other vue component. This brings program-ability to the visual presentation capabilities of Bootstrap.

Vuetify and Material Design

As an alternate presentation framework to Bootstrap/Bootstrap-vue on one project I’ve used Vuetify. Vuetify again is a very distinctive style. It uses the Google Material Design styles to present your application.

Application Delivery

After writing and testing the application locally I need to deploy it to a web server.

As part of my development process I use the Git version control system. This allows me to commit changes of my code in a controlled manner and enables me to rollback to previous versions, compare changes I’ve made and easily deploy the code to other systems.

For this I installed a Gitlab server so we have our own internal Git version control server. Using Github is only for publicly accessible code unless you take out a commercial package. Having our own Gitlab server provides the same functionality, but enables me to keep private projects internally.

To deploy the code to a server is as simple as compiling my assets for production and cloning the project to the server or pulling the changes.

Compile my production assets and upload/push them to the Gitlab server:

$ npm run prod
$ git add .
$ git commit -m "Production deployment"
$ git push

Then from the server clone the code and install/update the PHP dependencies:

$ git clone git@gitlab.domain.local/projectpath/project.git
$ composer update

or, to update the server:

$ git pull
$ composer update

Then it’s good to go.

So in all it seems a lot of components and when I started down this path I thought it all very confusing and more than a little daunting. But it’s like Lego. They all snap together quite tidily and the end result is a comprehensive application development and delivery platform.

Vue.js – Past the First Week — March 21, 2018

Vue.js – Past the First Week

I started recoding a project that I’d only just built using Vue.js as an exercise in learning Vue. The project had only just been deployed using Laravel 5.5, Bootstrap 3 and jQuery. So I rewrote it and used Laravel 5.5, Bootstrap 4 and Vue.js.

The initial project delivered a nav menu driven series of pages that presented tabular results with a search/filter capability, with some Ajax/XHR calls to update datatables.

I’d built several blade templates to deliver the content and used some excellent Open Source code for building PHP forms for the filters and result details – Kris’ laravel-form-builder. I used DataTables.net to present columns of data and it all came together quite well.

But then I switched to Vue.js and replaced the form builder and datatables with bootstrap-vue.

Continue reading

Laravel 5 – jQuery File Upload — February 22, 2018

Laravel 5 – jQuery File Upload

I needed a mechanism to upload CSV files to my Laravel instance and then process them into a table. The first part was working out how I wanted to upload the files.

I came across blueimp-file-upload which seems pretty popular and capable.

There was no need to go overly fancy. Just a simple form will do as the file will probably be uploaded as a single file. First I had to figure out how to get blueimp into Laravel.

Continue reading

Laravel API Token Auth — February 18, 2018