从前端（角度）向后端（laravel）发送数据，并通过（laravel）发送api发布请求

Question

嗨，我有2个域1用于主网站www.something.com，另一个用于apis.something.com

• 主要网站www.something.com是html中的前端（角度），其中存在带有输入形式的表单
• 子域是apis.something.com，是后端 laravel ，该后端用于将所有api与前端连接以向hubspot api发送联系信息的请求< / li>

问题是当我直接通过客户端角度发送api post request（hubspot API）时，我遇到了 CORS错误

注意：

• hubspot通过 CORS
阻止了任何通过客户端的发布请求
• 如果我通过后端（ laravel ）发送请求并发送 标头allow origin，它接受​​并发送带有 laravel刀片，它不是通过角度手动创建的

所需

我想send the request在主网站www.something.com中以角形式形成表格并将其发送到 laravel 第二个apis子域apis.something.com然后通过 laravel 而不是通过 angular 将 api发布请求发送到hubspot api。

场景：

角形（前端）表单www.something.com-> laravel （后端）apis.something.com-> 中心点 api

角度代码：

sending.component.html

<form
    #pInputs="ngForm"
    (ngSubmit)="form.valid && sendRequestData2(pInputs.value)"
    (ngSubmit)="form.valid && sendRequestData()"
    #form="ngForm"
    autocomplete="nope"
  >
<input
              type="text"
              name="name"
              [(ngModel)]="user.name"
              #name="ngModel"
              class="form-control"
              id="booking-name"
              placeholder="Enter your full name here"
              [required]="true"
            />
<button
          type="submit"
          class="btn btn-blue  text-white  brs25 pl50 pr50 brs22"
          i18n="@@send_request_now"
          [disabled]="!form.valid"
        >
          Send Request Now
        </button>
</form>

sending.component.ts

export class SendSurgeryRequestFormComponent implements OnInit {
private readonly DEAL_URL = 'http://www.something.com';
  user = {
    name: ""
  };

  constructor(private bookingService: BookingService,private router: Router, private http:HttpClient) {}
  
  ngOnInit() {}

 sendRequestData2(data){

    const url = this.DEAL_URL;

    var payloads = JSON.stringify(data);
    this.http.post(url,
      payloads).subscribe((result)=>{
      console.log("the result", result);
      });
      console.warn(payloads);
    }

  goHome() {
    this.router.navigate(['/']);
  }
}

Laravel代码：

拉威尔（Laravel）路线

header('Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept, Key');
    
Route::post('https://api.hubapi.com/contacts/v1/contact?hapikey=??????????????????', 'HubspotApiController@create');

Laravel控制器

<?php

namespace App\Http\Controllers;


use GuzzleHttp\Exception\GuzzleException;

use GuzzleHttp\Client;
use Illuminate\Http\Request;

class HubspotApiController extends Controller
{
    //

    public function create(Request $r)
    { 
        $arr = [
            'properties' => [
                  [
                    'property' => 'name',
                    'value' => $r['name']
                  ]           
                            ]
               ];


        $post_json = json_encode($arr);
        $client = new Client([
        'headers' => ['Content-Type' => 'application/json']
         ]);            
        
        $res = $client->request('POST',[
        'body' => $post_json]);
        return "Contact Created!";
        
         
    
        return back();
    }
}