POST 数据 ionic 3 和后端 API restful laravel答案

【问题标题】：POST data ionic 3 and backend API restful laravelPOST 数据 ionic 3 和后端 API restful laravel
【发布时间】：2018-04-24 18:42:25
【问题描述】：

我在添加学生页面遇到了关于 POST 数据的问题。我正在使用 ionic 3 和后端 API restful laravel，我在邮递员中尝试了这个 POST 并且它有效，但是在单击添加按钮后我收到错误消息“无效令牌或未提供令牌”（请参阅 first 图片）。我不确定如何使用身份验证令牌编写方法。

可以参考我的provider（secondimage），addstudent.ts（thirdimage），button html（forthimage）供参考

提前致谢。

【问题讨论】：

标签： rest ionic-framework laravel-5 ionic3 ionic-view

【解决方案1】：

假设您将令牌存储在存储中（例如 localStorage 或 sessionStorage），您可以执行以下操作：

Step1：添加 Auth 提供者并扩展 BaseRequestOptions

import { BaseRequestOptions, RequestOptions, RequestOptionsArgs } from '@angular/http';
import { Injectable } from '@angular/core';

@Injectable()
export class AuthProvider extends BaseRequestOptions {

  constructor() {
    super();
    this.headers.set('Content-Type', 'application/json');
  }

  merge(options?: RequestOptionsArgs): RequestOptions {

    let newOptions = super.merge(options);
    let accessToken = localStorage.getItem('accessToken');
    if (accessToken !== null && accessToken !== undefined) {
      let token: AcessTokenResponse = JSON.parse(accessToken);
      newOptions.headers.set('Authorization', token.token_type + ' ' + token.access_token);
    }

    return newOptions;
  }
}

Step2：在app.module.ts文件的providers下添加AuthProvider

【讨论】：

您好，感谢您的回答，但我在 locationStorage 和 AccessTokenResponse 中遇到错误。它说“[ts] 找不到名称‘locationStorage’。”和“[ts] 找不到名称‘AcessTokenResponse’。”我有为这些添加任何方法或类吗？
localStorage 有一个错字，我更新了答案。请注意，您必须先添加代码以将“accessToken”保存到 localStorage。理想情况下，当您获得令牌时，您会将其保存为此对象 (AcessTokenResponse) {token_type: string, access_token: string} 其中 token_type 通常是“Bearer”

【解决方案2】：

根据我的经验，您需要在 POST 调用中添加RequestOptions，如下所示：

    let options = new RequestOptions({
      headers: headers
    });
    this.http.post(this.apiUrl+'/addstudent', addStudent, options)

在您的代码中，您正在创建 Header 但没有将其传递到 post 请求中。

试试上面的代码希望这能帮助你的 API 工作。

【讨论】：

太棒了！如果它解决了您的问题，请接受此答案。