1、service文件
创建xxx.service.ts文件
import { Injectable, Inject } from '@angular/core'; import { Observable } from 'rxjs'; import { map } from 'rxjs/operators'; import { HttpClient } from '@angular/common/http';
@Injectable({ providedIn: 'root' }) export class ErrorConditionService { constructor(private http: HttpClient, @Inject('BASE_CONFIG') private config) { } }
|
BASE_CONFIG在app.module.ts文件中写
providers: [ { provide: 'BASE_CONFIG', useValue: { url: 'myurl' } } ]
|
设置proxy实现跨域
(在项目根目录下新建proxy.conf.json,然后在package.json文件中配置一下)
1)proxy.conf.json代码
{ "/myurl": { "target": "http://10.0.0.0:0000", "secure": true } }
2)修改package.json(ng serve -o --proxy-config proxy.conf.json)
|
2、http请求
post传json格式数据:
const data = { id: 1 } ceshi1(data): Observable<any> { const url = `${this.config.myurl}/xxx/xxxxx`; return this.http.post(url, data).pipe( map((res: any) => { return res; }) ); }
|
post传params格式数据1(传参少且字符短):
const data = { id: 1 }
ceshi2(data): Observable<any> { const url = `${this.config.myurl}/xxx/xxxxxx`; return this.http.post(url, {},{ params: data }).pipe( map((res: any) => { return res; }) ); }
|
post传params格式数据2(传参多且字符长):
const data = { id: 1, text:‘成百上千个字节’ }
const params = new HttpParams({ fromObject: data });
ceshi2(data): Observable<any> { const url = `${this.config.myurl}/xxx/xxxxxx`; return this.http.post(url, params).pipe( map((res: any) => { return res; }) ); }
|
或者(效果同上)
const formData = new FormData(); formData.append('id',1); formData.append('text','成百上千个字符');
ceshi2(data): Observable<any> { const url = `${this.config.myurl}/xxx/xxxxxx`; return this.http.post(url, formData).pipe( map((res: any) => { return res; }) ); }
|
原文地址:https://www.cnblogs.com/boreguo/p/10342598.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。