獲取405錯誤，節點js

Question

我想在節點js中運行服務器，它實際上是一個graphql服務器。我打電話是從客戶端的方法，從反應JS

客戶端在本地主機上運行：3000，和服務器端在本地主機：4000

客戶端代碼

var dice = 3; 
var sides = 6; 
var xhr = new XMLHttpRequest(); 
xhr.responseType = 'json'; 
xhr.open("POST", "http://localhost:4000/graphql"); 
xhr.setRequestHeader("Content-Type", "application/json"); 
xhr.setRequestHeader("Accept", "application/json"); 
xhr.onload = function() { 
    debugger; 
    console.log('data returned:', xhr.response); 
} 
var query = `query RollDice($dice: Int!, $sides: Int) { 
    rollDice(numDice: $dice, numSides: $sides) 
}`; 
xhr.send(JSON.stringify({ 
    query: query, 
    variables: { dice: dice, sides: sides }, 
})); 

，並在服務器一邊我使用下面的代碼

var express = require('express'); 
var graphqlHTTP = require('express-graphql'); 
var { buildSchema } = require('graphql'); 

// Construct a schema, using GraphQL schema language 
var schema = buildSchema(` 
    type Query { 
    rollDice(numDice: Int!, numSides: Int): [Int] 
    } 
`); 

// The root provides a resolver function for each API endpoint 
var root = { 
    rollDice: function ({numDice, numSides}) { 
    var output = []; 
    for (var i = 0; i < numDice; i++) { 
     output.push(1 + (numSides *3)); 
    } 
    return output; 
    } 
}; 

var app = express(); 
//CORS middleware 
app.use(function (req, res, next) { 

    // Website you wish to allow to connect 
    res.setHeader('Access-Control-Allow-Origin', 'http://localhost:3000'); 

    // Request methods you wish to allow 
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE'); 

    // Request headers you wish to allow 
    res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type'); 

    // Set to true if you need the website to include cookies in the requests sent 
    // to the API (e.g. in case you use sessions) 
    res.setHeader('Access-Control-Allow-Credentials', true); 

    // Pass to next layer of middleware 
    next(); 
}); 

app.use('/graphql', graphqlHTTP({ 
    schema: schema, 
    rootValue: root, 
    graphiql: true, 
})); 
app.listen(4000); 
console.log('Running a GraphQL API server at localhost:4000/graphql'); 

我得到的錯誤是

XMLHttpRequest無法加載http://localhost:4000/graphql。預檢響應具有無效的HTTP狀態碼405

有什麼我很想念......

感謝。

Answer 1

您需要通過正確響應OPTIONS來處理你的代碼CORS飛行前請求（OPTIONS）要求：

function (req, res, next) { 

    // Website you wish to allow to connect 
    res.setHeader('Access-Control-Allow-Origin', 'http://localhost:3000'); 

    // Request methods you wish to allow 
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE'); 

    // Request headers you wish to allow 
    res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type'); 

    // Set to true if you need the website to include cookies in the requests sent 
    // to the API (e.g. in case you use sessions) 
    res.setHeader('Access-Control-Allow-Credentials', true); 

    // Pass to next layer of middleware 

    if (req.method === "OPTIONS") { 
     return res.status(200).end(); 
    } 

    return next(); 
}