Our Work


Updated today

Laravel (Web Application) as content provider for a Web Widget

You can refer the code here : https://github.com/KtreeOpenSource/Laravel_Jswidget

Here we going to learn about how we make a web widget to bring authenticated data from a laravel application

These are steps we are going to follow

  • Create the routes
  • Create the controller
  • Create the widget file

Step 1:

Install the passport package refer link

Lets create the routes for logging and getting helloworld from the laravel application after installing and configuring the passport package.


Route::post('login', 'API\[email protected]');

Route::group(['middleware' => 'auth:api'], function(){
Route::post('helloworld', 'API\[email protected]');

Step 2:

Create a controller for the routes in Step 1.

On click get access token button we will call the login function.


public $successStatus = 200;
public function login(){
       if(Auth::attempt(['email' => request('email'), 'password' => request('password')])){
           $user = Auth::user();
           $success['token'] =  $user->createToken('MyApp')-> accessToken;//token generated
           return response()->json(['success' => $success], $this-> successStatus);
           return response()->json(['error'=>'Unauthorised'], 401);

Step 3:

Let's create the a php form assuming we have correct credentials


      <input type='hidden' name="email" value="[email protected]"><br>
      <input type='hidden' name="password" value="anandc123"><br>
      <input name="submit" type="submit" value="Get Oauth Token">
      Token <input disabled="true" type="text"   id="key" class='helloworld' value=''/>
      <button disabled="true"  id='getdata' class='helloworld' >Get Data From Laravel api</button>
      <div style="display:none" id='finalValue' >Data From Laravel is this </div>


 $(function () {
            type: 'post',
            url: 'http://xxxxxxxxx/api/helloworld',
            headers: {
            success: function (data) {    
                $('#finalValue').text($('#finalValue').text()+' "'+data.description+'"')
$(document).ajaxStart(function() {
}).ajaxStop(function() {
        $('form').on('submit', function (e) {
            type: 'post',
            url: 'http://xxxxxxxxx/api/login',
            data: $('form').serialize(),
                  $("#wait").css("display", "block");
            success: function (data) {
                var token =  data.success.token
                    $('.helloworld').val('Bearer '+token);
//                    $('#finalValue').text('Token Generated Successfully');
//                    $('#finalValue').css("display","block");
                    alert('oops token not generated');

The widget.php can be included anywhere(in other applications) and requests can be send to the laravel application.

Looking For Laravel Developer?

Please Contact us if you have any Laravel Implementation requirements. Hire dedicated Laravel developers or Laravel Development services from KTree. KTree is Best offshore Laravel development company with extensive experience in building Laravel web applications and Laravel Plugins.

Request For Quote

Related Posts


    No tag results found for this post