Ioni c 5 Получить запрос на Slim API - PullRequest
Новая
       40

Ioni c 5 Получить запрос на Slim API

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

Я бы хотел сделать запрос на получение из моего приложения Ioni c для сборки API с помощью Slim Framework.

Это код API: 

<?php
header('Access-Control-Allow-Origin: *');
header('Content-Type: application/json');
?>
<?php
use \Psr\Http\Message\ServerRequestInterface as Request;
use \Psr\Http\Message\ResponseInterface as Response;
use Tuupola\Middleware\HttpBasicAuthentication;

require 'vendor/autoload.php';
$jwt_secret = '**************';

$app = new Slim\App;

$app->add(new Tuupola\Middleware\JwtAuthentication([
    "path" => "/api",
    "attribute" => "jwt",
    "secret" => $jwt_secret,  "error" => function ($response, $arguments) {
        $data["status"] = "error";
        $data["message"] = $arguments["message"];
        return $response
            ->withHeader("Content-Type", "application/json")
            ->withHeader("Access-Control-Allow-Origin", "*")
            ->getBody()->write(json_encode($data, JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT));
    }
]));

$app->get('/api/hello', function (Request $request, Response $response, array $args) 
{
    $decoded = $request->getAttribute("jwt");
    $response->getBody()->write(json_encode(array("status"=> "200", "message" => "HELLO ".$decoded['uid'] ." - " . $decoded['cus'])));

    return $response;
});

$app->get('/', function (Request $request, Response $response, array $args) {
    $response->getBody()->write(json_encode(array("status"=> "200", "message" => "Welcome to the API")));

    return $response;
});

$app->run();

?>

Когда я тестирую с почтальоном, API работает нормально. Но когда я пытаюсь вызвать его с помощью HTTPClient в Ioni c, это не работает. Это мой Ioni c Код: 

import { Component } from '@angular/core';
import { HttpClient, HttpHeaders   } from '@angular/common/http';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})

export class HomePage {

  constructor(private http: HttpClient) 
  {

  }

  sendRequest()
  {
    this.http.get('http://localhost/slim3',).subscribe((data)=>console.log(data));
  }

}

Сообщение об ошибке выглядит следующим образом:: 8100 / home: 1 Доступ к XMLHttpRequest в 'http://localhost/slim3' from origin 'http://localhost: 8100 'заблокировано политикой CORS: в запрошенном ресурсе отсутствует заголовок «Access-Control-Allow-Origin».

core. js: 6014 ОШИБКА HttpErrorResponse {headers: HttpHeaders, status: 0, statusText: «Unknown Error», url: «http://localhost/slim3», ok: false,…}

Как это исправить? Спасибо!

1 Ответ

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

Вы должны включить CORS ( Что такое CORS? ) в Slim Framework. Проверьте http://www.slimframework.com/docs/v3/cookbook/enable-cors.html

Добавьте это перед $app->run(); (заменив http://mysite на ваш URL, включая порт) 

$app->options('/{routes:.+}', function ($request, $response, $args) {
    return $response;
});

$app->add(function ($req, $res, $next) {
    $response = $next($req, $res);
    return $response
            ->withHeader('Access-Control-Allow-Origin', 'http://mysite')
            ->withHeader('Access-Control-Allow-Headers', 'X-Requested-With, Content-Type, Accept, Origin, Authorization')
            ->withHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, PATCH, OPTIONS');
});
...