フロントエンド開発にSwagger Editorから自動生成できるサーバーをローカルで利用しようとしたらCORS制約で通信が出来なかったことがきっかけで記事を書いています。
ローカルでSwagger Editorから自動生成されたAPIサーバーのソースコードに手を加えてCORSを許可する方法を記載しています。
対象サーバーはnodejs-serverです。
※Swagger 2.0仕様でダウンロードしたAPIサーバーです。
パッケージ「cors」をインストール
「cors」というパッケージを導入します。
https://www.npmjs.com/package/cors
npm install cors --save
ソースコードを編集して「cors」を適用する
ダウンロードしたフォルダの「index.js」を編集します。
※ この方法は全てのリクエストを許可する設定です。細かい設定はcorsのドキュメントを参照してください。
https://www.npmjs.com/package/cors
'use strict';
var app = require('connect')();
+ var cors = require('cors'); // ここを追加します。
var http = require('http');
var swaggerTools = require('swagger-tools');
var jsyaml = require('js-yaml');
var fs = require('fs');
var serverPort = 8080;
// swaggerRouter configuration
var options = {
swaggerUi: '/swagger.json',
controllers: './controllers',
useStubs: process.env.NODE_ENV === 'development' ? true : false // Conditionally turn on stubs (mock mode)
};
// The Swagger document (require it, build it programmatically, fetch it from a URL, ...)
var spec = fs.readFileSync('./api/swagger.yaml', 'utf8');
var swaggerDoc = jsyaml.safeLoad(spec);
// Initialize the Swagger middleware
swaggerTools.initializeMiddleware(swaggerDoc, function (middleware) {
+ app.use(cors()); // ここを追加します。
// Interpret Swagger resources and attach metadata to request - must be first in swagger-tools middleware chain
app.use(middleware.swaggerMetadata());
// Validate Swagger requests
app.use(middleware.swaggerValidator());
// Route validated requests to appropriate controller
app.use(middleware.swaggerRouter(options));
// Serve the Swagger documents and Swagger UI
app.use(middleware.swaggerUi());
// Start the server
http.createServer(app).listen(serverPort, function () {
console.log('Your server is listening on port %d (http://localhost:%d)', serverPort, serverPort);
console.log('Swagger-ui is available on http://localhost:%d/docs', serverPort);
});
});
サーバー起動
後は残りのパッケージをインストールして、通常通りサーバーを起動するのみです。
npm install
npm start