T5機房服務(wù)器，請求接口

本文主要介紹如何用Nginx解決前端跨域問題，具有一定的參考價值。有興趣的朋友可以參考一下。希望你看完這篇文章后收獲很大。讓海外主機帶你去理解它。

前言

在開發(fā)靜態(tài)頁面的時候，我們經(jīng)常會調(diào)用一些類似Vue的接口，很可能是跨域的，然后瀏覽器會報告跨源問題。

最簡單的解決方案是將瀏覽器設(shè)置為忽略安全問題，并設(shè)置-禁用-網(wǎng)絡(luò)安全。不過這樣開發(fā)PC頁面沒問題，如果是移動頁面就不行了。

解決辦法

使用Nginx轉(zhuǎn)發(fā)請求。將跨域接口寫成本地域接口，然后將這些接口轉(zhuǎn)發(fā)到真實的請求地址。

舉個栗子

例如，我們正在開發(fā)一個Vue應(yīng)用程序。

原先：

調(diào)試頁面是：http://192.168.1.10033608080/

請求的接口是：http://ni.hao.sao/api/get/info

步驟一：

請求的接口是：http://192 . 168 . 1 . 10033608080/API/get/info

PS:這樣解決了跨域問題。

步驟二：

轉(zhuǎn)到/usr/local/etc/Nginx/directory，在Nginx安裝后修改nginx.conf文件。

步驟三：

注釋掉默認的服務(wù)器配置。

添加以下內(nèi)容：

服務(wù)器{

listen8888

server _ name 192 . 168 . 1 . 100；

位置/

proxy _ pass http://192 . 168 . 1 . 10033608088

}

位置/api{

proxy _ pass http://ni . Hao . Sao/API；

}

}保存后，啟動Nginx。

PS:你不需要太了解Nginx配置，很簡單。

步驟四：

訪問：http://192.168.1.10033608888

搞定。

PS:注意，訪問的端口是‘8888’，所以只需在其他域的地址中添加位置即可。

錯誤演示

剛開始對Nginx的配置不太了解，覺得可以配置如下。

服務(wù)器{

listen8080

server _ name 192 . 168 . 1 . 100；

位置/api{

proxy _ pass http://ni . Hao . Sao/API；

}

}之所以寫這個，是因為我覺得這樣可以讓Nginx幫我監(jiān)控8080請求，然后只轉(zhuǎn)發(fā)匹配的請求。我沒有意識到的是Nginx寫成這樣之

由于需要占用端口，所以無法再被相同協(xié)議的其他進程占用，從而導(dǎo)致無法用8080端口啟用的頁面的開發(fā)。同事提了一點后，我想起來了，改變了思路，拿到了頂法。

感謝您仔細閱讀本文。希望海外主機分享的文章《如何用Nginx解決前端跨域問題》對大家有所幫助。也希望大家支持海外主機，關(guān)注海外主機，更多相關(guān)知識等著你去學(xué)習(xí)！

Tags：T5機房服務(wù)器，請求接口，怎么用Nginx解決前端跨域問題

版權(quán)聲明：本站文章來源標注為YINGSOO的內(nèi)容版權(quán)均為本站所有，歡迎引用、轉(zhuǎn)載，請保持原文完整并注明來源及原文鏈接。禁止復(fù)制或仿造本網(wǎng)站，禁止在非maisonbaluchon.cn所屬的服務(wù)器上建立鏡像，否則將依法追究法律責(zé)任。本站部分內(nèi)容來源于網(wǎng)友推薦、互聯(lián)網(wǎng)收集整理而來，僅供學(xué)習(xí)參考，不代表本站立場，如有內(nèi)容涉嫌侵權(quán)，請聯(lián)系alex-e#qq.com處理。