Angular 2 POST to Laravel Rest API doesn't unless port number is changed

Question

我做了一个 laravel 和 angular 2 API - 它基本上对 laravel 后端 API 做了一个 post 请求.当我运行 php artisan 从根文件夹提供服务并且 npm 从 public 文件夹启动时，一切都完美无缺，public 文件夹通过端口 3000 提供服务，artisan 提供 api 通过端口 8000

这是我的服务文件在默认 artisan 端口 8000 和本地主机作为 API url

时的样子

    import {Http, Headers, Response} from "@angular/http"
    import {Injectable} from "@angular/core"
    import {ICourse} from "../interfaces/ICourse"
    import 'rxjs/Rx';
    import {Observable} from 'rxjs/Observable';
    import {Observer} from 'rxjs/Observer';
    import 'rxjs/add/operator/share';
    import 'rxjs/add/operator/map';

    @Injectable()
    export class Api {
        apiUrl: string = "http://localhost:8000/api/courses/";
        headers: Headers = new Headers;
        courses$: Observable<ICourse[]>;
        private _coursesObserver: Observer<ICourse[]>;
        private _dataStore: {
            courses: ICourse[]
        };

        constructor(private _http: Http) {
            this.headers.append('Content-Type', 'application/x-www-form-urlencoded');
            this.headers.append('X-Requested-With', 'XMLHttpRequest');
            this.courses$ = new Observable<ICourse[]>(observer => this._coursesObserver = observer).share();        
            this._dataStore = { courses: [] };
        }

        public createCourse(course) {
            return new Promise((resolve, reject) => {
                this._http.post(this.apiUrl, course, {
                    headers: this.headers
                }).map((res: Response) => res.json()).subscribe(
                        (res) => {
                            resolve(res);
                            console.log('api succeeds');
                        },
                        (error) => {
                            alert('error');
                            reject(error);
                        }
                    );
            })
        }


    }

当我将 api url 更改为像 http://www.example.com/api/course 这样的完全限定域时，它不仅会执行 GET 请求而不是 POST 但它不会执行什么都没有...我浏览了源代码，试图弄清楚到底发生了什么，但我真的很困惑..以前有人遇到过这个吗？还要注意的是，我可以使用真实域，但是我必须从不同的端口 php artisan

Answer 1

您是否将 apiUrl 属性更改为实时服务器的？您还需要一个令牌。您可以将 {{ csrf_field() }} 添加到包含 angular 应用程序的页面顶部，但您需要它，就像 laravel 中的任何 post 请求一样。我还没有真正研究过在两个独立的服务器之间发送响应，但如果你要走那条路线，jwt 可能就是诀窍。

不久前我写了一篇关于这个的小文章，它不是很透彻，但可以提供帮助check it out

Angular 2 POST to Laravel Rest API doesn't unless port number is changed

Angular 2 POST to Laravel Rest API doesnt unless port number is changed

angularjs-directive

angular

laravel-5.2

angular2-services

angular2-forms