上传图像并以 Angular 格式配置标题



我在Angular中上传图像时遇到问题。所以我研究并发现了一些你需要删除标题的东西,以便内容类型"边界"会自动出现。在我的角度应用程序中,我有拦截器,所以我不需要在每个函数中附加标头。但是我有一个问题,因为我只想删除onCreateService((函数上的标题,以便我可以保存图像。请在下面检查我的代码。我在 REST API 和 laravel 上使用它。

服务.html

onCreateService(form: FormGroup) {
const formData = new FormData();
formData.append('image', this.selectedImage);
formData.append('name', this.servicesForm.get('name').value);
formData.append('amount', this.servicesForm.get('price').value);
formData.append('description', this.servicesForm.get('content').value);
this.servicesService.addService(formData)
.subscribe(
data => {
alert('New service created successfully');
console.log(data);
},
error => {
console.log(error);
alert(`ERROR! can't create new service`);
});
}

服务网

addService(formData) {
const headers = new HttpHeaders();
delete headers['Content-Type'];
headers.append('Content-Type', 'multipart/form-data');
return this.httpClient
.post(
this.url, (formData), { headers: headers }
)
.map((response: any) => {
return response;
});
}

拦截器.ts

export class AuthInterceptor implements HttpInterceptor {
private authService: AuthService;
constructor(private injector: Injector, private router: Router) { }
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
// Get the auth header from the service.
this.authService = this.injector.get(AuthService);
const token = this.authService.getToken();
if (token) {
req = req.clone({ headers: req.headers.set('Authorization', 'Bearer ' + token) });
}
if (!req.headers.has('Content-Type')) {
req = req.clone({ headers: req.headers.set('Content-Type', 'application/json') });
}
req = req.clone({ headers: req.headers.set('Accept', 'application/json') });
return next.handle(req).do(
(event: HttpEvent<any>) => { },
(err: any) => {
if (err instanceof HttpErrorResponse) {
if (err.status === 401 || err.status === 403 || err.status === 400) {
localStorage.clear();
this.authService.logout();
alert('Session has expired!nYou will be redirected to the login page');
}
}
}
);
}
}

删除拦截器中的"内容类型"资源库

最新更新