Как отправлять заголовки в Express [MEAN] - PullRequest
Новая
       89

Как отправлять заголовки в Express [MEAN]

1 голос
/ 06 октября 2019

Я новичок в экспрессе. Так что, возможно, я не смог правильно сформулировать вопрос. Я создал MEAN-приложение, в котором разделил свои frontend и backened. Интерфейс работает на port:4200, а сервер - на port:3000. Я хотел запустить как интерфейс, так и сервер на одном и том же порту как часть развертывания. Я получаю сообщения об ошибках MIME, кто-то сказал мне, что есть проблема с моей серверной средой. Возможно я не отправляю заголовки должным образом. Вот мой код: я упомянул проверенные решения в самом коде как <----TRIED THIS

server.js 

const express = require('express');
express.static.mime.define({'application/javascript': ['js']}); <----TRIED THIS

const bodyParser = require('body-parser');
const path = require('path');

// express.static.mime.define({'application/javascript': ['js']}); <----TRIED THIS

const api = require('./routes/api');

const PORT = 3000;
const app = express();

app.use(express.static(path.join(__dirname, 'dist')));
app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

app.use('/api', api);

app.get('/', function(req, res) {

  // res.send('Hello from the server'); <----TRIED THIS
  // res.writeHead(200, {'Content-Type': 'text/html'}); <----TRIED THIS
  // res.set('Content-Type', 'text/plain'); <----TRIED THIS
  // res.setHeader("Content-Type","application/json"); <----TRIED THIS

  res.sendFile(path.join(__dirname, 'dist/application/index.html'));
})
app.listen(PORT, function() {
  console.log('Server listening on PORT '+PORT);
});

api.js Например, я показываю вам только функцию GET 

const express = require('express');
const router = express.Router();
const mongoose = require('mongoose');
const db = <my db string>;
const jwt = require('jsonwebtoken');

mongoose.connect(
 ...
)

function verifyToken(req, res, next) {
 ...
}

router.get('/myarticles', (req, res) => {
  var person="Tanzeel Mirza";
  console.log('Get request for tanzeel articles');
  Article.find({contributor: person}, (error, article) => {
    if(error) {
      console.log(error)
    }
    else {
      if(!article) {
        res.status(401).send('Invalid email')
      }
      else if(2>4) {
        console.log("test passed");
      }
      else {
        res.json(article);
      }
    }
  })
})

module.exports = router;

Но все же я получаю

Загрузка модуля из «http://localhost:3000/runtime-xxx.js” была заблокирована из-зазапрещенный тип MIME («text / html»).

Загрузка модуля из «http://localhost:3000/polyfills-xxx.js” заблокирована из-за запрещенного типа MIME (« text / html »).

загрузкамодуль из «http://localhost:3000/main-xxx.js” был заблокирован из-за недопустимого типа MIME (« text / html »).

Пожалуйста, исправьте меня.

PS: я задавал отдельные вопросыдля MIME ошибка здесь . Но ответов нет.

Ответы [ 2 ]

1 голос
/ 15 октября 2019

1. Создайте свой угловой проект внутри или вне папки сервера, используя ng build cmd.

2. Чтобы построить свой проект внутри сервера, измените путь к папке dist в angular-cli.

3.Чтобы изменить путь, либо используйте cli cmd, либо отредактируйте файл angular-cli.json "outDir": "./location/toYour/dist", либо используйте этот cli cmd ng build --output-path=dist/example/

4. Затем в корневом файле сервера. включите статическую папку build/dist, используя экспресс.

5. Нравится это app.use(express.static(path.join( 'your path to static folder')));

6. Теперь перезагрузите ваш сервер.

1 голос
/ 06 октября 2019

Поскольку ваши ресурсы находятся в папке dist / application, используйте app.use(express.static(path.join(__dirname, 'dist/application')));

Для соответствия всем маршрутам веб-приложений, используйте app.get('*', function(req, res) { res.sendFile(path.join(__dirname, 'dist/application/index.html')); }).

Это общий маршрут, и он будет вызван в действие, только если express не может найти другие маршруты и всегда обслуживает index.html. Например, любой действительный маршрут /api никогда не достигнет этого обработчика, поскольку существует определенный маршрут, который его обрабатывает.

Окончательный код для server.js 

const express = require('express');
const bodyParser = require('body-parser');
const path = require('path');


const api = require('./routes/api');

const PORT = 3000;
const app = express();

app.use(express.static(path.join(__dirname, 'dist/application')));
app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

app.use('/api', api);

app.get('*', function(req, res) {
  res.sendFile(path.join(__dirname, 'dist/application/index.html'));
})

app.listen(PORT, function() {
  console.log('Server listening on PORT '+PORT);
});

Несколько замечаний: нет.

Чтобы обслуживать статические файлы, вам не нужно устанавливать какие-либо заголовки вручную. Express ищет файлы в папке (папка dist в вашем случае), которую вы установили как статический каталог с помощью функции промежуточного программного обеспечения express.static. Express также устанавливает заголовки ответа на основе расширения файла.

Так что вам больше не нужно express.static.mime.define в вашем коде.

В вашем случае вы определили app.use(express.static(path.join(__dirname, 'dist')));, который прослушиваетстатические файлы в папке dist. В этой команде app.use вы не использовали путь монтирования, что означает, что все запросы будут проходить через статическое промежуточное ПО. Если промежуточное ПО находит ресурс с тем же именем, путем и расширением в папке dist, оно возвращает файл, в противном случае запрос передается другим обработчикам маршрутов.

Кроме того, если вы используете статическое промежуточное ПО, еслитак как в папке dist есть index.html (непосредственный дочерний элемент папки dist), ваш обработчик маршрута для «/» никогда не будет вызван, так как ответ будет обслуживаться промежуточным ПО.

Если вы этого не сделаетеу вас есть индексный html-файл в папке dist (непосредственный дочерний элемент dist), но он присутствует где-то в подпапках dist, и все же вам нужно получить к нему доступ, используя корневой путь "/", только тогда вам понадобится обработчик маршрута для пути "/"как показано ниже. 

app.get("/", function(req, res) {
  res.sendFile(path.join(__dirname, "dist/application/index.html"));
});

Файлы JS, указанные с использованием "./" в dist/application/index.html, относятся к самой папке dist и папке NOT dist/application.

Youможете ссылаться на этот REPL для обновленного кода ?. https://repl.it/repls/SoreFearlessNagware

Попробуйте указать ниже URL-адреса

/api/myarticles - Предоставлено обработчиком маршрута "/ api"

/api/myarticles.js - Предоставлено промежуточным ПО статического ресурса, поскольку файл существует впапка dist / api

/ - отображается с использованием обработчика маршрута "/" и res.sendFile, поскольку index.html не существует в папке dist.

/test.js - отображается с использованием статическогопромежуточное ПО, поскольку файл существует в папке dist

Дополнительные ссылки для справки.

https://expressjs.com/en/api.html#res.sendFile

https://expressjs.com/en/starter/static-files.html

...