Django具有角度相对路径，当字体和背面有不同的url时

Question

两天后，我无法设置(任何形式的(webpack，它在后面使用django3，在前面使用angular10，所以我决定只使用gulp来启动前端的ng-server和后端的python manage.py runserver。我是新手，所以这可能很愚蠢，但实际上两天是一段很长的时间来完成设置，却一无所获。。

目前，我正在试图调用django服务器上的API，该服务器位于http://127.0.0.1:8000ng发球时http://127.0.0.0:4200

@Injectable()
export class EchoService {
constructor(private httpClient: HttpClient) {}
public makeCall(): Observable<any> {
return this.httpClient.get<any>(
'http://127.0.0.1:8000/my-api/'
);
}
}

''

有没有更好的方法可以在Angular中做到这一点而不使用"；http://127.0.0.1:8000"在我做的每一个组件调用中？我如何使其尽可能接近将在prod版本中使用的相对路径(对于prod，我只会手动将捆绑包放在html中，但对于dev，我不能手动这样做(

Answer 1

Angular允许定义environment。以下是我所做的：

1. 在src文件夹中，找到environments文件夹。

2. 创建以下文件并根据需要调整内容(应该已经有一个名为environment.ts的文件了，我稍后再谈

environment.dev.ts

export const environment = {
production: true,
apiURL: "http://127.0.0.1:8000/my-api"
};

environment.prod.ts

export const environment = {
production: true,
apiURL: "https://api.yoururl.com/"
};

3. 修改您的angular.json：

...
"configurations": {
...
"production": {
"outputPath": "dist-prod/",
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
}
"dev": {
"outputPath": "dist-dev/",
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.dev.ts"
}
],
}
...

对于ng serve，使用标准的environment.ts文件，因此内容可能与environment.dev.ts的内容相匹配。您可以使用此设置创建构建，只需调用：

ng build --configuration dev
ng build --configuration prod

4. 在服务/组件中使用：

import { environment } from 'your/path/environments/environment';
@Injectable()
export class EchoService {
constructor(private httpClient: HttpClient) {}
public makeCall(): Observable<any> {
return this.httpClient.get<any>(
environment.apiURL + 'your/endpoint/
);
}
}

现在，根据配置，environment.apiURL可能是127.0.0.1:8000或https://....。我有一个用于开发，一个用于暂存，还有一个用于生产。

万一我遗漏了什么，你可以在这里读一下。