成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

NodeJS+Express遇到的跨域問(wèn)題

DTeam / 2414人閱讀

摘要：它允許瀏覽器向跨源服務(wù)器，發(fā)出請(qǐng)求，從而克服了只能同源使用的限制。詳細(xì)的描述戳這里解決方法設(shè)置跨域訪問(wèn)中的配置含義戳這里這里是用于的模塊完

項(xiàng)目描述

用Express 搭建的服務(wù)開(kāi)在http://localhost:3000/
前端webpack-dev-server 服務(wù)開(kāi)在http://localhost:3001/

然后從前端頁(yè)面給后端接口發(fā)送刪除和更新數(shù)據(jù)操作時(shí)報(bào)錯(cuò)如下：

XMLHttpRequest cannot load http://localhost:3000/comments/597c4ef56fd60ba4ff6ec54f. Method DELETE is not allowed by Access-Control-Allow-Methods in preflight response.
概念描述

CORS是一個(gè)W3C標(biāo)準(zhǔn)，全稱是"跨域資源共享"（Cross-origin resource sharing）。
它允許瀏覽器向跨源服務(wù)器，發(fā)出XMLHttpRequest請(qǐng)求，從而克服了AJAX只能同源使用的限制。
怎么就算跨域了？
當(dāng)一個(gè)資源從與該資源本身所在的服務(wù)器不同的域或端口不同的域或不同的端口請(qǐng)求一個(gè)資源時(shí)，資源會(huì)發(fā)起一個(gè)跨域 HTTP 請(qǐng)求。
比如，站點(diǎn) http://domain-a.com 的某 HTML 頁(yè)面通過(guò) 的 src 請(qǐng)求 http://domain-b.com/image.jpg。網(wǎng)絡(luò)上的許多頁(yè)面都會(huì)加載來(lái)自不同域的CSS樣式表，圖像和腳本等資源。
詳細(xì)的描述戳這里

解決方法 
var express = require("express");
var app = express();
var router = express.Router();
var mongoose = require("mongoose");
var Comment = require("./model/comments");

//設(shè)置跨域訪問(wèn)
app.all("*", function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "X-Requested-With");
    res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
    res.header("X-Powered-By"," 3.2.1")
    res.header("Content-Type", "application/json;charset=utf-8");
    next();
});

//Delete API
router.delete("/comments/:comment_id",function(req,res){

    Comment.remove({_id: req.params.comment_id},function(err,comment){
        if(err)
            res.send(err)
        res.json({ message: "Comment has been deleted"})
    })
})

app.use("/",router);

app.listen(3000);
console.log("Listening on port 3000...");

header中的配置含義戳這里
這里是用于cors的模塊：Node.js CORS middleware
（完）

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/84453.html

相關(guān)文章

  • 九種 “姿勢(shì)” 讓你徹底解決跨域問(wèn)題

    摘要：什么是跨域當(dāng)協(xié)議域名端口號(hào)，有一個(gè)或多個(gè)不同時(shí)，有希望可以訪問(wèn)并獲取數(shù)據(jù)的現(xiàn)象稱為跨域訪問(wèn)，同源策略限制下都是不支持跨域的。命名是隨意的，只要是符合一級(jí)域名與二級(jí)域名的關(guān)系即可，然后訪問(wèn)。 showImg(https://segmentfault.com/img/remote/1460000018998493); 閱讀原文 同源策略 同源策略/SOP（Same origin pol...

    charles_paul 評(píng)論0 收藏0

  • You don't know cross-origin

    摘要：為什么會(huì)存在跨域問(wèn)題同源策略由于出于安全考慮，瀏覽器規(guī)定不能操作其他域下的頁(yè)面，不能接受其他域下的請(qǐng)求不只是，引用非同域下的字體文件，還有引用非同域下的圖片，也被同源策略所約束只要協(xié)議域名端口有一者不同，就被視為非同域。 showImg(https://segmentfault.com/img/remote/1460000017093859?w=1115&h=366); Why 為什么...

    hersion 評(píng)論0 收藏0

  • 那些年曾談起的跨域

    摘要：在中，在不同的域名下面進(jìn)行數(shù)據(jù)交互，就會(huì)遇到跨域問(wèn)題，說(shuō)到跨域首先要從同源說(shuō)起，瀏覽器為了提供一種安全的運(yùn)行環(huán)境，各個(gè)瀏覽器廠商協(xié)定使用同源策略。在上面說(shuō)過(guò)是不受同源策略限制的，但是出于安全原因，瀏覽器限制從腳本內(nèi)發(fā)起的跨源請(qǐng)求。 對(duì)于前端開(kāi)發(fā)來(lái)說(shuō)跨域應(yīng)該是最不陌生的問(wèn)題了，無(wú)論是開(kāi)發(fā)過(guò)程中還是在面試過(guò)程中都是一個(gè)經(jīng)常遇到的一個(gè)問(wèn)題，在開(kāi)發(fā)過(guò)程中遇到這個(gè)問(wèn)題的話一般都是找后端同學(xué)去解決...

    galois 評(píng)論0 收藏0

  • 前端常見(jiàn)跨域解決方案（全）

    摘要：需注意的是由于同源策略的限制，所讀取的為跨域請(qǐng)求接口所在域的，而非當(dāng)前頁(yè)。目前，所有瀏覽器都支持該功能需要使用對(duì)象來(lái)支持，也已經(jīng)成為主流的跨域解決方案。反向代理接口跨域跨域原理同源策略是瀏覽器的安全策略，不是協(xié)議的一部分。 什么是跨域？ 跨域是指一個(gè)域下的文檔或腳本試圖去請(qǐng)求另一個(gè)域下的資源，這里跨域是廣義的。 廣義的跨域： 1.) 資源跳轉(zhuǎn)： A鏈接、重定向、表單提交 2.) 資源...

    canger 評(píng)論0 收藏0

  • 理解跨域及常用解決方案

    摘要：跨域的產(chǎn)生不用多講，作為一名前端開(kāi)發(fā)人員，相信大家都知道跨域是因?yàn)闉g覽器的同源策略所導(dǎo)致的。瀏覽器引入同源策略主要是為了防止，攻擊。其指明了實(shí)際請(qǐng)求所允許使用的方法。 跨域，相信大家無(wú)論是在工作中還是在面試中經(jīng)常遇到這個(gè)問(wèn)題，常常在網(wǎng)上看到別人所整理的一些方法，看似知道是怎么回事，但如果沒(méi)有動(dòng)手實(shí)踐過(guò)，總覺(jué)得自己沒(méi)有真正的掌握，在這里，通過(guò)自己認(rèn)真思考整理一些常用的方法。 跨域的產(chǎn)生 ...

    paney129 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<