json - 找不到将 json 发送到后端的 Angular 错误 404
问题描述
我现在正在学习前端和后端,我试图搜索这个错误,但我没有看到有人将 json 发送到后端。我收到这个 错误
我不确定这是否是因为 URL。如果我在邮递员中尝试该 URL 和 Json,它可以正常工作,它会插入到数据库中。 邮递员证明
它基本上是一个注册页面。如果邮递员和浏览器上的网址相同,我不知道为什么会出现该错误,我也在发送相同的数据,
这是代码:
用户服务.ts
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from "@angular/common/http";
import { Observable } from "rxjs";
import { User } from "../models/user";
import { global } from "./global";
@Injectable()
export class UserService{
public url: string;
constructor(
public _http: HttpClient
){
this.url = global.url;
}
test(){
return "Hola mundo Servicio";
}
register(user): Observable<any>{
let json = JSON.stringify(user);
let params = 'json='+json;
let headers = new HttpHeaders().set('Content-Type', 'aplication/x-www-form-urlencoded');
console.log(json);
console.log(params);
console.log(headers);
return this._http.post(this.url+'register', params, {headers: headers});
}
}
全球.ts
export var global = {
url: 'http://api-rest-laravel.com.devel/api/'}
注册组件.ts
import { Component, OnInit } from '@angular/core';
import { User } from '../../models/user';
import { UserService } from "../../services/user.service";
@Component({
selector: 'register',
templateUrl: './register.component.html',
styleUrls: ['./register.component.css'],
providers: [UserService]
})
export class RegisterComponent implements OnInit {
public page_title: string;
public user: User;
constructor(
private _userService: UserService
) {
this.page_title = 'Regístrate';
this.user = new User(1, '', '', 'ROLE_USER', '', '', '', '');
}
ngOnInit(): void {
}
onSubmit(form){
console.log('Componente de registro');
console.log(this._userService.test());
this._userService.register(this.user).subscribe(
response => {
console.log(response);
form.reset();
},
error => {
console.log(<any>error);
}
);
}
}
app.module.ts(如果需要)
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
import { routing, appRoutingProviders } from './app.routing';
import { AppComponent } from './app.component';
import { LoginComponent } from './components/login/login.component';
import { RegisterComponent } from './components/register/register.component';
import { ErrorComponent } from './components/error/error.component';
import { HomeComponent } from './components/home/home.component';
@NgModule({
declarations: [
AppComponent,
LoginComponent,
RegisterComponent,
ErrorComponent,
HomeComponent
],
imports: [
BrowserModule,
routing,
FormsModule,
HttpClientModule
],
providers: [
appRoutingProviders
],
bootstrap: [AppComponent]
})
export class AppModule { }
解决方案
推荐阅读
- css - 你如何使文本输入边框重叠?
- elasticsearch - GKE 上的 Elasticsearch - 无法使用 gcs 插件配置快照和还原
- apache-spark - 高效的 Spark JSON 转换
- node.js - 在 Gatsby 构建期间检索文件内容
- elasticsearch-2.0 - 如何在elasticsearch中构建促销数据
- reactjs - 单击时反应模态图像不显示大尺寸图像
- javascript - 如何根据同一段落中的语言更改字体?
- ios - 尝试将字符串转换为 iOS 13 的小数
- php - 用户名和电子邮件没有存储在 mysql 中,但密码是,为什么
- php - 当我把 LIKE% 启动时 Uncaught PDOException: SQLSTATE[42000]: Syntax error or access violation: 1064