javascript - Wie löst man domänenübergreifende Probleme bei der Trennung von Front-End und Back-End?

Wenn ich derzeit an meinem Blog arbeite, denke ich darüber nach, Front-End und Back-End zu trennen, die Front-End- und Back-End-Logik in zwei separaten Repositorys zu platzieren und sie auf zwei Servern bereitzustellen.

Mein Hauptdomainname ist: godtail.cn (Derzeit verwende ich ghost, ein neuer Blog wird geschrieben...)

• Der Front-End-Domainname lautet: www.godtail.cn | godtail.cnm.godtail.cnDer Backend-Domainname lautet:

• api.godtail.cnAber bei der Kommunikation stellte ich fest, dass es dazu kam

  Nun, ich dachte, dass es nicht domänenübergreifend sein würde, wenn der Hauptdomänenname derselbe wäre (derselbe Domänenname und unterschiedliche Ports würden auch domänenübergreifend sein).

Derzeit kenne ich zwei Möglichkeiten, das Problem zu lösen:

跨域

Um ehrlich zu sein, verwende ich JSONP nicht besonders gerne. Ich habe das Gefühl, dass es Sicherheitsprobleme verursacht oder die Effizienz verringert (diese beiden Punkte sind nur meine Vermutungen).

Gründe für Spekulationen:

1. 
   Es kann von jeder Quelle aus zugegriffen werden. Gibt es eine JS-Injection?

   • Sowohl das Backend als auch das Frontend benötigen JSONP zur Verarbeitung. (Es ist nicht angenehm zu schreiben und alle Anfragen müssen JSONP verwenden.)

   Fügen Sie einen domänenübergreifenden Header im Backend hinzu

2. Wenn es viele Front-End-Domänennamen gibt, müssen viele Domänennamen hinzugefügt und verwaltet werden. Wenn andere Systeme Ihre Schnittstelle anfordern müssen, fügen Sie einen domänenübergreifenden Header hinzu? Nicht einfach damit umzugehen...

   Hat jemand eine bessere Lösung?
================【9-22 17:25】======================

Wenn Sie den domänenübergreifenden Header festlegen, können Sie außerdem die IP festlegen, die nur für interne Anrufe gilt. Wenn externe Aufrufe erforderlich sind, ist dies nicht der Fall. Außerdem bin ich mir nicht sicher, ob es Kompatibilitätsprobleme mit älteren Browserversionen gibt.

Antwortinhalt:

Wenn ich derzeit an meinem Blog arbeite, denke ich darüber nach, Front-End und Back-End zu trennen, die Front-End- und Back-End-Logik in zwei separaten Repositorys zu platzieren und sie auf zwei Servern bereitzustellen.

Mein Hauptdomainname ist:

(Derzeit verwende ich

, ein neuer Blog wird geschrieben...)

godtail.cnghostDer Front-End-Domainname lautet:

|

• Der Backend-Domainname lautet:

  www.godtail.cngodtail.cn m.godtail.cn

  Aber bei der Kommunikation stellte ich fest, dass es zu
kam. Ich dachte, dass es nicht domänenübergreifend sein würde, wenn der Hauptdomänenname derselbe wäre (derselbe Domänenname und unterschiedliche Ports würden auch domänenübergreifend sein).

• Derzeit kenne ich zwei Möglichkeiten, das Problem zu lösen: api.godtail.cn

Um ehrlich zu sein, verwende ich JSONP nicht besonders gerne. Ich habe das Gefühl, dass es Sicherheitsprobleme verursacht oder die Effizienz verringert (diese beiden Punkte sind nur meine Vermutungen).

跨域Gründe für Spekulationen:

1. Es kann von jeder Quelle aus zugegriffen werden. Gibt es eine JS-Injection?

   
   Sowohl das Backend als auch das Frontend benötigen JSONP zur Verarbeitung. (Es ist nicht angenehm zu schreiben und alle Anfragen müssen JSONP verwenden.)

   Fügen Sie einen domänenübergreifenden Header im Backend hinzu
   Wenn es viele Front-End-Domänennamen gibt, müssen viele Domänennamen hinzugefügt und verwaltet werden. Wenn andere Systeme Ihre Schnittstelle anfordern müssen, fügen Sie einen domänenübergreifenden Header hinzu? Nicht einfach damit umzugehen...

2. Hat jemand eine bessere Lösung?

   • ================【9-22 17:25】======================

   Wenn Sie den domänenübergreifenden Header festlegen, können Sie außerdem die IP festlegen, die nur für interne Anrufe gilt. Wenn externe Aufrufe erforderlich sind, ist dies nicht der Fall. Außerdem bin ich mir nicht sicher, ob es Kompatibilitätsprobleme mit älteren Browserversionen gibt.

Natürlich wird es im Back-End hinzugefügt

Was das von Ihnen erwähnte Problem zu vieler Domainnamen im Front-End betrifft, lassen Sie das Back-End einige Tricks anwenden, um damit umzugehen, kein Problem

Idee: Fügen Sie ein Ziel für

Domänennamen (

) anstelle eines fest codierten Domänennamens oder

hinzu

Ungefähre Implementierung (Pseudocode): Access-Control-Allow-Origin

Aber andererseits können Anforderungsheader simuliert werden, daher wird empfohlen, die Schnittstellenanforderungsparameter zu verschlüsseln und die Front-End-Skripte zu komprimieren und zu verschleiern.Access-Control-Allow-OriginBeziehen Sie sich auf die Schnittstellenverschlüsselung von NetEase Cloud Music (holen Sie sich das Paket und Schauen Sie mal reinOrigin 请求头 *

Erwägen Sie das Hinzufügen eines domänenübergreifenden Headers zum Backend, um alle Domänennamen zuzulassen, und filtern Sie dann die Domänennamen im Code. Domänennamen, die die Anforderungen nicht erfüllen, geben direkt 404 zurück.

<code>// 允许跨域访问的域名数组
string[] allowOrigins = 
{
    "http://www.godtail.cn/", 
    "http://godtail.cn/", 
    "http://m.godtail.cn/",
};

// 判断 origin 是否是自己的前端域名，如果是则添加
if(allowOrigins.Count(x => x.Contains(Request.Headers["Origin"])) > 0)
    Response.Header.Add("Access-Control-Allow-Origin", Request.Headers["Origin"]);</code>

Nginx-Reverse-Proxy... Es stellt sich heraus, dass Sie Ihre eigene Frage gestellt und beantwortet haben...

Setzen Sie den Header „Access-Control-Allow-Origin:*“ auf der Serverseite;

Das wurde oben erwähnt. Sie können die Zugangsadresse angeben~

Domänennamenweiterleitung auf einem Server, der keinen Front-End-Code verliert

Können domänenübergreifende Header nicht in regulärer Form geschrieben werden?

Die erste Methode, die ich übernommen habe, JSONP, Callback. Wenn es zu viele solcher Anfragen gibt, wird das Schreiben schwierig sein.
Die zweite Methode, die nicht funktioniert hat, nachdem ich sie ausprobiert habe, besteht darin, Access- festzulegen. auf die Antwort. Control-Allow-Origin..*?