capacitor-community / http

Community plugin for native HTTP
MIT License
209 stars 136 forks source link

Unable to bypass CORS in webview #249

Open MeghaRajpara opened 2 years ago

MeghaRajpara commented 2 years ago

Describe the bug Unable to bypass CORS in webview

Whenever I am trying to do POST request using capacitor-community/http getting CORS error. Doesn't get this error while making GET request.

Screen Shot 2022-04-05 at 9 08 42 PM

http.service.ts

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Http, HttpOptions } from '@capacitor-community/http';
import { from, Observable } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class HttpService {

  constructor() { }

  doGet(url) {
    const options: HttpOptions = {
      url
    }
    return from(Http.get(options));
  }

  doPost(url): Observable<any> {
    const options: HttpOptions = {
      url,
      method: 'POST',
      headers: { 'content-type': 'application/json','Authorization': 'Bearer id_token' },
      data: { foo: 'bar', cool: true },
    };

    return from(Http.request(options));
  }
}

home.page.ts

import { Component } from '@angular/core';
import { HttpService } from '../services/http.service';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {
  data = null;
  constructor(private httpService: HttpService) { }

  nativeCall() {
    this.httpService.doPost('https://xxxxx/cloude_function_name').subscribe((res: any) => {
      console.log(res);
      this.data = res.data.specials;
    });
  }

}
maxhedt commented 2 years ago

You could try:

const options: HttpOptions = { url, webFetchExtra: { mode: 'no-cors' } }