Как вызвать функцию контроллера из вида по внешнему javascript в Laravel 7? - PullRequest
Новая
       5

Как вызвать функцию контроллера из вида по внешнему javascript в Laravel 7?

0 голосов
/ 21 апреля 2020

Проверка моей электронной почты работала безупречно, пока я не попытался поместить javascript из представления emailvali.blade.php во внешний файл javascript. Следующий код был перемещен из файла представления в /public/js/emailvali.js:

$(document).ready(function(){       

 $('#email').blur(function(){

  var error_email = '';
  var email = $('#email').val();
  var _token = $('input[name="_token"]').val();
  var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;

  if(!filter.test(email))
  {    
   $('#error_email').html('<label class="text-danger">Invalid Email format</label>');
   $('#email').addClass('has-error');
   $('#register').attr('disabled', 'disabled');
  }
  else
  {
  $('#error_email').html('<label class="text-success">Email format valid</label>');
  let email = document.getElementById("email").value; //assuming your input id="email"

  $.ajaxSetup({
        headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')}
    });
   $.ajax({
    //url:"{{ route('emailvalicontroller.check') }}",
    url: emailCheckUrl,
    method:"POST",
    data:{email:email},
    error:function(xhr, status, error) {
        var err = JSON.parse(xhr.responseText);
      alert("Error: " + xhr.responseText);
    },
    success:function(data)
    {
     if(result == 'unique')
     {
      $('#error_email').html('<label class="text-success">Email Available</label>');
      $('#email').removeClass('has-error');
      $('#register').attr('disabled', false);
     }
     else
     {
      $('#error_email').html('<label class="text-danger">Email not Available</label>');
      $('#email').addClass('has-error');
      $('#register').attr('disabled', 'disabled');
     }
    }
   })
  }
 });
});

Мои маршруты в Интернете. php выглядят следующим образом: 

<?php
use Illuminate\Support\Facades\Route;

Route::get('/', function () {
    return view('welcome');
});

Auth::routes();

Route::get('/home', 'HomeController@index')->name('home');

Route::get('/emailvali', 'EmailValiController@index');
Route::post('/emailvali/check', 'EmailValiController@check')->name('emailvalicontroller.check');
});

Контроллер: 

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use DB;

class EmailValiController extends Controller
{
    function index()
    {
     return view('emailvali');
    }

    function check(Request $request)
    {
      if($request->get('email'))
      {
        $email = $request->get('email');
        $data = DB::table("users") //don't set prefix.
         ->where('email', $email)
         ->count();
        if($data > 0){ echo 'not_unique'; }
        else{ echo 'unique'; }
     }
    }
}

myscript.js правильно вызывается emailvali.blade.php с использованием <script type="text/javascript" src="{{ URL::asset('js/emailvali.js') }}"></script>. err.message пусто, но текст ответа содержит exception: Symfony\\Component\\HttpKernel\\Exception\\NotFoundHttpException. Я думаю, что проблема не в токене, иначе было бы сообщение об ошибке токена. Что здесь не найдено и как это исправить? Это emailvalicontroller, к которому теперь нельзя получить доступ с js? Спасибо.

Полный текст xhr.responseText: 

Error: {
    "message": "",
    "exception": "Symfony\\Component\\HttpKernel\\Exception\\NotFoundHttpException",
    "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\AbstractRouteCollection.php",
    "line": 43,
    "trace": [
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\RouteCollection.php",
            "line": 162,
            "function": "handleMatchedRoute",
            "class": "Illuminate\\Routing\\AbstractRouteCollection",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Router.php",
            "line": 639,
            "function": "match",
            "class": "Illuminate\\Routing\\RouteCollection",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Router.php",
            "line": 628,
            "function": "findRoute",
            "class": "Illuminate\\Routing\\Router",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Router.php",
            "line": 617,
            "function": "dispatchToRoute",
            "class": "Illuminate\\Routing\\Router",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Kernel.php",
            "line": 165,
            "function": "dispatch",
            "class": "Illuminate\\Routing\\Router",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php",
            "line": 128,
            "function": "Illuminate\\Foundation\\Http\\{closure}",
            "class": "Illuminate\\Foundation\\Http\\Kernel",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Middleware\\TransformsRequest.php",
            "line": 21,
            "function": "Illuminate\\Pipeline\\{closure}",
            "class": "Illuminate\\Pipeline\\Pipeline",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php",
            "line": 167,
            "function": "handle",
            "class": "Illuminate\\Foundation\\Http\\Middleware\\TransformsRequest",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Middleware\\TransformsRequest.php",
            "line": 21,
            "function": "Illuminate\\Pipeline\\{closure}",
            "class": "Illuminate\\Pipeline\\Pipeline",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php",
            "line": 167,
            "function": "handle",
            "class": "Illuminate\\Foundation\\Http\\Middleware\\TransformsRequest",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Middleware\\ValidatePostSize.php",
            "line": 27,
            "function": "Illuminate\\Pipeline\\{closure}",
            "class": "Illuminate\\Pipeline\\Pipeline",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php",
            "line": 167,
            "function": "handle",
            "class": "Illuminate\\Foundation\\Http\\Middleware\\ValidatePostSize",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Middleware\\CheckForMaintenanceMode.php",
            "line": 63,
            "function": "Illuminate\\Pipeline\\{closure}",
            "class": "Illuminate\\Pipeline\\Pipeline",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php",
            "line": 167,
            "function": "handle",
            "class": "Illuminate\\Foundation\\Http\\Middleware\\CheckForMaintenanceMode",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\fruitcake\\laravel-cors\\src\\HandleCors.php",
            "line": 36,
            "function": "Illuminate\\Pipeline\\{closure}",
            "class": "Illuminate\\Pipeline\\Pipeline",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php",
            "line": 167,
            "function": "handle",
            "class": "Fruitcake\\Cors\\HandleCors",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\fideloper\\proxy\\src\\TrustProxies.php",
            "line": 57,
            "function": "Illuminate\\Pipeline\\{closure}",
            "class": "Illuminate\\Pipeline\\Pipeline",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php",
            "line": 167,
            "function": "handle",
            "class": "Fideloper\\Proxy\\TrustProxies",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php",
            "line": 103,
            "function": "Illuminate\\Pipeline\\{closure}",
            "class": "Illuminate\\Pipeline\\Pipeline",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Kernel.php",
            "line": 140,
            "function": "then",
            "class": "Illuminate\\Pipeline\\Pipeline",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Kernel.php",
            "line": 109,
            "function": "sendRequestThroughRouter",
            "class": "Illuminate\\Foundation\\Http\\Kernel",
            "type": "->"
        },
        {
            "file": "C:\\wamp64\\www\\van\\public\\index.php",
            "line": 55,
            "function": "handle",
            "class": "Illuminate\\Foundation\\Http\\Kernel",
            "type": "->"
        }
    ]
}

Ответы [ 2 ]

2 голосов
/ 21 апреля 2020

Ваш JS файл не проанализирован PHP. Один из хороших способов решения этой проблемы - сначала ввести значение, а затем вызвать скрипт, например: 

// in your Blade template
<script>
const emailCheckUrl = @json(route('emailvalicontroller.check'));
</script>
<script src="/js/myscript.js"></script>

А затем в вашем /js/myscript.js: 

$.ajax({
    url: emailCheckUrl,
    // ...
});
0 голосов
/ 21 апреля 2020

В вашем emailvali.blade.php это должно быть где-то внизу: 

<script> const emailRoute = @json(route('emailvalicontroller.check')); </script>
<script src="{{asset('js/emailvali.js')}}"></script>

А также кнопка для вызова ajax запроса: 

<button onclick="addSomething()">Add something</button>

Теперь внутри Ваш файл emailvali.js должен иметь что-то вроде этого: 

function addSomething(){

  let email = document.getElementById("email").value; //assuming your input id="email"

$.ajaxSetup({
        headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')}
    });
    $.ajax({
        type:'POST',
        url: emailRoute,
        data: {email:email},
        success:function(data) {
            console.log("success");
            //add your success handling here
        },
        error: function (data, textStatus, errorThrown) {
          console.log("failed");
          //add your failed handling here
        },
    });
}

Более идеальным является включение токена CSRF в качестве заголовка в настройку Ajax, затем убедитесь, что у вас есть 

 <meta name="csrf-token" content="{{ csrf_token() }}">

в вашем <head> HTML.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...