【问题标题】:SyntaxError: Unexpected token < in JSON at position 0 atSyntaxError:意外的令牌 < 在 JSON 中的位置 0 处
【发布时间】:2018-06-10 17:25:47
【问题描述】:
add-user.component.ts:30 SyntaxError: Unexpected token < in JSON at position 0
    at Object.parse (<anonymous>)
    at Response.webpackJsonp.../../../http/@angular/http.es5.js.Body.json (http.es5.js:797)
    at MapSubscriber.project (user.service.ts:34)
    at MapSubscriber.webpackJsonp.../../../../rxjs/operators/map.js.MapSubscriber._next (map.js:79)
    at MapSubscriber.webpackJsonp.../../../../rxjs/Subscriber.js.Subscriber.next (Subscriber.js:90)
    at XMLHttpRequest.onLoad (http.es5.js:1226)
    at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.es5.js:3881)
    at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
    at Zone.webpackJsonp.../../../../zone.js/dist/zone.js.Zone.runTask (zone.js:188)

当我想添加一个表单时,有人知道为什么会出现这个错误

**add.components.ts**

import { Component, OnInit } from '@angular/core';
import {UserService} from '../user.service';
import {Router} from '@angular/router';
import { User } from '../User';



@Component({
  selector: 'app-add-user',
  templateUrl: './add-user.component.html',
  styleUrls: ['./add-user.component.css']
})
export class AddUserComponent implements OnInit {

 user:User=new User();

 errors=[];


  constructor(public userService:UserService, private router: Router) { }


  ngOnInit() {
  }

  saveContact(){
    this.userService.saveContact(this.user)
      .subscribe(
        data => console.log(data),
        error => console.error(error)
    );

        }
      }

表格

<form class="well">

  <div class="form-group">
    <label>username:</label>
    <input type="text" class="form-control" placeholder="add username"   [(ngModel)]="username" name="username" >
  </div>

  <div class="form-group">
    <label>Email:</label>
    <input type="text" class="form-control" placeholder="add email"  [(ngModel)]="email" name="email" >
  </div>



      <div *ngFor="let error of errors" class="alert alert-danger">
          <div>There is an error in :{{error.field}} field</div>
          <div>{{error.message}}</div>
        </div>

  <button  class="btn btn-primary"  (click)="saveContact()" >Save</button>

</form>

用户服务

@Injectable()
export class UserService {

  private uri= 'http://127.0.0.1:8000/api/users';


     constructor(private http: Http, private authenticationService: AuthService  ) {}


      getUsers(): Observable<any[]> {
        const headers = new Headers({ 'Authorization': 'Bearer ' + this.authenticationService.token });
        return  this.http.get(this.uri , {headers : headers}).map(res => <User[]> res.json() )
        .catch(this.handelError);

      }



      saveContact(user: User) {
        const  headers = new Headers();
        headers.append('content-type', 'application/json');
        headers.append('Authorization', 'Bearer ' + this.authenticationService.token);
        return this.http.post(this.uri, JSON.stringify(user), {headers : headers})
        .map(response => response.json());
      }

【问题讨论】:

  • 检查响应,我敢打赌一些 HTML 错误页面。
  • 是的,您收到的很可能不是 JSON,因此出现错误。
  • 我如何检查@AJT_82 我的 json,因为在邮递员中它会正确发送令牌和授权,但在 Angular js 中我有这个错误“SyntaxError: Unexpected token
  • 检查开发工具中的响应选项卡 (F12)。我怀疑你会在那里看到 index.html 文件。
  • 是的,当我检查 F12 时,我有一个文件 html

标签: angular api symfony


【解决方案1】:

问题在于内容类型。您不是在发送 HTML 内容,而是在您的内容类型中说您的内容是 JSON。

headers.append('content-type', 'application/json');

你应该把这个头换个准确的

【讨论】:

    猜你喜欢
    • 2021-07-01
    • 2020-02-05
    • 2021-09-12
    相关资源
    最近更新 更多