Extract data from an external website with JQUERY Y LARAVEL? [CORS]

1

I was doing a mini project to be able to extract part of the text from an external website, I have been reporting on the subject and apparently this is called CORS, I tried to implement it but it did not just work for me. I'm doing it through ajax with jquery, and I've read in several places that there is a jtyp or xml datatype, and if not, add a header so that

headers:{"Access-Control-Allow-Origin: *"},

This is what I have. MY VISTA

<div class="container">
    <h1 class="page-header" >{{$titulo}}</h1>

    {!! Form::open(['url' => '/lyrics', 'method' => 'POST','class' =>'form-horizontal']) !!}


    <div class="row">
        <div class="col-md-12 form-group">
            {!! Form::hidden('taginicial', $tags['taginicial'] ) !!}
            {!! Form::hidden('tagfinal', $tags['tagfinal']) !!}
            {!! Form::hidden('pagina', $tags['pagina'] ) !!}
            {!! Form::label('', 'Interprete', ['class' => 'control-label']) !!}
            {!! Form::text('interprete', 'Lorem ipsum.', ['disabled' => 'disabled','class' => 'form-control']) !!}
        </div>
    </div>

    <div class="row">
        <div class="col-md-12 form-group">
            {!! Form::label('', 'Texto de la cancion', ['class' => 'control-label']) !!}
            {!! Form::textarea('letra_cancion', 'Lorem ipsum dolor.', ['class' => 'form-control','id' => 'textareacancion']) !!}
        </div>
    </div>



    <div class="row">
        <div class="col-md-3 form-group" >
            {!! Form::submit('Inserta en base de datos', ['class' => 'form-control btn btn-info','id' => 'obtenletra']) !!}
        </div>
    </div>  

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

MY AJAX FUNCTION

$(document).ready(function() {
    var taginicial = $('input[name="taginicial"]').val();
    var tagfinal = $('input[name="tagfinal"]').val();
    var pagina = $('input[name="pagina"]').val();
    console.log(taginicial);
    console.log(tagfinal);
    console.log(pagina);
        $.ajax({
            url: pagina,
            crossDomain:true,
            headers:{"Access-Control-Allow-Origin: *"},
            type: 'POST',
            dataType: 'xml',
            data: {param1: 'value1'},
        })
        .done(function() {
            console.log("success");
        })
        .fail(function() {
            console.log("error");
        })
        .always(function() {
            console.log("complete");
        });


});

If in this function I omit headers, I get this error

Solicitud desde otro origen bloqueada: la política de mismo origen impide leer el recurso remoto en https://laravel.com/docs/5.3/routing (razón: falta la cabecera CORS 'Access-Control-Allow-Origin').

If I do not omit them and the data type I put in xml, jsonp or even omit the data type the result is this

SyntaxError: missing : after property id

I have tried different sites and have checked in their headers that the "Access-Control-Allow-Origin: *" is like this, What's wrong with me?

    
asked by KurodoAkabane 29.04.2017 в 12:53
source

1 answer

0

I recommend you use the guzzle / client library

link

after installing it you look at the documentation:

link

this would be its use to obtain the html of the page you want:

$response = $client->request('GET',$url)->getBody();

You can create a driver that gets the html of the page and with jquery you make a call to that controller.

Being the controller of your own application does not generate the problem of permissions.

If you need to manage the html obtained from the laravel page you can use the dom crawler library.

    
answered by 22.05.2017 в 08:05